dtable-ui-component 6.0.24-beta1 → 6.0.25

package/lib/TextareaItem/index.js

@@ -0,0 +1,231 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _classnames = _interopRequireDefault(require("classnames"));
+var React = _interopRequireWildcard(require("react"));
+var _rmcFeedback = _interopRequireDefault(require("rmc-feedback"));
+var _exenv = require("../_util/exenv");
+require("./index.css");
+/* tslint:disable:jsx-no-multiline-js */
+
+function noop() {}
+function fixControlledValue(value) {
+  if (typeof value === 'undefined' || value === null) {
+    return '';
+  }
+  return value;
+}
+const regexAstralSymbols = /[\uD800-\uDBFF][\uDC00-\uDFFF]|\n/g;
+function countSymbols() {
+  let text = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+  return text.replace(regexAstralSymbols, '_').length;
+}
+class TextareaItem extends React.Component {
+  constructor(props) {
+    super(props);
+    this.focus = () => {
+      this.textareaRef.focus();
+    };
+    this.reAlignHeight = () => {
+      const textareaDom = this.textareaRef;
+      textareaDom.style.height = ''; // 字数减少时能自动减小高度
+      textareaDom.style.height = "".concat(textareaDom.scrollHeight, "px");
+    };
+    this.onChange = e => {
+      const value = e.target.value;
+      if ('value' in this.props) {
+        this.setState({
+          value: this.props.value
+        });
+      } else {
+        this.setState({
+          value
+        });
+      }
+      const {
+        onChange
+      } = this.props;
+      if (onChange) {
+        onChange(value);
+      }
+      // 设置 defaultValue 时，用户输入不会触发 componentDidUpdate ，此处手工调用
+      this.componentDidUpdate();
+    };
+    this.onBlur = e => {
+      this.debounceTimeout = setTimeout(() => {
+        if (document.activeElement !== this.textareaRef) {
+          this.setState({
+            focus: false
+          });
+        }
+      }, 100);
+      const value = e.currentTarget.value;
+      if (this.props.onBlur) {
+        // fix autoFocus item blur with flash
+        setTimeout(() => {
+          // fix ios12 wechat browser click failure after input
+          if (document.body) {
+            // eslint-disable-next-line no-self-assign
+            document.body.scrollTop = document.body.scrollTop;
+          }
+        }, 100);
+        this.props.onBlur(value);
+      }
+    };
+    this.onFocus = e => {
+      if (this.debounceTimeout) {
+        clearTimeout(this.debounceTimeout);
+        this.debounceTimeout = null;
+      }
+      this.setState({
+        focus: true
+      });
+      const value = e.currentTarget.value;
+      if (this.props.onFocus) {
+        this.props.onFocus(value);
+      }
+    };
+    this.onErrorClick = () => {
+      if (this.props.onErrorClick) {
+        this.props.onErrorClick();
+      }
+    };
+    this.clearInput = () => {
+      this.setState({
+        value: ''
+      });
+      if (this.props.onChange) {
+        this.props.onChange('');
+      }
+    };
+    this.state = {
+      focus: false,
+      value: props.value || props.defaultValue || ''
+    };
+  }
+  componentWillReceiveProps(nextProps) {
+    if ('value' in nextProps) {
+      this.setState({
+        value: fixControlledValue(nextProps.value)
+      });
+    }
+  }
+  componentDidMount() {
+    if (this.props.autoHeight) {
+      this.reAlignHeight();
+    }
+  }
+  componentDidUpdate() {
+    if (this.props.autoHeight) {
+      this.reAlignHeight();
+    }
+  }
+  componentWillUnmount() {
+    if (this.debounceTimeout) {
+      clearTimeout(this.debounceTimeout);
+      this.debounceTimeout = null;
+    }
+  }
+  render() {
+    const {
+      prefixCls,
+      prefixListCls,
+      editable,
+      style,
+      clear,
+      children,
+      error,
+      className,
+      count,
+      labelNumber,
+      title,
+      onErrorClick,
+      autoHeight,
+      defaultValue,
+      ...otherProps
+    } = this.props;
+    const {
+      disabled
+    } = otherProps;
+    const {
+      value,
+      focus
+    } = this.state;
+    const hasCount = count > 0 && this.props.rows > 1;
+    const wrapCls = (0, _classnames.default)(className, "".concat(prefixListCls, "-item"), "".concat(prefixCls, "-item"), {
+      ["".concat(prefixCls, "-disabled")]: disabled,
+      ["".concat(prefixCls, "-item-single-line")]: this.props.rows === 1 && !autoHeight,
+      ["".concat(prefixCls, "-error")]: error,
+      ["".concat(prefixCls, "-focus")]: focus,
+      ["".concat(prefixCls, "-has-count")]: hasCount
+    });
+    const labelCls = (0, _classnames.default)("".concat(prefixCls, "-label"), {
+      ["".concat(prefixCls, "-label-2")]: labelNumber === 2,
+      ["".concat(prefixCls, "-label-3")]: labelNumber === 3,
+      ["".concat(prefixCls, "-label-4")]: labelNumber === 4,
+      ["".concat(prefixCls, "-label-5")]: labelNumber === 5,
+      ["".concat(prefixCls, "-label-6")]: labelNumber === 6,
+      ["".concat(prefixCls, "-label-7")]: labelNumber === 7
+    });
+    const characterLength = countSymbols(value);
+    const lengthCtrlProps = {};
+    if (count > 0) {
+      // Note: If in the iOS environment of dev-tools, It will fail.
+      if (_exenv.IS_IOS) {
+        const entValue = value ? value.replace(regexAstralSymbols, '_') : '';
+        const entLen = entValue ? entValue.split('_').length - 1 : 0;
+        lengthCtrlProps.maxLength = count + entLen - characterLength + (value ? value.length : 0);
+      } else {
+        lengthCtrlProps.maxLength = count - characterLength + (value ? value.length : 0);
+      }
+    }
+    return /*#__PURE__*/React.createElement("div", {
+      className: wrapCls
+    }, title && /*#__PURE__*/React.createElement("div", {
+      className: labelCls
+    }, title), /*#__PURE__*/React.createElement("div", {
+      className: "".concat(prefixCls, "-control")
+    }, /*#__PURE__*/React.createElement("textarea", Object.assign({
+      ref: el => this.textareaRef = el
+    }, lengthCtrlProps, otherProps, {
+      value: value,
+      onChange: this.onChange,
+      onBlur: this.onBlur,
+      onFocus: this.onFocus,
+      readOnly: !editable,
+      style: style
+    }))), clear && editable && value && characterLength > 0 && /*#__PURE__*/React.createElement(_rmcFeedback.default, {
+      activeClassName: "".concat(prefixCls, "-clear-active")
+    }, /*#__PURE__*/React.createElement("div", {
+      className: "".concat(prefixCls, "-clear"),
+      onClick: this.clearInput
+    })), error && /*#__PURE__*/React.createElement("div", {
+      className: "".concat(prefixCls, "-error-extra"),
+      onClick: this.onErrorClick
+    }), hasCount && /*#__PURE__*/React.createElement("span", {
+      className: "".concat(prefixCls, "-count")
+    }, /*#__PURE__*/React.createElement("span", null, value ? characterLength : 0), "/", count));
+  }
+}
+exports.default = TextareaItem;
+TextareaItem.defaultProps = {
+  prefixCls: 'am-textarea',
+  prefixListCls: 'am-list',
+  autoHeight: false,
+  editable: true,
+  disabled: false,
+  placeholder: '',
+  clear: false,
+  rows: 1,
+  onChange: noop,
+  onBlur: noop,
+  onFocus: noop,
+  onErrorClick: noop,
+  error: false,
+  labelNumber: 5
+};

package/lib/Toast/index.css

@@ -0,0 +1,65 @@
+.am-toast {
+  position: fixed;
+  width: 100%;
+  z-index: 1999;
+  font-size: 14px;
+  text-align: center;
+}
+
+.am-toast>span {
+  max-width: 50%;
+}
+
+.am-toast.am-toast-mask {
+  height: 100%;
+  display: -webkit-box;
+  display: -webkit-flex;
+  display: -ms-flexbox;
+  display: flex;
+  -webkit-box-pack: center;
+  -webkit-justify-content: center;
+  -ms-flex-pack: center;
+  justify-content: center;
+  -webkit-box-align: center;
+  -webkit-align-items: center;
+  -ms-flex-align: center;
+  align-items: center;
+  left: 0;
+  top: 0;
+  -webkit-transform: translateZ(1px);
+  transform: translateZ(1px);
+}
+
+.am-toast.am-toast-nomask {
+  position: fixed;
+  max-width: 50%;
+  width: auto;
+  left: 50%;
+  top: 50%;
+  -webkit-transform: translateZ(1px);
+  transform: translateZ(1px);
+}
+
+.am-toast.am-toast-nomask .am-toast-notice {
+  -webkit-transform: translateX(-50%) translateY(-50%);
+  -ms-transform: translateX(-50%) translateY(-50%);
+  transform: translateX(-50%) translateY(-50%);
+}
+
+.am-toast-notice-content .am-toast-text {
+  min-width: 60px;
+  border-radius: 3px;
+  color: #fff;
+  background-color: rgba(58, 58, 58, 0.9);
+  line-height: 1.5;
+  padding: 9px 15px;
+}
+
+.am-toast-notice-content .am-toast-text.am-toast-text-icon {
+  border-radius: 5px;
+  padding: 15px 15px;
+}
+
+.am-toast-notice-content .am-toast-text.am-toast-text-icon .am-toast-text-info {
+  margin-top: 6px;
+}

package/lib/Toast/index.js

@@ -0,0 +1,131 @@
+"use strict";
+
+var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _classnames = _interopRequireDefault(require("classnames"));
+var React = _interopRequireWildcard(require("react"));
+var _rmcNotification = _interopRequireDefault(require("rmc-notification"));
+var _Icon = _interopRequireDefault(require("../Icon"));
+require("./index.css");
+const SHORT = 3;
+const config = {
+  duration: SHORT,
+  mask: true
+};
+let messageInstance;
+let messageNeedHide;
+const prefixCls = 'am-toast';
+function getMessageInstance(mask, callback) {
+  _rmcNotification.default.newInstance({
+    prefixCls,
+    style: {},
+    // clear rmc-notification default style
+    transitionName: 'am-fade',
+    className: (0, _classnames.default)({
+      ["".concat(prefixCls, "-mask")]: mask,
+      ["".concat(prefixCls, "-nomask")]: !mask
+    })
+  }, notification => callback && callback(notification));
+}
+function notice(content, type) {
+  let duration = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : config.duration;
+  let onClose = arguments.length > 3 ? arguments[3] : undefined;
+  let mask = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : config.mask;
+  const iconTypes = {
+    info: '',
+    success: 'success',
+    fail: 'fail',
+    offline: 'dislike',
+    loading: 'loading'
+  };
+  const iconType = iconTypes[type];
+  messageNeedHide = false;
+  getMessageInstance(mask, notification => {
+    if (!notification) {
+      return;
+    }
+    if (messageInstance) {
+      messageInstance.destroy();
+      messageInstance = null;
+    }
+    if (messageNeedHide) {
+      notification.destroy();
+      messageNeedHide = false;
+      return;
+    }
+    messageInstance = notification;
+    notification.notice({
+      duration,
+      style: {},
+      content: iconType ? /*#__PURE__*/React.createElement("div", {
+        className: "".concat(prefixCls, "-text ").concat(prefixCls, "-text-icon"),
+        role: "alert",
+        "aria-live": "assertive"
+      }, /*#__PURE__*/React.createElement(_Icon.default, {
+        type: iconType,
+        size: "lg"
+      }), /*#__PURE__*/React.createElement("div", {
+        className: "".concat(prefixCls, "-text-info")
+      }, content)) : /*#__PURE__*/React.createElement("div", {
+        className: "".concat(prefixCls, "-text"),
+        role: "alert",
+        "aria-live": "assertive"
+      }, /*#__PURE__*/React.createElement("div", null, content)),
+      closable: true,
+      onClose() {
+        if (onClose) {
+          onClose();
+        }
+        notification.destroy();
+        notification = null;
+        messageInstance = null;
+      }
+    });
+  });
+}
+const Toast = {
+  SHORT,
+  LONG: 8,
+  show(content, duration, mask) {
+    return notice(content, 'info', duration, () => {}, mask);
+  },
+  info(content, duration, onClose, mask) {
+    return notice(content, 'info', duration, onClose, mask);
+  },
+  success(content, duration, onClose, mask) {
+    return notice(content, 'success', duration, onClose, mask);
+  },
+  fail(content, duration, onClose, mask) {
+    return notice(content, 'fail', duration, onClose, mask);
+  },
+  offline(content, duration, onClose, mask) {
+    return notice(content, 'offline', duration, onClose, mask);
+  },
+  loading(content, duration, onClose, mask) {
+    return notice(content, 'loading', duration, onClose, mask);
+  },
+  hide() {
+    if (messageInstance) {
+      messageInstance.destroy();
+      messageInstance = null;
+    } else {
+      messageNeedHide = true;
+    }
+  },
+  config() {
+    let conf = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
+    const {
+      duration = SHORT,
+      mask
+    } = conf;
+    config.duration = duration;
+    if (mask === false) {
+      config.mask = false;
+    }
+  }
+};
+var _default = exports.default = Toast;

package/lib/_util/class.js

@@ -0,0 +1,34 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.addClass = addClass;
+exports.hasClass = hasClass;
+exports.removeClass = removeClass;
+function hasClass(node, className) {
+  if (node.classList) {
+    return node.classList.contains(className);
+  }
+  const originClass = node.className;
+  return " ".concat(originClass, " ").indexOf(" ".concat(className, " ")) > -1;
+}
+function addClass(node, className) {
+  if (node.classList) {
+    node.classList.add(className);
+  } else {
+    if (!hasClass(node, className)) {
+      node.className = "".concat(node.className, " ").concat(className);
+    }
+  }
+}
+function removeClass(node, className) {
+  if (node.classList) {
+    node.classList.remove(className);
+  } else {
+    if (hasClass(node, className)) {
+      const originClass = node.className;
+      node.className = " ".concat(originClass, " ").replace(" ".concat(className, " "), '');
+    }
+  }
+}

package/lib/_util/closest.js

@@ -0,0 +1,17 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = closest;
+function closest(el, selector) {
+  const matchesSelector = el.matches || el.webkitMatchesSelector || el.mozMatchesSelector || el.msMatchesSelector;
+  let p = el;
+  while (p) {
+    if (matchesSelector.call(p, selector)) {
+      return p;
+    }
+    p = p.parentElement;
+  }
+  return null;
+}

package/lib/_util/exenv.js

@@ -0,0 +1,8 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.canUseDOM = exports.IS_IOS = void 0;
+const canUseDOM = exports.canUseDOM = !!(typeof window !== 'undefined' && window.document && window.document.createElement);
+const IS_IOS = exports.IS_IOS = canUseDOM && /iphone|ipad|ipod/i.test(window.navigator.userAgent);

package/lib/_util/getDataAttr.js

@@ -0,0 +1,15 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+const getDataAttr = props => {
+  return Object.keys(props).reduce((prev, key) => {
+    if (key.substr(0, 5) === 'aria-' || key.substr(0, 5) === 'data-' || key === 'role') {
+      prev[key] = props[key];
+    }
+    return prev;
+  }, {});
+};
+var _default = exports.default = getDataAttr;

package/lib/_util/getLocale.js

@@ -0,0 +1,42 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.getComponentLocale = getComponentLocale;
+exports.getLocaleCode = getLocaleCode;
+function getComponentLocale(props, context, componentName, getDefaultLocale) {
+  let locale = {};
+  if (context && context.antLocale && context.antLocale[componentName]) {
+    locale = context.antLocale[componentName];
+  } else {
+    const defaultLocale = getDefaultLocale();
+    // TODO: make default lang of antd be English
+    // https://github.com/ant-design/ant-design/issues/6334
+    locale = defaultLocale.default || defaultLocale;
+  }
+  let result = {
+    ...locale
+  };
+  if (props.locale) {
+    result = {
+      ...result,
+      ...props.locale
+    };
+    if (props.locale.lang) {
+      result.lang = {
+        ...locale.lang,
+        ...props.locale.lang
+      };
+    }
+  }
+  return result;
+}
+function getLocaleCode(context) {
+  const localeCode = context.antLocale && context.antLocale.locale;
+  // Had use LocaleProvide but didn't set locale
+  if (context.antLocale && context.antLocale.exist && !localeCode) {
+    return 'zh-cn';
+  }
+  return localeCode;
+}