@para-ui/core 3.0.55 → 3.0.56

package/HelperText/index.js

@@ -0,0 +1,34 @@
+import { jsx } from 'react/jsx-runtime';
+import { $ as $prefixCls } from '../_verture/constant-66aa48a1.js';
+import { s as styleInject } from '../_verture/style-inject.es-300983ab.js';
+
+var css_248z = "@charset \"UTF-8\";\n/**\n* @author linhd\n* @date 2021/11/1 20:28\n* @description 表单错误提示\n*/\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-v3-helper-text {\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: 12px;\n  font-weight: 400;\n  padding-left: 12px;\n  line-height: 20px;\n  color: rgba(46, 55, 67, 0.7);\n}\n.paraui-v3-helper-text.paraui-v3-helper-text-error {\n  color: rgb(235, 96, 84);\n}";
+styleInject(css_248z);
+
+var HelperText = function HelperText(props) {
+  var className = props.className,
+    style = props.style,
+    _props$error = props.error,
+    error = _props$error === void 0 ? false : _props$error,
+    _props$hideErrorDom = props.hideErrorDom,
+    hideErrorDom = _props$hideErrorDom === void 0 ? false : _props$hideErrorDom,
+    helperText = props.helperText;
+  if (hideErrorDom === null) return null;
+  // 不存在错误,且没有错误隐藏错误dom
+  if (!error && hideErrorDom) return null;
+  // 处理class
+  var handClass = function handClass() {
+    var str = "".concat($prefixCls, "-helper-text");
+    if (className) str += ' ' + className;
+    if (error) str += " ".concat($prefixCls, "-helper-text-error");
+    return str;
+  };
+  return jsx("p", Object.assign({
+    className: handClass(),
+    style: style
+  }, {
+    children: helperText
+  }));
+};
+
+export { HelperText as default };

package/Hooks/useGlobalProps.d.ts

@@ -0,0 +1 @@
+export default function useGlobalProps<T>(comProps: T, comName: string): T;

package/InputLang/index.d.ts

@@ -0,0 +1,57 @@
+/**
+ * @author linhd
+ * @date 2021/8/30 16:00
+ * @description 国际化输入框
+ */
+import React, { FunctionComponent, ReactNode } from 'react';
+import { HelperTextDetailProps } from '../HelperText';
+import { LabelTooltipProps } from "../Label";
+import './index.scss';
+interface valueProps {
+    [name: string]: string;
+}
+export interface InputLangProps extends HelperTextDetailProps {
+    /** 样式class */
+    className?: string;
+    /** style */
+    style?: React.CSSProperties;
+    /** 大小 */
+    size?: 'small' | 'medium' | 'large';
+    /** 标题 */
+    label?: ReactNode;
+    /** 帮组提示信息 */
+    labelTooltip?: LabelTooltipProps;
+    /** 提示语 */
+    placeholder?: string;
+    /** 提示语key */
+    placeholderKey?: string;
+    /** 提示语value */
+    placeholderValue?: string;
+    /** 是否禁用 */
+    disabled?: boolean;
+    /** 是否必填 */
+    required?: boolean;
+    /** 弹出框样式class */
+    popoverClassName?: string;
+    /** 默认值 不受控 */
+    defaultValue?: valueProps;
+    /** 值 */
+    value?: valueProps;
+    /** 改变值 */
+    onChange?: (val: valueProps) => void;
+    /** 语言列表 */
+    langList?: (string | {
+        label: string;
+        value: string;
+    })[];
+    /** 默认语种 */
+    defaultLang?: string;
+    /** 禁用增加 */
+    disabledAdd?: boolean;
+    /** 禁用删除 */
+    disabledDelete?: boolean;
+    /** 禁用key */
+    disabledKey?: boolean | string[];
+}
+export declare const InputLang: FunctionComponent<InputLangProps>;
+export default InputLang;

package/InputLang/index.js

@@ -0,0 +1,355 @@
+import { _ as _defineProperty } from '../_verture/defineProperty-62acccfc.js';
+import { _ as _typeof } from '../_verture/typeof-498dd2b1.js';
+import { _ as _toConsumableArray } from '../_verture/toConsumableArray-81040c9e.js';
+import { _ as _slicedToArray } from '../_verture/slicedToArray-76060636.js';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useState, useRef, useEffect, useMemo } from 'react';
+import { TextField } from '../TextField/index.js';
+import HelperText from '../HelperText/index.js';
+import { MultiBox } from '../MultiBox/index.js';
+import { Popover } from '../Popover/index.js';
+import Application from '@para-ui/icons/Application';
+import { GetLanguage, ArrayToObject } from '@paraview/lib';
+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 '../_verture/tslib.es6-55ed4bd2.js';
+import '../Label/index.js';
+import '../Help/index.js';
+import '../Tooltip/index.js';
+import 'rc-tooltip';
+import 'rc-tooltip/lib/placements';
+import 'clsx';
+import '@para-ui/icons/Help';
+import '@para-ui/icons/PreviewClose';
+import '@para-ui/icons/PreviewOpen';
+import '@para-ui/icons/CloseCircle';
+import '../AutoTips/index.js';
+import '../Loading/index.js';
+import '@para-ui/icons/LoadingF';
+import '../_verture/useGlobalProps-1b846a65.js';
+import '@para-ui/core/GlobalContext';
+import '../_verture/index-77f9e0fb.js';
+import 'rc-dropdown';
+import '../_verture/usePopupContainer-87febeb9.js';
+import 'dayjs';
+import '@para-ui/icons/Delete';
+import '@para-ui/icons/PlusCircleF';
+import '../_verture/useFormatMessage-703f8b20.js';
+
+var css_248z = "@charset \"UTF-8\";\n/**\n* @author Hanz\n* @date 2021/10/20 下午2:08\n* @description color\n*/\n.paraui-v3-input-lang {\n  display: inline-block;\n  width: 100%;\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}\n.paraui-v3-input-lang .input-lang-text-field > .text-field-content > .text-field-content-after {\n  cursor: pointer;\n}\n.paraui-v3-input-lang .input-lang-text-field > .text-field-content > .text-field-content-after .lang-list-icon {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.paraui-v3-input-lang .input-lang-text-field > .paraui-v3-helper-text {\n  display: none;\n}\n\n.paraui-v3-input-lang-popover > .component-popover-content > .component-popover-inner {\n  padding: 12px;\n  width: 300px;\n  line-height: 0;\n}\n.paraui-v3-input-lang-popover > .component-popover-content > .component-popover-inner .input-lang-multi-box {\n  padding-bottom: 0;\n}\n.paraui-v3-input-lang-popover.paraui-v3-input-lang-popover-disabled-add > .component-popover-content > .component-popover-inner .input-lang-multi-box .multi-box-add {\n  display: none;\n}\n.paraui-v3-input-lang-popover.paraui-v3-input-lang-popover-disabled-delete > .component-popover-content > .component-popover-inner .input-lang-multi-box .multi-box-content > .multi-box-content-item .opera-box {\n  display: none;\n}";
+styleInject(css_248z);
+
+var InputLang = function InputLang(props) {
+  var _props$className = props.className,
+    className = _props$className === void 0 ? '' : _props$className,
+    style = props.style,
+    _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$placeholder = props.placeholder,
+    placeholder = _props$placeholder === void 0 ? '' : _props$placeholder,
+    _props$placeholderKey = props.placeholderKey,
+    placeholderKey = _props$placeholderKey === void 0 ? '' : _props$placeholderKey,
+    _props$placeholderVal = props.placeholderValue,
+    placeholderValue = _props$placeholderVal === void 0 ? '' : _props$placeholderVal,
+    _props$error = props.error,
+    error = _props$error === void 0 ? false : _props$error,
+    hideErrorDom = props.hideErrorDom,
+    _props$helperText = props.helperText,
+    helperText = _props$helperText === void 0 ? '' : _props$helperText,
+    _props$required = props.required,
+    required = _props$required === void 0 ? false : _props$required,
+    popoverClassName = props.popoverClassName,
+    value = props.value,
+    onChange = props.onChange,
+    _props$langList = props.langList,
+    langList = _props$langList === void 0 ? ['zh', 'en'] : _props$langList,
+    _props$disabled = props.disabled,
+    disabled = _props$disabled === void 0 ? false : _props$disabled,
+    defaultLang = props.defaultLang,
+    disabledDelete = props.disabledDelete,
+    disabledAdd = props.disabledAdd,
+    disabledKey = props.disabledKey;
+  var _useState = useState(false),
+    _useState2 = _slicedToArray(_useState, 2),
+    open = _useState2[0],
+    setOpen = _useState2[1]; // 打开弹窗
+  var _useState3 = useState(GetLanguage() || 'zh'),
+    _useState4 = _slicedToArray(_useState3, 2),
+    lang = _useState4[0],
+    setLang = _useState4[1]; // 当前语言
+  var _useState5 = useState({}),
+    _useState6 = _slicedToArray(_useState5, 2),
+    langMapping = _useState6[0],
+    setLangMapping = _useState6[1];
+  var _useState7 = useState({}),
+    _useState8 = _slicedToArray(_useState7, 2),
+    valueCom = _useState8[0],
+    setValueCom = _useState8[1];
+  var _useState9 = useState([]),
+    _useState10 = _slicedToArray(_useState9, 2),
+    valueListLang = _useState10[0],
+    setValueListLang = _useState10[1]; // 多值框值
+  var constData = useRef({
+    lang: lang,
+    valueCom: valueCom,
+    langMapping: {},
+    langLabelMapping: {}
+  });
+  constData.current.lang = lang;
+  constData.current.disabledDelete = disabledDelete;
+  useEffect(function () {
+    if (props.defaultValue !== undefined) {
+      handValue(props.defaultValue);
+    }
+  }, []);
+  useEffect(function () {
+    if (value !== undefined) {
+      handValue(value);
+    }
+  }, [value]);
+  useEffect(function () {
+    if (defaultLang !== undefined) {
+      setLang(defaultLang);
+      constData.current.lang = defaultLang;
+      handValue();
+    }
+  }, [defaultLang]);
+  useEffect(function () {
+    if (langList) {
+      var obj = {};
+      var objLabel = {};
+      for (var i = 0, l = langList.length; i < l; i++) {
+        var item = langList[i];
+        if (typeof item === "string") {
+          obj[item] = {
+            label: item,
+            value: item
+          };
+          objLabel[item] = {
+            label: item,
+            value: item
+          };
+        } else {
+          obj[item.value] = item;
+          objLabel[item.label] = item;
+        }
+      }
+      constData.current.langMapping = obj;
+      constData.current.langLabelMapping = objLabel;
+      setLangMapping(obj);
+      handValue();
+    }
+  }, [props.langList]);
+  /**
+   * 处理值
+   */
+  var handValue = function handValue(val) {
+    var valueCopy = Object.assign({}, val || constData.current.valueCom);
+    var arr = [];
+    var json = {};
+    if (constData.current.disabledDelete) {
+      var keyArr = Object.keys(constData.current.langMapping) || [];
+      for (var i = 0, l = keyArr.length; i < l; i++) {
+        var keyItem = constData.current.langMapping[keyArr[i]] || {};
+        var key = keyItem.value;
+        var _label = keyItem.label;
+        var _val = valueCopy[key];
+        if (key !== constData.current.lang) {
+          json[key] = true;
+          arr.push({
+            label: _label,
+            value: _val || ''
+          });
+        }
+      }
+    }
+    var valueCopyArr = Object.keys(valueCopy);
+    for (var _i = 0, _l = valueCopyArr.length; _i < _l; _i++) {
+      var _key = valueCopyArr[_i];
+      var item = valueCopy[_key];
+      // 不存在设置过，且不是当前语言
+      if (!json[_key] && _key !== constData.current.lang) {
+        var itemDetail = constData.current.langMapping[_key] || {};
+        arr.push({
+          label: itemDetail.label || _key,
+          value: item || ''
+        });
+      }
+    }
+    constData.current.valueCom = Object.assign({}, valueCopy);
+    setValueListLang(arr);
+    setValueCom(valueCopy);
+  };
+  /**
+   * 向外抛值
+   * */
+  var outValue = function outValue(val) {
+    if (props.value === undefined) {
+      constData.current.valueCom = Object.assign({}, val);
+      setValueCom(val);
+    }
+    onChange && onChange(val);
+  };
+  /**
+   * 改变当前语言
+   * @param event
+   */
+  var changeValue = function changeValue(event) {
+    valueCom[lang] = event.target.value;
+    var val = Object.assign({}, valueCom);
+    outValue(val);
+  };
+  /**
+   * 改变弹窗语言值
+   * @param val
+   */
+  var changeListLang = function changeListLang(val) {
+    setValueListLang(_toConsumableArray(val));
+  };
+  /** 模糊搜索 */
+  var fetchSuggestionsKey = function fetchSuggestionsKey(val, cb) {
+    var _a;
+    var arr = [];
+    var jsonMapping = ArrayToObject('label', valueListLang);
+    for (var i = 0, l = langList.length; i < l; i++) {
+      var item = langList[i];
+      if (_typeof(item) === "object") {
+        item = item.label;
+      }
+      if (!jsonMapping[item] && item !== (((_a = langMapping[lang]) === null || _a === void 0 ? void 0 : _a.label) || lang)) arr.push({
+        label: item,
+        value: item
+      });
+    }
+    cb(arr);
+  };
+  /** 点击国际化图标 */
+  var clickAfter = function clickAfter() {
+    setOpen(true);
+  };
+  /** 关闭弹窗 */
+  var handleClose = function handleClose(bol) {
+    var _a;
+    if (bol) return;
+    setOpen(false);
+    // 向外抛值
+    var json = {};
+    json[lang] = valueCom[lang] || '';
+    for (var i = 0, l = valueListLang.length; i < l; i++) {
+      var item = valueListLang[i];
+      var _label2 = ((_a = constData.current.langLabelMapping[item.label]) === null || _a === void 0 ? void 0 : _a.value) || item.label || '';
+      if (_label2.trim() !== '') json[_label2] = item.value || '';
+    }
+    outValue(json);
+  };
+  /** 当前语言 */
+  var AddonBeforeMemo = function AddonBeforeMemo() {
+    var _a;
+    return jsx("div", {
+      children: ((_a = langMapping[lang]) === null || _a === void 0 ? void 0 : _a.label) || lang
+    });
+  };
+  /** 加载更多语言 */
+  var AddonAfterMemo = useMemo(function () {
+    return jsx("div", Object.assign({
+      className: "lang-list-icon"
+    }, {
+      children: jsx(Application, {})
+    }));
+  }, []);
+  /** 处理弹出框className */
+  var popoverHandClass = function popoverHandClass() {
+    var str = $prefixCls + '-input-lang-popover';
+    if (popoverClassName) str += ' ' + popoverClassName;
+    if (disabledAdd) str += " ".concat($prefixCls, "-input-lang-popover-disabled-add");
+    if (disabledDelete) str += " ".concat($prefixCls, "-input-lang-popover-disabled-delete");
+    return str;
+  };
+  var handleDisabled = function handleDisabled() {
+    if (disabled === true) return;
+    var arr = [];
+    if (disabledKey) {
+      var bol = _typeof(disabledKey) === 'object';
+      for (var i = 0, l = valueListLang.length; i < l; i++) {
+        var _label3 = valueListLang[i].label || '';
+        var labelDetail = constData.current.langLabelMapping[_label3] || {};
+        if (bol) {
+          arr.push(_defineProperty({}, _label3, disabledKey.indexOf(labelDetail.value || _label3) !== -1));
+        } else {
+          if (_label3.trim() !== '') {
+            arr.push(_defineProperty({}, _label3, true));
+          }
+        }
+      }
+    }
+    return arr;
+  };
+  /** 弹窗列表内容 */
+  var langListPopoverContent = function langListPopoverContent() {
+    return jsx("div", Object.assign({
+      className: "input-lang-list"
+    }, {
+      children: jsx(MultiBox, {
+        className: 'input-lang-multi-box',
+        size: size,
+        disabled: handleDisabled(),
+        value: valueListLang,
+        onChange: changeListLang,
+        fetchSuggestionsKey: fetchSuggestionsKey,
+        placeholderKey: placeholderKey,
+        placeholderValue: placeholderValue
+      })
+    }));
+  };
+  /**
+   * 处理class
+   * @return {string}
+   */
+  var handClass = function handClass() {
+    var str = $prefixCls + '-input-lang';
+    if (size) str += " ".concat($prefixCls, "-input-lang-").concat(size);
+    if (error) str += " ".concat($prefixCls, "-input-lang-error");
+    if (className) str += ' ' + className;
+    return str;
+  };
+  return jsxs("div", Object.assign({
+    className: handClass(),
+    style: style
+  }, {
+    children: [jsx(Popover, Object.assign({
+      placement: "bottom-end",
+      visible: open,
+      content: langListPopoverContent(),
+      onVisibleChange: handleClose,
+      overlayClassName: popoverHandClass()
+    }, {
+      children: jsx(TextField, {
+        className: 'input-lang-text-field',
+        size: size,
+        error: error,
+        disabled: disabled,
+        required: required,
+        label: label,
+        labelTooltip: labelTooltip,
+        placeholder: placeholder,
+        value: valueCom[lang] || '',
+        addonAfter: AddonAfterMemo,
+        addonBefore: AddonBeforeMemo(),
+        hideErrorDom: true,
+        onClickAddonAfter: clickAfter,
+        onChange: changeValue
+      })
+    })), jsx(HelperText, {
+      className: "input-lang-error-text",
+      error: error,
+      helperText: helperText,
+      hideErrorDom: hideErrorDom
+    })]
+  }));
+};
+
+export { InputLang, InputLang as default };

package/InputNumber/index.d.ts

@@ -0,0 +1,71 @@
+/**
+ * @author linhd
+ * @date 2021/8/11 13:53
+ * @description 数字输入框
+ */
+import React, { FunctionComponent, ReactNode } from 'react';
+import { LabelTooltipProps } from "../Label";
+import { HelperTextDetailProps } from "../HelperText";
+import './index.scss';
+export interface InputNumberProps extends HelperTextDetailProps {
+    /** 样式class */
+    className?: string;
+    /** style */
+    style?: React.CSSProperties;
+    /** 大小 */
+    size?: 'small' | 'medium' | 'large';
+    /** 间隔 */
+    step?: number;
+    /** 最大值 */
+    max?: number;
+    /** 最小值 */
+    min?: number;
+    /** 标题 */
+    label?: ReactNode;
+    /** 标题在外,还是在内 */
+    labelMode?: 'outside' | 'inside';
+    /** 标题提示 */
+    labelSign?: ReactNode;
+    /** 帮组提示信息 */
+    labelTooltip?: LabelTooltipProps;
+    /** 提示语 */
+    placeholder?: ReactNode;
+    /** 按钮模式 左右/上下/无 */
+    btnMode?: 'lr' | 'tb' | 'none';
+    /** 是否禁用 */
+    disabled?: boolean;
+    /** 禁用加 */
+    disabledAdd?: boolean;
+    /** 禁用减 */
+    disabledReduce?: boolean;
+    /** 是否必填 */
+    required?: boolean;
+    /** 是否启用键盘快捷行为 */
+    keyboard?: boolean;
+    /** 是否自动获取焦点 */
+    autoFocus?: boolean;
+    /** 只读 */
+    readOnly?: boolean;
+    /** 指定输入框展示值的格式 */
+    formatter?: (value: number | string, info: {
+        userTyping: boolean;
+        input: string;
+    }) => string;
+    /** 指定从 formatter 里转换回数字的方式，和 formatter 搭配使用 */
+    parser?: (displayValue: string) => number;
+    /** 默认值 不受控 */
+    defaultValue?: number | null;
+    /** 默认值 受控 */
+    value?: number | null;
+    /** 改变事件 number / null */
+    onChange?: (value: any) => void;
+    /** 回车事件 */
+    onEnter?: (event: React.KeyboardEvent<HTMLInputElement>) => void;
+    /** 失去焦点 */
+    onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
+    /** 得到焦点 */
+    onFocus?: (event: React.FocusEvent<HTMLInputElement>) => void;
+    [name: string]: any;
+}
+export declare const InputNumber: FunctionComponent<InputNumberProps>;
+export default InputNumber;