gxxc-ui 1.0.0

package/dist/ImageUI/index.js

@@ -0,0 +1,159 @@
+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 _excluded = ["className", "src", "preview", "maskType", "clickOtherButton", "style"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+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 _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import { DownloadOutlined, RotateLeftOutlined, RotateRightOutlined, SwapOutlined, UndoOutlined, ZoomInOutlined, ZoomOutOutlined } from '@ant-design/icons';
+import { Image, Space } from 'antd';
+import React from 'react';
+import { IconUI } from "./..";
+import "./index.scss";
+var ImageUI = function ImageUI(props) {
+  var className = props.className,
+    src = props.src,
+    preview = props.preview,
+    _props$maskType = props.maskType,
+    maskType = _props$maskType === void 0 ? 1 : _props$maskType,
+    clickOtherButton = props.clickOtherButton,
+    style = props.style,
+    otherProps = _objectWithoutProperties(props, _excluded);
+  var onDownload = function onDownload() {
+    fetch(src).then(function (response) {
+      return response.blob();
+    }).then(function (blob) {
+      var url = URL.createObjectURL(new Blob([blob]));
+      var link = document.createElement('a');
+      link.href = url;
+      link.download = 'image.png';
+      document.body.appendChild(link);
+      link.click();
+      URL.revokeObjectURL(url);
+      link.remove();
+    });
+  };
+  var clickRight = function clickRight(e) {
+    e.stopPropagation();
+    if (clickOtherButton) {
+      clickOtherButton();
+    }
+  };
+
+  //蒙层类型
+  var renderMask = function renderMask() {
+    switch (maskType) {
+      case 1:
+        return /*#__PURE__*/React.createElement("div", {
+          className: "sicImageUI-mask"
+        }, /*#__PURE__*/React.createElement(IconUI, {
+          name: "PreviewOpen",
+          size: "14",
+          fill: "#fff"
+        }), /*#__PURE__*/React.createElement("div", {
+          className: "sicImageUI-mask-name"
+        }, "\u9884\u89C8"));
+      case 2:
+        return /*#__PURE__*/React.createElement("div", {
+          className: "sicImageUI-mask"
+        }, /*#__PURE__*/React.createElement("div", {
+          className: "sicImageUI-mask-left"
+        }, /*#__PURE__*/React.createElement(IconUI, {
+          name: "PreviewOpen",
+          size: "14",
+          fill: "#fff"
+        }), /*#__PURE__*/React.createElement("div", {
+          className: "sicImageUI-mask-name"
+        }, "\u9884\u89C8")), /*#__PURE__*/React.createElement("div", {
+          className: "sicImageUI-mask-right",
+          onClick: clickRight
+        }, /*#__PURE__*/React.createElement(IconUI, {
+          name: "Export",
+          size: "14",
+          fill: "#fff"
+        }), /*#__PURE__*/React.createElement("div", {
+          className: "sicImageUI-mask-name"
+        }, "\u4E0A\u4F20")));
+      case 3:
+        return /*#__PURE__*/React.createElement("div", {
+          className: "sicImageUI-mask"
+        }, /*#__PURE__*/React.createElement("div", {
+          className: "sicImageUI-mask-left"
+        }, /*#__PURE__*/React.createElement(IconUI, {
+          name: "PreviewOpen",
+          size: "14",
+          fill: "#fff"
+        }), /*#__PURE__*/React.createElement("div", {
+          className: "sicImageUI-mask-name"
+        }, "\u9884\u89C8")), /*#__PURE__*/React.createElement("div", {
+          className: "sicImageUI-mask-right",
+          onClick: clickRight
+        }, /*#__PURE__*/React.createElement(IconUI, {
+          name: "Delete",
+          size: "14",
+          fill: "var(--red)"
+        }), /*#__PURE__*/React.createElement("div", {
+          className: "sicImageUI-mask-delete"
+        }, "\u5220\u9664")));
+      default:
+        return /*#__PURE__*/React.createElement("div", {
+          className: "sicImageUI-mask"
+        }, /*#__PURE__*/React.createElement(IconUI, {
+          name: "PreviewOpen",
+          size: "14",
+          fill: "#fff"
+        }), /*#__PURE__*/React.createElement("div", {
+          className: "sicImageUI-mask-name"
+        }, "\u9884\u89C8"));
+    }
+  };
+  var previewConfig = {
+    mask: renderMask(),
+    toolbarRender: function toolbarRender(_, _ref) {
+      var scale = _ref.transform.scale,
+        _ref$actions = _ref.actions,
+        onFlipY = _ref$actions.onFlipY,
+        onFlipX = _ref$actions.onFlipX,
+        onRotateLeft = _ref$actions.onRotateLeft,
+        onRotateRight = _ref$actions.onRotateRight,
+        onZoomOut = _ref$actions.onZoomOut,
+        onZoomIn = _ref$actions.onZoomIn,
+        onReset = _ref$actions.onReset;
+      return /*#__PURE__*/React.createElement(Space, {
+        size: 12,
+        className: "sicImageUI-toolbar"
+      }, /*#__PURE__*/React.createElement(DownloadOutlined, {
+        onClick: onDownload
+      }), /*#__PURE__*/React.createElement(SwapOutlined, {
+        rotate: 90,
+        onClick: onFlipY
+      }), /*#__PURE__*/React.createElement(SwapOutlined, {
+        onClick: onFlipX
+      }), /*#__PURE__*/React.createElement(RotateLeftOutlined, {
+        onClick: onRotateLeft
+      }), /*#__PURE__*/React.createElement(RotateRightOutlined, {
+        onClick: onRotateRight
+      }), /*#__PURE__*/React.createElement(ZoomOutOutlined, {
+        disabled: scale === 1,
+        onClick: onZoomOut
+      }), /*#__PURE__*/React.createElement(ZoomInOutlined, {
+        disabled: scale === 50,
+        onClick: onZoomIn
+      }), /*#__PURE__*/React.createElement(UndoOutlined, {
+        onClick: onReset
+      }));
+    }
+  };
+  var mergedPreview = typeof preview === 'boolean' ? preview : _objectSpread(_objectSpread({}, previewConfig), preview);
+  return /*#__PURE__*/React.createElement("div", {
+    className: "sicImageUI ".concat(className !== null && className !== void 0 ? className : ''),
+    style: style
+  }, /*#__PURE__*/React.createElement(Image, _extends({
+    src: src,
+    preview: mergedPreview
+  }, otherProps)));
+};
+export default ImageUI;

package/dist/ImageUI/index.scss

@@ -0,0 +1,59 @@
+.sicImageUI {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  .ant-image {
+    width: 100%;
+    height: 100%;
+  }
+  .ant-image-img {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+  }
+  &-mask {
+    width: 100%;
+    height: 100%;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    &-left,
+    &-right {
+      width: 50%;
+      height: 100%;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+    .sicImageUI-mask-name {
+      margin-left: 2px;
+    }
+    .sicImageUI-mask-delete {
+      margin-left: 2px;
+      color: var(--red);
+    }
+  }
+
+  &-toolbar {
+    position: fixed;
+    bottom: 32px;
+    left: 50%;
+    padding: 0px 24px;
+    color: #fff;
+    font-size: 20px;
+    background-color: rgba(0, 0, 0, 0.1);
+    border-radius: 100px;
+    transform: translateX(-50%);
+    .anticon {
+      padding: 12px;
+      cursor: pointer;
+    }
+    .anticon[disabled] {
+      cursor: not-allowed;
+      opacity: 0.3;
+    }
+    .anticon:hover {
+      opacity: 0.3;
+    }
+  }
+}

package/dist/InputUI/index.d.ts

@@ -0,0 +1,7 @@
+import React from 'react';
+import './index.scss';
+declare const InputUI: {
+    (props: any): React.JSX.Element;
+    Range: (props: any) => React.JSX.Element;
+};
+export default InputUI;

package/dist/InputUI/index.js

@@ -0,0 +1,114 @@
+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 _excluded = ["value", "onChange", "onchangeTime"];
+function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
+function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
+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 _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+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; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import React, { useState, useEffect } from 'react';
+import { Input, InputNumber } from 'antd';
+import "./index.scss";
+var timer;
+var InputUI = function InputUI(props) {
+  var value = props.value,
+    onChange = props.onChange,
+    onchangeTime = props.onchangeTime,
+    otherProps = _objectWithoutProperties(props, _excluded);
+  var _useState = useState(),
+    _useState2 = _slicedToArray(_useState, 2),
+    reactValue = _useState2[0],
+    setReactValue = _useState2[1];
+  useEffect(function () {
+    setReactValue(value);
+    return function () {
+      clearTimeout(timer);
+    };
+  }, [value]);
+  var valueChange = function valueChange(e) {
+    var _e$target;
+    setReactValue(e === null || e === void 0 || (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.value);
+    if (onchangeTime) {
+      clearTimeout(timer);
+      timer = setTimeout(function () {
+        var _e$target2;
+        onChange === null || onChange === void 0 || onChange(e === null || e === void 0 || (_e$target2 = e.target) === null || _e$target2 === void 0 ? void 0 : _e$target2.value);
+      }, onchangeTime);
+    } else {
+      var _e$target3;
+      onChange === null || onChange === void 0 || onChange(e === null || e === void 0 || (_e$target3 = e.target) === null || _e$target3 === void 0 ? void 0 : _e$target3.value);
+    }
+  };
+  return /*#__PURE__*/React.createElement(Input, _extends({
+    value: reactValue,
+    onChange: function onChange(e) {
+      return valueChange(e);
+    }
+  }, otherProps));
+};
+var Range = function Range(props) {
+  var _value$input, _value$input2;
+  var value = props.value,
+    onChange = props.onChange,
+    min = props.min,
+    max = props.max,
+    _props$placeholder = props.placeholder,
+    placeholder = _props$placeholder === void 0 ? ['请输入', '请输入'] : _props$placeholder,
+    style = props.style;
+  var _useState3 = useState(),
+    _useState4 = _slicedToArray(_useState3, 2),
+    input1 = _useState4[0],
+    setInput1 = _useState4[1];
+  var _useState5 = useState(),
+    _useState6 = _slicedToArray(_useState5, 2),
+    input2 = _useState6[0],
+    setInput2 = _useState6[1];
+  var triggerChange = function triggerChange(changedValue) {
+    onChange === null || onChange === void 0 || onChange(_objectSpread(_objectSpread({
+      input1: input1,
+      input2: input2
+    }, value), changedValue));
+  };
+  var onInput1 = function onInput1(e) {
+    setInput1(e);
+    triggerChange({
+      input1: e
+    });
+  };
+  var onInput2 = function onInput2(e) {
+    setInput2(e);
+    triggerChange({
+      input2: e
+    });
+  };
+  return /*#__PURE__*/React.createElement("div", {
+    className: "sic-inputui-range",
+    style: style
+  }, /*#__PURE__*/React.createElement(InputNumber, {
+    className: "range-input1",
+    placeholder: placeholder[0],
+    min: min,
+    max: max,
+    value: (_value$input = value === null || value === void 0 ? void 0 : value.input1) !== null && _value$input !== void 0 ? _value$input : input1,
+    onChange: onInput1
+  }), /*#__PURE__*/React.createElement("span", {
+    className: "range-to"
+  }, " - "), /*#__PURE__*/React.createElement(InputNumber, {
+    className: "range-input2",
+    placeholder: placeholder[1],
+    min: min,
+    max: max,
+    value: (_value$input2 = value === null || value === void 0 ? void 0 : value.input2) !== null && _value$input2 !== void 0 ? _value$input2 : input2,
+    onChange: onInput2
+  }));
+};
+InputUI.Range = Range;
+export default InputUI;

package/dist/InputUI/index.scss

@@ -0,0 +1,24 @@
+.sic-inputui-range {
+  width: 100%;
+  border: 1px solid #d9d9d9;
+  border-radius: 6px;
+  display: flex;
+  align-items: center;
+  .ant-input-number-outlined {
+    border: none;
+  }
+  .ant-input-number-input {
+    text-align: center;
+  }
+  .range-input1,
+  .range-input2 {
+    width: calc((100% - 20px) / 2);
+  }
+  .range-to {
+    width: 20px;
+    height: 20px;
+    line-height: 20px;
+    text-align: center;
+    color: #d9d9d9;
+  }
+}

package/dist/LoadingUI/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import './index.scss';
+declare const LoadingUI: (props: any) => React.JSX.Element;
+export default LoadingUI;

package/dist/LoadingUI/index.js

@@ -0,0 +1,13 @@
+import React from 'react';
+import "./index.scss";
+var LoadingUI = function LoadingUI(props) {
+  var _props$isShowLoading = props.isShowLoading,
+    isShowLoading = _props$isShowLoading === void 0 ? true : _props$isShowLoading,
+    children = props.children;
+  return /*#__PURE__*/React.createElement(React.Fragment, null, isShowLoading ? /*#__PURE__*/React.createElement("div", {
+    className: "sic-loadingui"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "sic-loadingui-animation"
+  })) : children);
+};
+export default LoadingUI;

package/dist/LoadingUI/index.scss

@@ -0,0 +1,47 @@
+.sic-loadingui {
+  width: 100%;
+  height: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  &-animation {
+    width: 100px;
+    height: 100px;
+    border-radius: 50%;
+    position: relative;
+    animation: rotate 1s linear infinite;
+  }
+  &-animation::before {
+    content: '';
+    box-sizing: border-box;
+    position: absolute;
+    inset: 0px;
+    border-radius: 50%;
+    border: 6px solid var(--themeColor);
+    animation: prixClipFix 5s linear infinite;
+  }
+}
+
+@keyframes rotate {
+  100% {
+    transform: rotate(360deg);
+  }
+}
+
+@keyframes prixClipFix {
+  0% {
+    clip-path: polygon(50% 50%, 0 0, 0 0, 0 0, 0 0, 0 0);
+  }
+  25% {
+    clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 0, 100% 0, 100% 0);
+  }
+  50% {
+    clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 100% 100%, 100% 100%);
+  }
+  75% {
+    clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 100%);
+  }
+  100% {
+    clip-path: polygon(50% 50%, 0 0, 100% 0, 100% 100%, 0 100%, 0 0);
+  }
+}

package/dist/MessageUI/index.d.ts

@@ -0,0 +1,3 @@
+import { message as MessageUI } from 'antd';
+import './index.scss';
+export default MessageUI;

package/dist/MessageUI/index.js

@@ -0,0 +1,9 @@
+import { message as MessageUI } from 'antd';
+import "./index.scss";
+MessageUI.config({
+  duration: 3,
+  maxCount: 3,
+  rtl: false,
+  prefixCls: 'sic-message'
+});
+export default MessageUI;

package/dist/MessageUI/index.scss

@@ -0,0 +1,50 @@
+.sic-message {
+  top: 5%;
+  .sic-message-notice-wrapper {
+    .sic-message-notice-content {
+      padding: 0;
+
+      .sic-message-success,
+      .sic-message-error,
+      .sic-message-info,
+      .sic-message-warning,
+      .sic-message-loading {
+        > .anticon {
+          color: #fff;
+          font-size: 18px;
+        }
+      }
+      .sic-message-custom-content {
+        color: #fff;
+        font-size: 18px;
+        line-height: 22px;
+        font-family: var(--fontFamily);
+        font-weight: bold;
+      }
+      .anticon-check-circle,
+      .anticon-close-circle {
+        color: #fff;
+      }
+      .sic-message-custom-content {
+        box-sizing: border-box;
+        padding: 20px 20px;
+        border-radius: 8px;
+      }
+      .sic-message-success {
+        background-color: #38b865;
+      }
+      .sic-message-error {
+        background-color: var(--red);
+      }
+      .sic-message-info {
+        background-color: #2e64fa;
+      }
+      .sic-message-warning {
+        background-color: #faad14;
+      }
+      .sic-message-loading {
+        background-color: #2e64fa;
+      }
+    }
+  }
+}

package/dist/ModalUI/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import './index.scss';
+declare const ModalUI: (props: any) => React.JSX.Element;
+export default ModalUI;

package/dist/ModalUI/index.js

@@ -0,0 +1,98 @@
+var _excluded = ["className", "isOpen", "setIsOpen", "title", "icon", "type", "confirm", "children"];
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+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; }
+function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import React, { useRef, useState, Fragment } from 'react';
+import { Modal } from 'antd';
+import Draggable from 'react-draggable';
+import "./index.scss";
+var RenderTitle = function RenderTitle(title, icon, type) {
+  return /*#__PURE__*/React.createElement(Fragment, null, (title || icon) && /*#__PURE__*/React.createElement("div", {
+    className: "sicModalui-header"
+  }, title && /*#__PURE__*/React.createElement("div", null, title), icon && /*#__PURE__*/React.createElement("div", {
+    className: "sicModalui-header-icon ".concat(type !== null && type !== void 0 ? type : '')
+  }, icon)));
+};
+var ModalUI = function ModalUI(props) {
+  var className = props.className,
+    isOpen = props.isOpen,
+    setIsOpen = props.setIsOpen,
+    title = props.title,
+    icon = props.icon,
+    type = props.type,
+    confirm = props.confirm,
+    children = props.children,
+    otherProps = _objectWithoutProperties(props, _excluded);
+  var _useState = useState(true),
+    _useState2 = _slicedToArray(_useState, 2),
+    disabled = _useState2[0],
+    setDisabled = _useState2[1];
+  var _useState3 = useState({
+      left: 0,
+      top: 0,
+      bottom: 0,
+      right: 0
+    }),
+    _useState4 = _slicedToArray(_useState3, 2),
+    bounds = _useState4[0],
+    setBounds = _useState4[1];
+  var draggleRef = useRef(null);
+  var _onStart = function onStart(_event, uiData) {
+    var _draggleRef$current;
+    var _window$document$docu = window.document.documentElement,
+      clientWidth = _window$document$docu.clientWidth,
+      clientHeight = _window$document$docu.clientHeight;
+    var targetRect = (_draggleRef$current = draggleRef.current) === null || _draggleRef$current === void 0 ? void 0 : _draggleRef$current.getBoundingClientRect();
+    if (!targetRect) {
+      return;
+    }
+    setBounds({
+      left: -targetRect.left + uiData.x,
+      right: clientWidth - (targetRect.right - uiData.x),
+      top: -targetRect.top + uiData.y,
+      bottom: clientHeight - (targetRect.bottom - uiData.y)
+    });
+  };
+  return /*#__PURE__*/React.createElement(Modal, _extends({
+    className: "sicModalui ".concat(className !== null && className !== void 0 ? className : '', " ").concat(type !== null && type !== void 0 ? type : ''),
+    open: isOpen,
+    title: /*#__PURE__*/React.createElement("div", {
+      style: {
+        width: '100%',
+        cursor: 'move'
+      },
+      onMouseOver: function onMouseOver() {
+        if (disabled) {
+          setDisabled(false);
+        }
+      },
+      onMouseOut: function onMouseOut() {
+        return setDisabled(true);
+      }
+    }, RenderTitle(title, icon, type)),
+    onCancel: function onCancel() {
+      return setIsOpen(undefined);
+    },
+    onOk: confirm,
+    closeIcon: !icon,
+    modalRender: function modalRender(modal) {
+      return /*#__PURE__*/React.createElement(Draggable, {
+        disabled: disabled,
+        bounds: bounds,
+        nodeRef: draggleRef,
+        onStart: function onStart(event, uiData) {
+          return _onStart(event, uiData);
+        }
+      }, /*#__PURE__*/React.createElement("div", {
+        ref: draggleRef
+      }, modal));
+    }
+  }, otherProps), children);
+};
+export default ModalUI;

package/dist/ModalUI/index.scss

@@ -0,0 +1,45 @@
+.sicModalui {
+  .ant-modal-content {
+    padding: 12px 20px;
+    border-radius: 0;
+    .ant-modal-close {
+      width: 20px;
+      height: 20px;
+      inset-inline-end: 20px;
+    }
+    .ant-modal-header {
+      margin-bottom: 12px;
+    }
+    .ant-modal-footer {
+      margin-top: 12px;
+    }
+  }
+  &-header {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+    line-height: 20px;
+    font-weight: bold;
+    padding-bottom: 12px;
+    border-bottom: 1px solid #e3e3e3;
+    &-icon {
+      height: 20px;
+      width: 20px;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      border-radius: 50%;
+      color: var(--textBlack);
+      font-size: 14px;
+      background-color: #d9d9d9;
+    }
+    &-icon.primary {
+      color: var(--themeColor);
+      background-color: var(--themeColor2);
+    }
+    &-icon.danger {
+      color: var(--red);
+      background-color: rgba(255, 120, 117, 0.2);
+    }
+  }
+}

package/dist/NotificationUI/index.d.ts

@@ -0,0 +1,3 @@
+import React from 'react';
+declare const NotificationUI: (props: any) => React.JSX.Element;
+export default NotificationUI;