@para-ui/core 3.0.55 → 3.0.56

package/Carousel/index.js

@@ -0,0 +1,78 @@
+import { _ as _defineProperty } from '../_verture/defineProperty-62acccfc.js';
+import { _ as __rest } from '../_verture/tslib.es6-55ed4bd2.js';
+import { jsx } from 'react/jsx-runtime';
+import React__default from 'react';
+import SlickCarousel from 'react-slick';
+import clsx from 'clsx';
+import { $ as $prefixCls } from '../_verture/constant-66aa48a1.js';
+import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
+import '../_verture/typeof-498dd2b1.js';
+
+var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2022/2/28 上午11:01\n* @description Carousel\n*/\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-v3-carousel {\n  color: rgb(46, 55, 67);\n  font-size: 14px;\n  line-height: 1.5715;\n  list-style: none;\n}\n.paraui-v3-carousel .slick-slider {\n  position: relative;\n  display: block;\n  box-sizing: border-box;\n  touch-action: pan-y;\n  -webkit-touch-callout: none;\n  -webkit-tap-highlight-color: transparent;\n}\n.paraui-v3-carousel .slick-list {\n  position: relative;\n  display: block;\n  margin: 0;\n  padding: 0;\n  overflow: hidden;\n}\n.paraui-v3-carousel .slick-list:focus {\n  outline: none;\n}\n.paraui-v3-carousel .slick-list.dragging {\n  cursor: pointer;\n}\n.paraui-v3-carousel .slick-list .slick-slide {\n  pointer-events: none;\n}\n.paraui-v3-carousel .slick-list .slick-slide input.ant-radio-input,\n.paraui-v3-carousel .slick-list .slick-slide input.ant-checkbox-input {\n  visibility: hidden;\n}\n.paraui-v3-carousel .slick-list .slick-slide.slick-active {\n  pointer-events: auto;\n}\n.paraui-v3-carousel .slick-list .slick-slide.slick-active input.ant-radio-input,\n.paraui-v3-carousel .slick-list .slick-slide.slick-active input.ant-checkbox-input {\n  visibility: visible;\n}\n.paraui-v3-carousel .slick-list .slick-slide > div > div {\n  vertical-align: bottom;\n}\n.paraui-v3-carousel .slick-slider .slick-track,\n.paraui-v3-carousel .slick-slider .slick-list {\n  transform: translate3d(0, 0, 0);\n  touch-action: pan-y;\n}\n.paraui-v3-carousel .slick-track {\n  position: relative;\n  top: 0;\n  left: 0;\n  display: block;\n}\n.paraui-v3-carousel .slick-track::before,\n.paraui-v3-carousel .slick-track::after {\n  display: table;\n  content: \"\";\n}\n.paraui-v3-carousel .slick-track::after {\n  clear: both;\n}\n.paraui-v3-carousel .slick-slide {\n  display: none;\n  float: left;\n  height: 100%;\n  min-height: 1px;\n}\n.paraui-v3-carousel .slick-slide img {\n  display: block;\n}\n.paraui-v3-carousel .slick-slide.slick-loading img {\n  display: none;\n}\n.paraui-v3-carousel .slick-slide.dragging img {\n  pointer-events: none;\n}\n.paraui-v3-carousel .slick-initialized .slick-slide {\n  display: block;\n}\n.paraui-v3-carousel .slick-loading .slick-slide {\n  visibility: hidden;\n}\n.paraui-v3-carousel .slick-vertical .slick-slide {\n  display: block;\n  height: auto;\n}\n.paraui-v3-carousel .slick-arrow.slick-hidden {\n  display: none;\n}\n.paraui-v3-carousel .slick-prev,\n.paraui-v3-carousel .slick-next {\n  position: absolute;\n  top: 50%;\n  display: block;\n  width: 20px;\n  height: 20px;\n  margin-top: -10px;\n  padding: 0;\n  color: transparent;\n  font-size: 0;\n  line-height: 0;\n  background: transparent;\n  border: 0;\n  outline: none;\n  cursor: pointer;\n}\n.paraui-v3-carousel .slick-prev:hover,\n.paraui-v3-carousel .slick-next:hover,\n.paraui-v3-carousel .slick-prev:focus,\n.paraui-v3-carousel .slick-next:focus {\n  color: transparent;\n  background: transparent;\n  outline: none;\n}\n.paraui-v3-carousel .slick-prev:hover::before,\n.paraui-v3-carousel .slick-next:hover::before,\n.paraui-v3-carousel .slick-prev:focus::before,\n.paraui-v3-carousel .slick-next:focus::before {\n  opacity: 1;\n}\n.paraui-v3-carousel .slick-prev.slick-disabled::before,\n.paraui-v3-carousel .slick-next.slick-disabled::before {\n  opacity: 0.25;\n}\n.paraui-v3-carousel .slick-prev {\n  left: -25px;\n}\n.paraui-v3-carousel .slick-prev::before {\n  content: \"←\";\n}\n.paraui-v3-carousel .slick-next {\n  right: -25px;\n}\n.paraui-v3-carousel .slick-next::before {\n  content: \"→\";\n}\n.paraui-v3-carousel .slick-dots {\n  position: absolute;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: 15;\n  display: flex !important;\n  justify-content: center;\n  margin-right: 15%;\n  margin-left: 15%;\n  padding-left: 0;\n  list-style: none;\n}\n.paraui-v3-carousel .slick-dots-bottom {\n  bottom: 12px;\n}\n.paraui-v3-carousel .slick-dots-top {\n  top: 12px;\n  bottom: auto;\n}\n.paraui-v3-carousel .slick-dots li {\n  position: relative;\n  display: inline-block;\n  flex: 0 1 auto;\n  box-sizing: content-box;\n  width: 16px;\n  height: 3px;\n  margin: 0 2px;\n  margin-right: 3px;\n  margin-left: 3px;\n  padding: 0;\n  text-align: center;\n  text-indent: -999px;\n  vertical-align: top;\n  transition: all 0.5s;\n}\n.paraui-v3-carousel .slick-dots li button {\n  display: block;\n  width: 100%;\n  height: 3px;\n  padding: 0;\n  color: transparent;\n  font-size: 0;\n  background: rgb(255, 255, 255);\n  border: 0;\n  border-radius: 1px;\n  outline: none;\n  cursor: pointer;\n  opacity: 0.3;\n  transition: all 0.5s;\n}\n.paraui-v3-carousel .slick-dots li button:hover,\n.paraui-v3-carousel .slick-dots li button:focus {\n  opacity: 0.75;\n}\n.paraui-v3-carousel .slick-dots li.slick-active {\n  width: 24px;\n}\n.paraui-v3-carousel .slick-dots li.slick-active button {\n  background: rgb(255, 255, 255);\n  opacity: 1;\n}\n.paraui-v3-carousel .slick-dots li.slick-active:hover,\n.paraui-v3-carousel .slick-dots li.slick-active:focus {\n  opacity: 1;\n}\n.paraui-v3-carousel .slick-loading .paraui-v3-carousel .slick-track {\n  visibility: hidden;\n}\n.paraui-v3-carousel-vertical .slick-dots {\n  top: 50%;\n  bottom: auto;\n  flex-direction: column;\n  width: 3px;\n  height: auto;\n  margin: 0;\n  transform: translateY(-50%);\n}\n.paraui-v3-carousel-vertical .slick-dots-left {\n  right: auto;\n  left: 12px;\n}\n.paraui-v3-carousel-vertical .slick-dots-right {\n  right: 12px;\n  left: auto;\n}\n.paraui-v3-carousel-vertical .slick-dots li {\n  width: 3px;\n  height: 16px;\n  margin: 4px 2px;\n  vertical-align: baseline;\n}\n.paraui-v3-carousel-vertical .slick-dots li button {\n  width: 3px;\n  height: 16px;\n}\n.paraui-v3-carousel-vertical .slick-dots li.slick-active {\n  width: 3px;\n  height: 24px;\n}\n.paraui-v3-carousel-vertical .slick-dots li.slick-active button {\n  width: 3px;\n  height: 24px;\n}\n.paraui-v3-carousel-rtl {\n  direction: rtl;\n}\n.paraui-v3-carousel-rtl .paraui-v3-carousel .slick-track {\n  right: 0;\n  left: auto;\n}\n.paraui-v3-carousel-rtl .paraui-v3-carousel .slick-prev {\n  right: -25px;\n  left: auto;\n}\n.paraui-v3-carousel-rtl .paraui-v3-carousel .slick-prev::before {\n  content: \"→\";\n}\n.paraui-v3-carousel-rtl .paraui-v3-carousel .slick-next {\n  right: auto;\n  left: -25px;\n}\n.paraui-v3-carousel-rtl .paraui-v3-carousel .slick-next::before {\n  content: \"←\";\n}\n.paraui-v3-carousel-rtl.paraui-v3-carousel .slick-dots {\n  flex-direction: row-reverse;\n}\n.paraui-v3-carousel-rtl.paraui-v3-carousel-vertical .slick-dots {\n  flex-direction: column;\n}";
+styleInject(css_248z);
+
+//Carousel
+var Carousel = /*#__PURE__*/React__default.forwardRef(function (props, ref) {
+  var _props$dots = props.dots,
+    dots = _props$dots === void 0 ? true : _props$dots,
+    _props$arrows = props.arrows,
+    arrows = _props$arrows === void 0 ? false : _props$arrows,
+    _props$draggable = props.draggable,
+    draggable = _props$draggable === void 0 ? false : _props$draggable,
+    _props$dotPosition = props.dotPosition,
+    dotPosition = _props$dotPosition === void 0 ? 'bottom' : _props$dotPosition,
+    className = props.className,
+    restProps = __rest(props, ["dots", "arrows", "draggable", "dotPosition", "className"]);
+  var slickRef = React__default.useRef();
+  //切换到指定面板
+  var goTo = function goTo(slide) {
+    var dontAnimate = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+    slickRef.current.slickGoTo(slide, dontAnimate);
+  };
+  //ref 绑定实例方法
+  React__default.useImperativeHandle(ref, function () {
+    return {
+      goTo: goTo,
+      prev: slickRef.current.slickPrev,
+      next: slickRef.current.slickNext,
+      play: slickRef.current.slickPlay,
+      pause: slickRef.current.slickPause
+    };
+  }, [slickRef.current]);
+  //节点数量
+  var prevCount = React__default.useRef(React__default.Children.count(props.children));
+  React__default.useEffect(function () {
+    if (prevCount.current !== React__default.Children.count(props.children)) {
+      goTo(props.initialSlide || 0, false);
+      prevCount.current = React__default.Children.count(props.children);
+    }
+  }, [props.children]);
+  var newProps = Object.assign({}, restProps);
+  //动画效果
+  if (newProps.effect === 'fade') {
+    newProps.fade = true;
+  }
+  var prefixCls = "".concat($prefixCls, "-carousel");
+  var dotsClass = 'slick-dots';
+  newProps.vertical = dotPosition === 'left' || dotPosition === 'right';
+  //启用dots
+  var enableDots = !!dots;
+  //dots cls
+  var dsClass = clsx(dotsClass, "".concat(dotsClass, "-").concat(dotPosition), typeof dots === 'boolean' ? false : dots === null || dots === void 0 ? void 0 : dots.className);
+  //组件cls
+  var cls = clsx(prefixCls, className, _defineProperty({}, "".concat(prefixCls, "-vertical"), newProps.vertical));
+  return jsx("div", Object.assign({
+    className: cls
+  }, {
+    children: jsx(SlickCarousel, Object.assign({
+      ref: slickRef
+    }, newProps, {
+      dots: enableDots,
+      dotsClass: dsClass,
+      arrows: arrows,
+      draggable: draggable
+    }))
+  }));
+});
+
+export { Carousel, Carousel as default };

package/Cascader/index.d.ts

@@ -0,0 +1,54 @@
+import React from 'react';
+import './style/index.scss';
+/**
+ * @description: 级联选择器
+ * @param value{ string }: 选中的值
+ * @param label: { string }: 选项
+ * @param disabled: { Boolean }: 是否禁用
+ * @param children: { Array }: 子选项
+ * @param loading: { Boolean }: 是否加载中
+ * @param isLeaf: { Boolean }: 是否叶子节点
+ */
+interface Option {
+    label: string;
+    value: string;
+    disabled?: boolean;
+    children?: Option[];
+    loading?: boolean;
+    isLeaf?: boolean;
+}
+/**
+ * @param data{ Array }: 数据源
+ * @param value{array}: 选中的值
+ * @param onChange{ Function }: 选中的值改变时的回调
+ * @param onDropdownVisibleChange{ Function }: 弹出层显示状态改变时的回调
+ * @param changeOnSelect{ Boolean }: 是否在选中时发生改变
+ * @param expandTrigger{ String }: 展开时触发的方式
+ * @param expandIcon{ React.ReactNode }: 展开图标
+ * @param loadingIcon{ React.ReactNode }: 加载图标
+ * @param expandJoin{ String }: 展开时的连接符
+ * @param fieldNames{ Object }: 字段名称
+ * @param disabled{ Boolean }: 是否禁用
+ * @param placeholder{ String }: 占位符
+ * @param loadData{ Function }: 加载数据的方法
+ * @param children{ React.ReactNode }: 子节点
+ */
+interface Props {
+    data: Option[];
+    expandTrigger?: 'click' | 'hover';
+    value?: string[];
+    onChange?: (value: string[], selectedOptions: Option[]) => void;
+    onDropdownVisibleChange?: (visible: boolean) => void;
+    changeOnSelect?: boolean;
+    expandIcon?: React.ReactNode;
+    expandJoin?: string;
+    fieldNames?: object;
+    disabled?: boolean;
+    placeholder?: string;
+    size?: 'small' | 'medium' | 'large';
+    loadData?: (selectedOptions: Option[], setState?: React.Dispatch<React.SetStateAction<Option[]>>) => void;
+    loadingIcon?: React.ReactNode;
+    children?: React.ReactNode;
+}
+export declare const Cascader: ({ data, expandTrigger, value, onChange, onDropdownVisibleChange, changeOnSelect, expandIcon, expandJoin, fieldNames, disabled, placeholder, loadData, loadingIcon, children, }: Props) => JSX.Element;
+export default Cascader;

package/Cascader/index.js

@@ -0,0 +1,159 @@
+import { _ as _toConsumableArray } from '../_verture/toConsumableArray-81040c9e.js';
+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 { jsx } from 'react/jsx-runtime';
+import { useState, useCallback } from 'react';
+import RcCascader from 'rc-cascader';
+import Right from '@para-ui/icons/Right';
+import LoadingIcon from '@para-ui/icons/Loading';
+import { u as useFormatMessage } from '../_verture/useFormatMessage-703f8b20.js';
+import { $ as $prefixCls, a as $rcPrefixCls } from '../_verture/constant-66aa48a1.js';
+import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
+import '../_verture/unsupportedIterableToArray-cb478f24.js';
+import '@para-ui/core/GlobalContext';
+
+var en = {
+  placeholder: 'Please select'
+};
+
+var zh = {
+  placeholder: '请选择'
+};
+
+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-cascader input {\n  color: #333;\n  width: 560px;\n  padding: 6px 12px;\n  overflow: hidden;\n  box-sizing: border-box;\n  white-space: nowrap;\n  text-overflow: ellipsis;\n  border-radius: 4px;\n  border: 1px solid #d9d9d9;\n}\n.paraui-v3-cascader button {\n  background: transparent;\n  border: none;\n}\n.paraui-v3-cascader.component-cascader-dropdown-hidden {\n  display: none;\n}\n.paraui-v3-cascader .component-cascader-menus {\n  font-size: 12px;\n  overflow: hidden;\n  background: #fff;\n  border: 1px solid #d9d9d9;\n  border-radius: 4px;\n  box-shadow: 0 0 4px rgba(0, 0, 0, 0.17);\n  white-space: nowrap;\n}\n.paraui-v3-cascader .component-cascader-menus.slide-up-enter, .paraui-v3-cascader .component-cascader-menus.slide-up-appear {\n  animation-duration: 0.3s;\n  animation-fill-mode: both;\n  transform-origin: 0 0;\n  opacity: 0;\n  animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);\n  animation-play-state: paused;\n}\n.paraui-v3-cascader .component-cascader-menus.slide-up-leave {\n  animation-duration: 0.3s;\n  animation-fill-mode: both;\n  transform-origin: 0 0;\n  opacity: 1;\n  animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.34);\n  animation-play-state: paused;\n}\n.paraui-v3-cascader .component-cascader-menus.slide-up-enter.slide-up-enter-active, .paraui-v3-cascader .component-cascader-menus-placement-bottomLeft, .paraui-v3-cascader .component-cascader-menus.slide-up-appear.slide-up-appear-active, .paraui-v3-cascader .component-cascader-menus-placement-bottomLeft {\n  animation-name: SlideUpIn;\n  animation-play-state: running;\n}\n.paraui-v3-cascader .component-cascader-menus.slide-up-enter.slide-up-enter-active, .paraui-v3-cascader .component-cascader-menus-placement-topLeft, .paraui-v3-cascader .component-cascader-menus.slide-up-appear.slide-up-appear-active, .paraui-v3-cascader .component-cascader-menus-placement-topLeft {\n  animation-name: SlideDownIn;\n  animation-play-state: running;\n}\n.paraui-v3-cascader .component-cascader-menus.slide-up-leave.slide-up-leave-active, .paraui-v3-cascader .component-cascader-menus-placement-bottomLeft {\n  animation-name: SlideUpOut;\n  animation-play-state: running;\n}\n.paraui-v3-cascader .component-cascader-menus.slide-up-leave.slide-up-leave-active, .paraui-v3-cascader .component-cascader-menus-placement-topLeft {\n  animation-name: SlideDownOut;\n  animation-play-state: running;\n}\n.paraui-v3-cascader .component-cascader-menu {\n  display: inline-block;\n  min-width: 100px;\n  height: 192px;\n  list-style: none;\n  margin: 0;\n  padding: 0;\n  border-right: 1px solid #e9e9e9;\n  overflow: auto;\n}\n.paraui-v3-cascader .component-cascader-menu:last-child {\n  border-right: 0;\n}\n.paraui-v3-cascader .component-cascader-menu-item {\n  height: 32px;\n  line-height: 32px;\n  padding: 0 16px;\n  cursor: pointer;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  transition: all 0.3s ease;\n  position: relative;\n}\n.paraui-v3-cascader .component-cascader-menu-item:hover {\n  background: rgba(171, 176, 185, 0.231372549);\n}\n.paraui-v3-cascader .component-cascader-menu-item-disabled {\n  cursor: not-allowed;\n  color: #ccc;\n}\n.paraui-v3-cascader .component-cascader-menu-item-disabled:hover {\n  background: transparent;\n}\n.paraui-v3-cascader .component-cascader-menu-item-active {\n  color: #3666d6;\n}\n.paraui-v3-cascader .component-cascader-menu-item-loading-icon {\n  display: flex;\n  align-items: center;\n  margin-left: 10px;\n}\n.paraui-v3-cascader .component-cascader-menu-item-expand {\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n}\n.paraui-v3-cascader .component-cascader-menu-item-expand-icon {\n  font-size: 12px;\n  margin-left: 10px;\n}\n.paraui-v3-cascader .component-cascader-menu-item-expand-icon SVG {\n  display: flex;\n  align-items: center;\n}\n.paraui-v3-cascader .component-cascader-menu-item-expand-icon SVG path {\n  fill: #999;\n}\n\n.component-cascader-dropdown {\n  position: absolute;\n}\n\n@keyframes SlideUpIn {\n  0% {\n    opacity: 0;\n    transform-origin: 0% 0%;\n    transform: scaleY(0.8);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 0% 0%;\n    transform: scaleY(1);\n  }\n}\n@keyframes SlideUpOut {\n  0% {\n    opacity: 1;\n    transform-origin: 0% 0%;\n    transform: scaleY(1);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 0% 0%;\n    transform: scaleY(0.8);\n  }\n}\n@keyframes SlideDownIn {\n  0% {\n    opacity: 0;\n    transform-origin: 0% 100%;\n    transform: scaleY(0.8);\n  }\n  100% {\n    opacity: 1;\n    transform-origin: 0% 100%;\n    transform: scaleY(1);\n  }\n}\n@keyframes SlideDownOut {\n  0% {\n    opacity: 1;\n    transform-origin: 0% 100%;\n    transform: scaleY(1);\n  }\n  100% {\n    opacity: 0;\n    transform-origin: 0% 100%;\n    transform: scaleY(0.8);\n  }\n}";
+styleInject(css_248z);
+
+var Cascader = function Cascader(_ref) {
+  var data = _ref.data,
+    _ref$expandTrigger = _ref.expandTrigger,
+    expandTrigger = _ref$expandTrigger === void 0 ? 'click' : _ref$expandTrigger,
+    _ref$value = _ref.value,
+    value = _ref$value === void 0 ? [] : _ref$value,
+    onChange = _ref.onChange,
+    onDropdownVisibleChange = _ref.onDropdownVisibleChange,
+    _ref$changeOnSelect = _ref.changeOnSelect,
+    changeOnSelect = _ref$changeOnSelect === void 0 ? false : _ref$changeOnSelect,
+    _ref$expandIcon = _ref.expandIcon,
+    expandIcon = _ref$expandIcon === void 0 ? jsx(Right, {}) : _ref$expandIcon,
+    _ref$expandJoin = _ref.expandJoin,
+    expandJoin = _ref$expandJoin === void 0 ? ' , ' : _ref$expandJoin,
+    _ref$fieldNames = _ref.fieldNames,
+    fieldNames = _ref$fieldNames === void 0 ? {
+      label: 'label',
+      value: 'value',
+      children: 'children'
+    } : _ref$fieldNames,
+    _ref$disabled = _ref.disabled,
+    disabled = _ref$disabled === void 0 ? false : _ref$disabled,
+    placeholder = _ref.placeholder,
+    _ref$loadData = _ref.loadData,
+    loadData = _ref$loadData === void 0 ? function () {
+      return __awaiter(void 0, void 0, void 0, /*#__PURE__*/regenerator.mark(function _callee() {
+        return regenerator.wrap(function _callee$(_context) {
+          while (1) switch (_context.prev = _context.next) {
+            case 0:
+            case "end":
+              return _context.stop();
+          }
+        }, _callee);
+      }));
+    } : _ref$loadData,
+    _ref$loadingIcon = _ref.loadingIcon,
+    loadingIcon = _ref$loadingIcon === void 0 ? jsx(LoadingIcon, {}) : _ref$loadingIcon,
+    children = _ref.children;
+  var intl = useFormatMessage('Cascader', localeJson);
+  var _useState = useState(data),
+    _useState2 = _slicedToArray(_useState, 2),
+    option = _useState2[0],
+    setOption = _useState2[1];
+  var _useState3 = useState(value),
+    _useState4 = _slicedToArray(_useState3, 2),
+    inputValue = _useState4[0],
+    setValue = _useState4[1];
+  var _useState5 = useState(valueToLabel(data, value, expandJoin)),
+    _useState6 = _slicedToArray(_useState5, 2),
+    inputLabel = _useState6[0],
+    setLabel = _useState6[1];
+  var onStateChange = useCallback(function (value, selectedOptions) {
+    setValue(value);
+    setLabel(selectedOptions.map(function (o) {
+      return o.label;
+    }).join(expandJoin));
+    onChange && onChange(value, selectedOptions);
+  }, []);
+  var loadingData = function loadingData(opt) {
+    return __awaiter(void 0, void 0, void 0, /*#__PURE__*/regenerator.mark(function _callee2() {
+      return regenerator.wrap(function _callee2$(_context2) {
+        while (1) switch (_context2.prev = _context2.next) {
+          case 0:
+            _context2.next = 2;
+            return loadData(opt);
+          case 2:
+            setOption(_toConsumableArray(data));
+          case 3:
+          case "end":
+            return _context2.stop();
+        }
+      }, _callee2);
+    }));
+  };
+  return jsx("div", Object.assign({
+    className: $prefixCls + '-cascader'
+  }, {
+    children: jsx(RcCascader, Object.assign({
+      options: option,
+      onChange: onStateChange,
+      changeOnSelect: changeOnSelect,
+      expandTrigger: expandTrigger,
+      expandIcon: expandIcon,
+      fieldNames: fieldNames,
+      loadData: loadingData,
+      loadingIcon: loadingIcon,
+      onDropdownVisibleChange: onDropdownVisibleChange,
+      value: inputValue,
+      prefixCls: $rcPrefixCls + '-cascader',
+      dropdownClassName: $prefixCls + '-cascader'
+    }, {
+      children: children ? jsx("button", Object.assign({
+        disabled: disabled
+      }, {
+        children: children
+      })) : jsx("input", {
+        value: inputLabel,
+        readOnly: true,
+        disabled: disabled,
+        placeholder: placeholder || intl({
+          id: 'placeholder'
+        })
+      })
+    }))
+  }));
+};
+function valueToLabel(opt, value, expandJoin) {
+  var label = [];
+  var count = 0;
+  function find(data) {
+    for (var i = 0; i < data.length; i++) {
+      if (data[i].value === value[count]) {
+        if (i === data.length - 1) {
+          label.push(data[i].label);
+        } else {
+          count++;
+          label.push(data[i].label);
+          find(data[i].children);
+        }
+      }
+    }
+    return label;
+  }
+  find(opt);
+  return label.join(expandJoin);
+}
+
+export { Cascader, Cascader as default };

package/Cascader/lang/en_US.d.ts

@@ -0,0 +1,4 @@
+declare const _default: {
+    placeholder: string;
+};
+export default _default;

package/Cascader/lang/index.d.ts

@@ -0,0 +1,9 @@
+declare const _default: {
+    zh: {
+        placeholder: string;
+    };
+    en: {
+        placeholder: string;
+    };
+};
+export default _default;

package/Cascader/lang/zh_CN.d.ts

@@ -0,0 +1,4 @@
+declare const _default: {
+    placeholder: string;
+};
+export default _default;

package/Checkbox/index.d.ts

@@ -0,0 +1,40 @@
+/**
+ * @author linhd
+ * @date 2021/8/4 15:54
+ * @description 复选框
+ */
+import React, { FunctionComponent, ReactNode } from 'react';
+import { LabelTooltipProps } from '../Label';
+import './index.scss';
+export interface CheckboxProps {
+    /** 样式class */
+    className?: string;
+    /** style */
+    style?: React.CSSProperties;
+    /** 标题 */
+    label?: ReactNode;
+    /** 帮组提示信息 */
+    labelTooltip?: LabelTooltipProps;
+    /** 大小 */
+    size?: 'small' | 'medium' | 'large';
+    /** 默认值  有值不受控组件 初始化第一次 */
+    defaultChecked?: boolean;
+    /** 默认值 有值受控组件*/
+    checked?: boolean;
+    /** 禁用 */
+    disabled?: boolean;
+    /** 半选 */
+    indeterminate?: boolean;
+    /** inputProps */
+    inputProps?: {
+        type?: string;
+        value?: any;
+        checked?: any;
+        [name: string]: any;
+    };
+    /** 改变时间 */
+    onChange?: (e: any, checked: boolean) => void;
+    [name: string]: any;
+}
+export declare const Checkbox: FunctionComponent<CheckboxProps>;
+export default Checkbox;

package/Checkbox/index.js

@@ -0,0 +1,109 @@
+import { _ as _slicedToArray } from '../_verture/slicedToArray-76060636.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState, useEffect } from 'react';
+import Label from '../Label/index.js';
+import { $ as $prefixCls } from '../_verture/constant-66aa48a1.js';
+import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
+import '../_verture/unsupportedIterableToArray-cb478f24.js';
+import '../Help/index.js';
+import '../_verture/tslib.es6-55ed4bd2.js';
+import '../Tooltip/index.js';
+import 'rc-tooltip';
+import 'rc-tooltip/lib/placements';
+import 'clsx';
+import '@para-ui/icons/Help';
+
+var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-v3-checkbox {\n  font-family: -apple-system, BlinkMacSystemFont, Helvetica Neue, PingFang SC, Microsoft YaHei, Source Han Sans SC, Noto Sans CJK SC, WenQuanYi Micro Hei, sans-serif;\n  font-size: 14px;\n  font-weight: 400;\n  cursor: pointer;\n  display: inline-flex;\n  align-items: flex-start;\n  line-height: 16px;\n}\n.paraui-v3-checkbox:hover > .checkbox-label {\n  color: rgba(54, 102, 214, 0.8);\n  cursor: pointer;\n}\n.paraui-v3-checkbox:hover > .checkbox-label svg {\n  color: rgba(54, 102, 214, 0.8);\n}\n.paraui-v3-checkbox:hover > .checkbox-help {\n  padding: 0 8px;\n}\n.paraui-v3-checkbox:hover > .checkbox-help > .checkbox-label {\n  color: rgba(54, 102, 214, 0.8);\n  cursor: pointer;\n}\n.paraui-v3-checkbox:hover > .checkbox-help > .checkbox-label svg {\n  color: rgba(54, 102, 214, 0.8);\n}\n.paraui-v3-checkbox:hover > .checkbox-box > .checkbox-box-inner {\n  border-color: rgba(54, 102, 214, 0.8);\n}\n.paraui-v3-checkbox > .checkbox-box {\n  position: relative;\n}\n.paraui-v3-checkbox > .checkbox-box > input {\n  position: absolute;\n  top: 0;\n  right: 0;\n  bottom: 0;\n  left: 0;\n  z-index: 1;\n  width: 100%;\n  height: 100%;\n  opacity: 0;\n  cursor: pointer;\n}\n.paraui-v3-checkbox > .checkbox-box > .checkbox-box-inner {\n  position: relative;\n  top: 0;\n  left: 0;\n  display: block;\n  border-radius: 2px;\n  background-color: white;\n  border: 1px solid rgba(171, 176, 185, 0.4);\n}\n.paraui-v3-checkbox > .checkbox-box > .checkbox-box-inner:after {\n  position: absolute;\n  display: table;\n  content: \" \";\n}\n.paraui-v3-checkbox > .checkbox-label {\n  color: rgb(46, 55, 67);\n  padding: 0 8px;\n  margin: 0;\n  display: inline-flex;\n  align-items: flex-start;\n}\n.paraui-v3-checkbox > .checkbox-label > .checkbox-help > svg {\n  top: 0;\n}\n.paraui-v3-checkbox .checkbox-label {\n  line-height: 16px;\n}\n.paraui-v3-checkbox > .checkbox-help {\n  padding: 0 8px;\n  position: relative;\n  top: -1px;\n}\n.paraui-v3-checkbox > .checkbox-help > .checkbox-label {\n  color: rgb(46, 55, 67);\n  margin: 0;\n  display: inline-flex;\n  align-items: center;\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-checked:hover > .checkbox-box > .checkbox-box-inner {\n  background-color: rgba(54, 102, 214, 0.8);\n  border-color: transparent;\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-checked > .checkbox-box > .checkbox-box-inner {\n  background-color: rgb(54, 102, 214);\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-checked > .checkbox-box > .checkbox-box-inner:after {\n  border: 1px solid white;\n  border-top: 0;\n  border-left: 0;\n  transform: rotate(45deg) scale(1) translate(-50%, -50%);\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-indeterminate:hover > .checkbox-box > .checkbox-box-inner {\n  background-color: rgba(54, 102, 214, 0.8);\n  border-color: transparent;\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-indeterminate > .checkbox-box > .checkbox-box-inner {\n  background-color: rgb(54, 102, 214);\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-indeterminate > .checkbox-box > .checkbox-box-inner:after {\n  background-color: white;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%) scale(1);\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-disabled {\n  cursor: not-allowed;\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-disabled > .checkbox-label {\n  color: rgba(46, 55, 67, 0.4);\n  cursor: not-allowed;\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-disabled > .checkbox-label svg {\n  color: rgba(46, 55, 67, 0.4);\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-disabled > .checkbox-help > .checkbox-label {\n  color: rgba(46, 55, 67, 0.4);\n  cursor: not-allowed;\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-disabled > .checkbox-help > .checkbox-label svg {\n  color: rgba(46, 55, 67, 0.4);\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-disabled > .checkbox-box > input {\n  cursor: not-allowed;\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-disabled > .checkbox-box > .checkbox-box-inner {\n  background-color: rgba(171, 176, 185, 0.12);\n  border-color: rgba(171, 176, 185, 0.4);\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-disabled.paraui-v3-checkbox-checked:hover > .checkbox-box > .checkbox-box-inner {\n  background-color: rgba(171, 176, 185, 0.12);\n  border-color: rgba(171, 176, 185, 0.4);\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-disabled.paraui-v3-checkbox-checked > .checkbox-box > .checkbox-box-inner:after {\n  border-color: rgba(46, 55, 67, 0.4);\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-disabled.paraui-v3-checkbox-indeterminate:hover > .checkbox-box > .checkbox-box-inner {\n  background-color: rgba(171, 176, 185, 0.12);\n  border-color: rgba(171, 176, 185, 0.4);\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-disabled.paraui-v3-checkbox-indeterminate > .checkbox-box > .checkbox-box-inner:after {\n  background-color: rgba(46, 55, 67, 0.4);\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-small > .checkbox-box {\n  top: 1px;\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-small > .checkbox-box > .checkbox-box-inner {\n  width: 14px;\n  height: 14px;\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-small.paraui-v3-checkbox-checked > .checkbox-box > .checkbox-box-inner:after {\n  top: 45%;\n  left: 21%;\n  width: 4px;\n  height: 7px;\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-small.paraui-v3-checkbox-indeterminate > .checkbox-box > .checkbox-box-inner:after {\n  width: 8px;\n  height: 1px;\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-medium > .checkbox-box > .checkbox-box-inner {\n  width: 16px;\n  height: 16px;\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-medium.paraui-v3-checkbox-checked > .checkbox-box > .checkbox-box-inner:after {\n  top: 45%;\n  left: 21%;\n  width: 5px;\n  height: 8px;\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-medium.paraui-v3-checkbox-indeterminate > .checkbox-box > .checkbox-box-inner:after {\n  width: 8px;\n  height: 1px;\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-large > .checkbox-box > .checkbox-box-inner {\n  width: 16px;\n  height: 16px;\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-large.paraui-v3-checkbox-checked > .checkbox-box > .checkbox-box-inner:after {\n  top: 45%;\n  left: 21%;\n  width: 5px;\n  height: 8px;\n}\n.paraui-v3-checkbox.paraui-v3-checkbox-large.paraui-v3-checkbox-indeterminate > .checkbox-box > .checkbox-box-inner:after {\n  width: 8px;\n  height: 1px;\n}";
+styleInject(css_248z);
+
+var Checkbox = function Checkbox(props) {
+  var _props$className = props.className,
+    className = _props$className === void 0 ? '' : _props$className,
+    _props$label = props.label,
+    label = _props$label === void 0 ? '' : _props$label,
+    labelTooltip = props.labelTooltip,
+    _props$size = props.size,
+    size = _props$size === void 0 ? 'large' : _props$size,
+    _props$disabled = props.disabled,
+    disabled = _props$disabled === void 0 ? false : _props$disabled,
+    _props$indeterminate = props.indeterminate,
+    indeterminate = _props$indeterminate === void 0 ? false : _props$indeterminate,
+    onChange = props.onChange,
+    style = props.style;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    checkedCom = _useState2[0],
+    setCheckedCom = _useState2[1]; // 复选框状态
+  useEffect(function () {
+    if (props.defaultChecked !== undefined) setCheckedCom(props.defaultChecked);
+  }, []);
+  useEffect(function () {
+    if (props.checked !== undefined) setCheckedCom(props.checked);
+  }, [props.checked]);
+  // 点击选择
+  var clickCheck = function clickCheck(e) {
+    e.preventDefault();
+    if (disabled) return;
+    if (indeterminate) {
+      // 不可受控组件
+      if (props.checked === undefined) setCheckedCom(true);
+      onChange && onChange(e, true);
+      return;
+    }
+    // 不可受控组件
+    if (props.checked === undefined) setCheckedCom(!checkedCom);
+    e.target.checked = !checkedCom;
+    e.target.value = !checkedCom;
+    onChange && onChange(e, !checkedCom);
+  };
+  // 处理class
+  var handClass = function handClass() {
+    var str = $prefixCls + '-checkbox';
+    if (className) str += ' ' + className;
+    if (size) str += " ".concat($prefixCls, "-checkbox-").concat(size);
+    if (disabled) str += " ".concat($prefixCls, "-checkbox-disabled");
+    if (indeterminate) str += " ".concat($prefixCls, "-checkbox-indeterminate");else if (checkedCom) str += " ".concat($prefixCls, "-checkbox-checked");
+    if (labelTooltip && labelTooltip.tooltipType) {
+      str += " ".concat($prefixCls, "-checkbox-").concat(labelTooltip.tooltipType);
+    }
+    return str;
+  };
+  var handLabelClass = function handLabelClass() {
+    var str = 'checkbox-label';
+    if (labelTooltip && labelTooltip.className) {
+      str += ' ' + labelTooltip.className;
+    }
+    return str;
+  };
+  /** 处理帮组classNaem */
+  var handHelpClassName = function handHelpClassName() {
+    var str = ' checkbox-help';
+    if (labelTooltip && labelTooltip.helpClassName) {
+      str += ' ' + labelTooltip.helpClassName;
+    }
+    return str;
+  };
+  return jsxs("label", Object.assign({
+    className: handClass(),
+    onClick: clickCheck,
+    style: style
+  }, {
+    children: [jsxs("span", Object.assign({
+      className: "checkbox-box"
+    }, {
+      children: [jsx("input", Object.assign({
+        type: "checkbox",
+        value: checkedCom
+      }, props.inputProps)), jsx("span", {
+        className: "checkbox-box-inner"
+      })]
+    })), label !== undefined && label !== '' && label !== null ? jsx(Label, Object.assign({
+      label: label
+    }, labelTooltip, {
+      helpClassName: handHelpClassName(),
+      className: handLabelClass()
+    })) : null]
+  }));
+};
+
+export { Checkbox, Checkbox as default };

package/CheckboxGroup/index.d.ts

@@ -0,0 +1,45 @@
+/**
+ * @author linhd
+ * @date 2021/8/4 16:23
+ * @description 复选框组
+ */
+import React, { FunctionComponent, ReactNode } from 'react';
+import { CheckboxProps } from '../Checkbox';
+import { LabelTooltipProps } from "../Label";
+import { HelperTextDetailProps } from "../HelperText";
+import './index.scss';
+export interface CheckboxListProps extends CheckboxProps {
+    [name: string]: any;
+}
+export interface CheckboxGroupProps extends HelperTextDetailProps {
+    /** 样式class */
+    className?: string;
+    /** style */
+    style?: React.CSSProperties;
+    /** 间距 只有在横向布局的时候生效 */
+    spacing?: string;
+    /** 标题 */
+    label?: ReactNode;
+    /** 帮组提示信息 */
+    labelTooltip?: LabelTooltipProps;
+    /** 大小 */
+    size?: 'small' | 'medium' | 'large';
+    /** 是否必填 */
+    required?: boolean;
+    /** 布局方式 横向/竖向 */
+    row?: boolean;
+    /** 是否禁用 */
+    disabled?: boolean;
+    /** 默认值 不受控 */
+    defaultValue?: any;
+    /** 值 */
+    value?: any[];
+    /** 选中选值 */
+    id?: string;
+    /** 选项数据 */
+    list: CheckboxListProps[];
+    /** 改变值 */
+    onChange?: (val: any) => void;
+}
+export declare const CheckboxGroup: FunctionComponent<CheckboxGroupProps>;
+export default CheckboxGroup;