linkmore-design 1.0.35 → 1.0.38

package/es/LmSelect/style/index.d.ts

@@ -0,0 +1 @@
+import './index.less';

package/es/LmSelect/style/index.js

@@ -0,0 +1 @@
+import "./index.css";

package/es/LmSelect/useCheckboxOptions.d.ts

@@ -0,0 +1 @@
+export declare const useCheckboxOptions: (options: any, controllable: any, filter?: string) => JSX.Element;

package/es/LmSelect/useCheckboxOptions.js

@@ -0,0 +1,120 @@
+import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+
+var __rest = this && this.__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+import { useEvent } from '../hooks';
+import { useControllableValue } from 'ahooks';
+import classNames from 'classnames';
+import { Checkbox, VirtualList } from 'linkmore-design';
+import React, { useMemo } from 'react';
+import { onStringSearch } from './utils';
+
+var imgEmpty = require('./icon_placeholder.png');
+
+var FilterEmpty = function FilterEmpty() {
+  return /*#__PURE__*/React.createElement("div", {
+    className: "filter_empty"
+  }, /*#__PURE__*/React.createElement("img", {
+    src: imgEmpty,
+    alt: "empty",
+    width: 81
+  }), /*#__PURE__*/React.createElement("div", {
+    className: "filter_empty_text"
+  }, "\u6682\u65E0\u6570\u636E"));
+}; // todo 抽取出来, 后续做统一处理, 项目中多处用到类似的功能
+
+
+export var useCheckboxOptions = function useCheckboxOptions(options, controllable) {
+  var filter = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : '';
+
+  // 将value和onChange改为受控，和父组件共享
+  var _useControllableValue = useControllableValue(controllable),
+      _useControllableValue2 = _slicedToArray(_useControllableValue, 2),
+      checkedValues = _useControllableValue2[0],
+      setCheckedValues = _useControllableValue2[1];
+
+  var renderOptions = useMemo(function () {
+    return options.filter(function (v) {
+      return onStringSearch(filter, v.label);
+    });
+  }, [options, filter]); // 是否全选: 选中的数据大于等于筛选后的数据 && 筛选后的数据全部存在于选中的数据中
+
+  var checkAll = useMemo(function () {
+    var isLen = checkedValues.length >= renderOptions.length;
+    return isLen && renderOptions.every(function (_ref) {
+      var value = _ref.value;
+      return checkedValues.includes(value);
+    });
+  }, [checkedValues.length, renderOptions]); // 是否半选: 存在选中的数据 && 未全选
+
+  var indeterminate = useMemo(function () {
+    return checkedValues.length && !checkAll;
+  }, [checkedValues.length, checkAll]); // 全选事件
+
+  var onCheckAllChange = useEvent(function () {
+    var nValue = checkAll ? checkedValues.filter(function (v) {
+      return !renderOptions.some(function (_ref2) {
+        var value = _ref2.value;
+        return v === value;
+      });
+    }) : Array.from(new Set([].concat(_toConsumableArray(checkedValues), _toConsumableArray(renderOptions.map(function (v) {
+      return v.value;
+    })))));
+    setCheckedValues(nValue);
+  });
+  var onChange = useEvent(function (e, item) {
+    e.preventDefault();
+    e.stopPropagation();
+    var arr = checkedValues.includes(item.value) ? checkedValues.filter(function (v) {
+      return v !== item.value;
+    }) : [].concat(_toConsumableArray(checkedValues), [item.value]);
+    setCheckedValues(arr || undefined);
+  });
+  return /*#__PURE__*/React.createElement("div", {
+    className: "select_dropdown"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "filter_header"
+  }, /*#__PURE__*/React.createElement("div", {
+    className: "filter_header_operate"
+  }, /*#__PURE__*/React.createElement(Checkbox, {
+    indeterminate: indeterminate,
+    onChange: onCheckAllChange,
+    checked: checkAll,
+    className: "filter_tip"
+  }, "\u5168\u90E8"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement("span", {
+    className: "filter_tip"
+  }, "\u5DF2\u9009: ", checkedValues.length)))), /*#__PURE__*/React.createElement(Checkbox.Group, {
+    value: checkedValues,
+    className: "filter_body"
+  }, /*#__PURE__*/React.createElement(VirtualList, {
+    options: renderOptions,
+    className: "filter_list"
+  }, function (_a) {
+    var item = _a.item,
+        resetProps = __rest(_a, ["item"]);
+
+    return /*#__PURE__*/React.createElement("div", Object.assign({}, resetProps, {
+      className: classNames('filter_item', {
+        checked: checkedValues.includes(item.value)
+      }),
+      onClick: function onClick(e) {
+        return onChange(e, item);
+      }
+    }), /*#__PURE__*/React.createElement(Checkbox, {
+      value: item.value,
+      className: "filter_item-content"
+    }, item.label));
+  }), !renderOptions.length && /*#__PURE__*/React.createElement(FilterEmpty, null)));
+};

package/es/LmSelect/utils.d.ts

@@ -0,0 +1,10 @@
+export declare function getArray(val: any): any[];
+export declare const isOptions: (key: any) => boolean;
+export declare const onStringSearch: (key?: string, str?: string) => boolean;
+export declare function getOptions(children: any): any[];
+export declare function getIsHas(val: any): boolean;
+export declare function isClassComponent(component: any): any;
+export declare function isExoticComponent(component: any): boolean;
+export declare function isReactComponent(component: any): any;
+export declare const render: (Comp: any, props?: {}) => any;
+export declare const useSearch: (showSearch: any, renderOptions: any) => any;

package/es/LmSelect/utils.js

@@ -0,0 +1,66 @@
+import _typeof from "@babel/runtime/helpers/esm/typeof";
+import React, { useMemo } from 'react'; // 获取数组
+
+export function getArray(val) {
+  if (!val) return [];
+  return Array.isArray(val) ? val : [val];
+} // 判断是否符合options格式
+
+export var isOptions = function isOptions(key) {
+  return ['label', 'value'].includes(key);
+}; // 查询搜索, 都转成小写用于匹配
+
+export var onStringSearch = function onStringSearch() {
+  var key = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+  var str = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
+  return str.toLowerCase().includes(key.toLowerCase());
+}; // 将options和children都转成options
+
+export function getOptions(children) {
+  var array = getArray(children);
+  return array.map(function (item) {
+    if (Object.keys(item).every(isOptions)) return item;
+    return {
+      label: item.props.children,
+      value: item.props.value,
+      disabled: !!item.props.disabled
+    };
+  });
+} // 检查是否存在内容
+
+export function getIsHas(val) {
+  var _a; // 检查是否数字类型, 是否布尔类型
+
+
+  var flag = !!val || typeof val === 'number' || typeof val === 'boolean'; // 检查空对象和空数组
+
+  if (!!val && _typeof(val) === 'object') {
+    flag = Array.isArray(val) ? !!val.length : !!((_a = Object.keys(val)) === null || _a === void 0 ? void 0 : _a.length);
+  }
+
+  return flag;
+} // 检查是否类组件
+
+export function isClassComponent(component) {
+  return typeof component === 'function' && function () {
+    var proto = Object.getPrototypeOf(component);
+    return proto.prototype && proto.prototype.isReactComponent;
+  }();
+} // 检查是否自定义组件
+
+export function isExoticComponent(component) {
+  return _typeof(component) === 'object' && _typeof(component.$$typeof) === 'symbol' && ['react.memo', 'react.forward_ref'].includes(component.$$typeof.description);
+} // 检查是否React组件
+
+export function isReactComponent(component) {
+  return isClassComponent(component) || typeof component === 'function' || isExoticComponent(component);
+}
+export var render = function render(Comp) {
+  var props = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+  return !Comp ? null : isReactComponent(Comp) ? /*#__PURE__*/React.createElement(Comp, Object.assign({}, props)) : Comp;
+};
+export var useSearch = function useSearch(showSearch, renderOptions) {
+  return useMemo(function () {
+    return showSearch || renderOptions.length > 8;
+  }, [renderOptions.length, showSearch]);
+};

package/es/LmTable/Table.js

@@ -291,7 +291,8 @@ var ResetTable = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
           selectedRows: value
         });
         rowClick === null || rowClick === void 0 ? void 0 : rowClick(value);
-      }
+      },
+      checkboxRecords: useSelectedRows.selectedRows
     };
   }); // loading触发清空选中状态
 
@@ -337,6 +338,18 @@ var ResizeSize = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
   var _props$autoSizer = props.autoSizer,
       autoSizer = _props$autoSizer === void 0 ? false : _props$autoSizer;
 
+  var _useState9 = (0, _react.useState)({
+    width: '100%',
+    height: '100%'
+  }),
+      _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
+      tableSize = _useState10[0],
+      setTableSize = _useState10[1];
+
+  var defaultRef = ref || (0, _react.useRef)(null);
+  var tableWarpRef = (0, _react.useRef)(null);
+  var resizeRef = (0, _react.useRef)(null);
+
   if (!autoSizer) {
     return /*#__PURE__*/_react.default.createElement("div", {
       ref: tableWarpRef,
@@ -355,17 +368,6 @@ var ResizeSize = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
     })));
   }
 
-  var _useState9 = (0, _react.useState)({
-    width: '100%',
-    height: '100%'
-  }),
-      _useState10 = (0, _slicedToArray2.default)(_useState9, 2),
-      tableSize = _useState10[0],
-      setTableSize = _useState10[1];
-
-  var defaultRef = ref || (0, _react.useRef)(null);
-  var tableWarpRef = (0, _react.useRef)(null);
-  var resizeRef = (0, _react.useRef)(null);
   var resetHeight = (0, _react.useMemo)(function () {
     var height = tableSize.height;
     var h = height - 32;
@@ -414,24 +416,25 @@ var ResizeSize = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
 
   var handResize = (0, _lodash.throttle)(changeSize, 600);
   (0, _react.useEffect)(function () {
-    var _tableWarpRef$current8;
-
     var hiddenPage = props.hiddenPage,
         customCheck = props.customCheck,
         summary = props.summary;
-
-    var _tableWarpRef$current5 = (_tableWarpRef$current8 = tableWarpRef.current) === null || _tableWarpRef$current8 === void 0 ? void 0 : _tableWarpRef$current8.getBoundingClientRect(),
-        _tableWarpRef$current6 = _tableWarpRef$current5.width,
-        width = _tableWarpRef$current6 === void 0 ? '100%' : _tableWarpRef$current6,
-        _tableWarpRef$current7 = _tableWarpRef$current5.height,
-        height = _tableWarpRef$current7 === void 0 ? '100%' : _tableWarpRef$current7;
-
-    var value = summary ? 48 : 0;
+    setTimeout(function () {
+      var _tableWarpRef$current8;
+
+      var _tableWarpRef$current5 = (_tableWarpRef$current8 = tableWarpRef.current) === null || _tableWarpRef$current8 === void 0 ? void 0 : _tableWarpRef$current8.getBoundingClientRect(),
+          _tableWarpRef$current6 = _tableWarpRef$current5.width,
+          width = _tableWarpRef$current6 === void 0 ? '100%' : _tableWarpRef$current6,
+          _tableWarpRef$current7 = _tableWarpRef$current5.height,
+          height = _tableWarpRef$current7 === void 0 ? '100%' : _tableWarpRef$current7;
+
+      var value = summary ? 48 : 0;
+      setTableSize({
+        width: width,
+        height: typeof height === 'string' ? "calc(".concat(height, " - ").concat(value, "px)") : height - value
+      });
+    }, 100);
     resizeRef.current = window.addEventListener('resize', handResize);
-    setTableSize({
-      width: width,
-      height: typeof height === 'string' ? "calc(".concat(height, " - ").concat(value, "px)") : height - value
-    });
     return function () {
       window.removeEventListener('resize', handResize);
     };

package/es/Radio/index.js

@@ -20,7 +20,7 @@ var _classnames = _interopRequireDefault(require("classnames"));
 var _react = _interopRequireDefault(require("react"));
 
 var _excluded = ["children"],
-    _excluded2 = ["children", "size", "buttonStyle", "direction"];
+    _excluded2 = ["children", "size", "buttonStyle", "direction", "className"];
 
 var LMRadio = function LMRadio(props) {
   var children = props.children,
@@ -37,10 +37,11 @@ LMRadio.Group = function (props) {
       buttonStyle = props.buttonStyle,
       _props$direction = props.direction,
       direction = _props$direction === void 0 ? 'row' : _props$direction,
+      className = props.className,
       restProps = (0, _objectWithoutProperties2.default)(props, _excluded2);
   console.log(children, 'rrr');
   return /*#__PURE__*/_react.default.createElement(_radio.default.Group, (0, _extends2.default)({
-    className: (0, _classnames.default)('lm-radio-group', "lm-radio-group-".concat(direction)),
+    className: (0, _classnames.default)(className, 'lm-radio-group', "lm-radio-group-".concat(direction)),
     size: size
   }, restProps), children);
 };

package/es/Radio/style/style.css

@@ -119,6 +119,10 @@
 .lm-radio-group .ant-radio-button-wrapper-disabled:hover {
   color: var(--disabled-font-color);
 }
+.lm-radio-group.lm-radio-group-row {
+  display: flex;
+  flex-direction: row;
+}
 .lm-radio-group.lm-radio-group-column {
   display: flex;
   flex-direction: column;

package/es/VirtualList/index.js

@@ -17,7 +17,8 @@ var VirList = function VirList(_ref) {
       children = _ref.children,
       _ref$size = _ref.size,
       size = _ref$size === void 0 ? 32 : _ref$size,
-      parentRef = _ref.parentRef,
+      _ref$parentRef = _ref.parentRef,
+      parentRef = _ref$parentRef === void 0 ? null : _ref$parentRef,
       className = _ref.className,
       _ref$maxHeight = _ref.maxHeight,
       maxHeight = _ref$maxHeight === void 0 ? 224 : _ref$maxHeight;

package/es/hooks/index.d.ts

@@ -0,0 +1,2 @@
+export { default as useFullscreen } from './useFullscreen';
+export { default as useEvent } from './useEvent';

package/es/hooks/index.js

@@ -0,0 +1,2 @@
+export { default as useFullscreen } from './useFullscreen';
+export { default as useEvent } from './useEvent';

package/es/hooks/useEvent/index.d.ts

@@ -0,0 +1,2 @@
+declare function useEvent(handler: any): (...args: any[]) => any;
+export default useEvent;

package/es/hooks/useEvent/index.js

@@ -0,0 +1,16 @@
+import { useCallback, useLayoutEffect, useRef } from 'react'; // * 解决useCallback的依赖传导问题，存储事件
+
+function useEvent(handler) {
+  var handlerRef = useRef(null); // 同步，运行时间在布局前
+
+  useLayoutEffect(function () {
+    handlerRef.current = handler;
+  }); // 存储方法函数
+
+  return useCallback(function () {
+    var fn = handlerRef.current;
+    return fn.apply(void 0, arguments);
+  }, []);
+}
+
+export default useEvent;

package/es/hooks/useFullscreen/index.d.ts

@@ -0,0 +1,15 @@
+import type { MutableRefObject } from 'react';
+declare type TargetValue<T> = T | undefined | null;
+declare type TargetType = HTMLElement | Element | Window | Document;
+declare type BasicTarget<T extends TargetType = Element> = (() => TargetValue<T>) | TargetValue<T> | MutableRefObject<TargetValue<T>>;
+interface Options {
+    onExit?: () => void;
+    onEnter?: () => void;
+}
+declare const useFullscreen: (target: BasicTarget, options?: Options) => {
+    isFullscreen: boolean;
+    enterFullscreen: () => void;
+    exitFullscreen: () => void;
+    toggleFullscreen: () => void;
+};
+export default useFullscreen;

package/es/hooks/useFullscreen/index.js

@@ -0,0 +1,99 @@
+import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
+import { useState, useRef, useEffect } from 'react';
+import { message } from '../../index';
+var isBrowser = !!(typeof window !== 'undefined' && window.document && window.document.createElement);
+
+var isFunction = function isFunction(value) {
+  return typeof value === 'function';
+};
+
+var getTargetElement = function getTargetElement(target, defaultElement) {
+  if (!isBrowser) {
+    return undefined;
+  }
+
+  if (!target) {
+    return defaultElement;
+  }
+
+  var targetElement;
+
+  if (isFunction(target)) {
+    targetElement = target();
+  } else if ('current' in target) {
+    targetElement = target.current;
+  } else {
+    targetElement = target;
+  }
+
+  return targetElement;
+};
+
+var fullScreenCssText = 'position: fixed;width: 100%;height:100%;top:0;left:0;z-index:1009;background-color: #abcdef;';
+
+var useFullscreen = function useFullscreen(target, options) {
+  var _ref = options || {},
+      onExit = _ref.onExit,
+      onEnter = _ref.onEnter;
+
+  var _useState = useState(false),
+      _useState2 = _slicedToArray(_useState, 2),
+      isFullscreen = _useState2[0],
+      setIsFullscreen = _useState2[1];
+
+  var originCssTextRef = useRef('');
+  var eleRef = useRef(null);
+
+  var enterFullscreen = function enterFullscreen() {
+    onEnter === null || onEnter === void 0 ? void 0 : onEnter();
+    setIsFullscreen(true);
+    var el = getTargetElement(target);
+
+    if (!eleRef.current) {
+      eleRef.current = el;
+      var originCssText = el.style.cssText;
+      originCssTextRef.current = originCssText;
+    }
+
+    eleRef.current.style.cssText = "".concat(originCssTextRef.current).concat(fullScreenCssText);
+    message.info({
+      content: '使用 Esc 键可退出全屏模式',
+      key: 'tip'
+    });
+  };
+
+  var exitFullscreen = function exitFullscreen() {
+    onExit === null || onExit === void 0 ? void 0 : onExit();
+    setIsFullscreen(false);
+    eleRef.current.style.cssText = "".concat(originCssTextRef.current);
+  };
+
+  var toggleFullscreen = function toggleFullscreen() {
+    if (isFullscreen) {
+      exitFullscreen();
+    } else {
+      enterFullscreen();
+    }
+  };
+
+  useEffect(function () {
+    var fn = function fn(event) {
+      if (event.keyCode === 27) {
+        exitFullscreen();
+      }
+    };
+
+    window.addEventListener('keydown', fn);
+    return function () {
+      window.removeEventListener('keydown', fn);
+    };
+  }, []);
+  return {
+    isFullscreen: isFullscreen,
+    enterFullscreen: enterFullscreen,
+    exitFullscreen: exitFullscreen,
+    toggleFullscreen: toggleFullscreen
+  };
+};
+
+export default useFullscreen;

package/es/index.d.ts

@@ -1,6 +1,7 @@
 export { default as Button } from './Button';
 export { default as ButtonTags } from './ButtonTags';
 export { default as Card } from './Card';
+export { default as Cascader } from './Cascader';
 export { default as Checkbox } from './Checkbox';
 export { default as CkFilter } from './CkFilter';
 export { default as CustomerService } from './CustomerService';
@@ -17,6 +18,7 @@ export { default as Input } from './Input';
 export { default as InputNumber } from './InputNumber';
 export { default as LeftTable } from './LeftTable';
 export { default as LmTable } from './LmTable';
+export { default as LmSelect } from './LmSelect';
 export { default as LoadingPage } from './LoadingPage';
 export { default as Menu } from './Menu';
 export { default as Modal } from './Modal';
@@ -40,5 +42,6 @@ export { default as Switch } from './Switch';
 export { default as Image } from './Image';
 export { default as CustomTableOption } from './CustomTableOption';
 export { default as Upload } from './Upload';
-export type { UploadProps, UploadFile } from './Upload';
+export type { UploadProps, UploadFile, RcFile } from './Upload';
 export { default as Tooltip } from './Tooltip';
+export { default as Form } from './Form';

package/es/index.js

@@ -1,6 +1,7 @@
 export { default as Button } from './Button';
 export { default as ButtonTags } from './ButtonTags';
 export { default as Card } from './Card';
+export { default as Cascader } from './Cascader';
 export { default as Checkbox } from './Checkbox';
 export { default as CkFilter } from './CkFilter';
 export { default as CustomerService } from './CustomerService';
@@ -17,6 +18,7 @@ export { default as Input } from './Input';
 export { default as InputNumber } from './InputNumber';
 export { default as LeftTable } from './LeftTable';
 export { default as LmTable } from './LmTable';
+export { default as LmSelect } from './LmSelect';
 export { default as LoadingPage } from './LoadingPage';
 export { default as Menu } from './Menu';
 export { default as Modal } from './Modal';
@@ -40,4 +42,5 @@ export { default as Switch } from './Switch';
 export { default as Image } from './Image';
 export { default as CustomTableOption } from './CustomTableOption';
 export { default as Upload } from './Upload';
-export { default as Tooltip } from './Tooltip';
+export { default as Tooltip } from './Tooltip';
+export { default as Form } from './Form';

package/lib/Cascader/index.d.ts

@@ -0,0 +1,4 @@
+import React from 'react';
+import { CascaderProps } from 'antd';
+declare const LMCascader: React.FC<React.PropsWithChildren<CascaderProps<any>>>;
+export default LMCascader;

package/lib/Cascader/index.js

@@ -0,0 +1,50 @@
+"use strict";
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+require("antd/es/cascader/style");
+
+var _cascader = _interopRequireDefault(require("antd/es/cascader"));
+
+var _react = _interopRequireDefault(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var __rest = void 0 && (void 0).__rest || function (s, e) {
+  var t = {};
+
+  for (var p in s) {
+    if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
+  }
+
+  if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+    if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
+  }
+  return t;
+};
+
+var prefixCls = 'lm_cascader';
+var prefixDropdownCls = 'lm_cascader_dropdown';
+
+var LMCascader = function LMCascader(props) {
+  var children = props.children,
+      className = props.className,
+      dropdownClassName = props.dropdownClassName,
+      _props$placeholder = props.placeholder,
+      placeholder = _props$placeholder === void 0 ? '请选择' : _props$placeholder,
+      others = __rest(props, ["children", "className", "dropdownClassName", "placeholder"]);
+
+  return /*#__PURE__*/_react.default.createElement(_cascader.default, Object.assign({
+    placeholder: placeholder,
+    className: (0, _classnames.default)(prefixCls, className),
+    dropdownClassName: (0, _classnames.default)(prefixDropdownCls, dropdownClassName)
+  }, others));
+};
+
+var _default = LMCascader;
+exports.default = _default;