npm - @chlp-tech/rpa-ui - Versions diffs - 0.0.9 → 0.0.11-beta.1 - Mend

@chlp-tech/rpa-ui 0.0.9 → 0.0.11-beta.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (9) hide show

package/dist/account-select/index.d.ts +8 -38
package/dist/account-select/index.js +197 -180
package/dist/account-select/index.module.less +116 -41
package/dist/account-select/type.d.ts +80 -0
package/dist/account-select/type.js +1 -0
package/dist/release-video-card/index.js +4 -6
package/dist/release-video-card/index.module.less +4 -0
package/dist/text-ellipsis/index.js +8 -4
package/package.json +3 -2

package/dist/account-select/index.d.ts CHANGED Viewed

@@ -1,39 +1,9 @@
-import React, { FC } from "react";
-interface AccountSelectListProps {
-    accounts: {
-        key: string;
-        icon: string | React.ReactNode;
-        disabledIcon: string | React.ReactNode;
-        list: AccountSelectProps['list'];
-        placeholder: string;
-        isValid: 'img' | 'video' | 'insVideo' | undefined;
-        multiple?: boolean;
-        disabled?: boolean;
-    }[];
-    onChange?: (selected: {
-        [key: string]: string[];
-    }) => void;
-    value?: {
-        [key: string]: string[];
-    };
+import React from "react";
+import { IAccountListProps, IAccountSelectProps } from "./type";
+declare namespace AccountSelectComponent {
+    interface StaticComponents {
+        Group: React.FC<IAccountListProps>;
+    }
 }
-interface AccountSelectProps {
-    keys: string;
-    placeholder: string;
-    icon: string | React.ReactNode;
-    disabledIcon: string | React.ReactNode;
-    list: {
-        label: string;
-        desc: string;
-        isValid: boolean;
-        value: string;
-        isPersonTk: boolean;
-    }[];
-    isValid: 'img' | 'video' | 'insImg' | 'insVideo' | undefined;
-    multiple: boolean;
-    disabled?: boolean;
-    onSelectionChange: (keys: string[], accountKey: string) => void;
-    selectedValues?: string[];
-}
-declare const AccountSelectList: FC<AccountSelectListProps>;
-export default AccountSelectList;
+declare const AccountSelect: React.FC<IAccountSelectProps> & AccountSelectComponent.StaticComponents;
+export default AccountSelect;

package/dist/account-select/index.js CHANGED Viewed

@@ -1,4 +1,5 @@
 function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
 function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
@@ -14,208 +15,224 @@ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o =
 function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
 function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-import React, { useState, useMemo, useEffect } from "react";
-import { Dropdown, Row, Col, Popover, message } from "antd";
-import styles from "./index.module.less";
+import React, { useEffect } from "react";
 import DownIcon from "./imgs/down.svg";
 import UpIcon from "./imgs/up.svg";
+import { Col, Empty, Input, Popover, Row, Tooltip } from "antd";
+import { TextEllipsis } from "../index";
+import { SearchOutlined } from "@ant-design/icons";
+import classNames from "classnames";
+import styles from "./index.module.less";
+// eslint-disable-next-line @typescript-eslint/no-namespace
 var AccountSelect = function AccountSelect(props) {
-  var _useState = useState(false),
-    _useState2 = _slicedToArray(_useState, 2),
-    open = _useState2[0],
-    setOpen = _useState2[1];
-  var _useState3 = useState(props.selectedValues || []),
-    _useState4 = _slicedToArray(_useState3, 2),
-    selectedKeys = _useState4[0],
-    setSelectedKeys = _useState4[1];
-  useEffect(function () {
-    setSelectedKeys(props.selectedValues || []);
-  }, [props.selectedValues]);
-  var handleOpenChange = function handleOpenChange(nextOpen, info) {
-    if (!props.disabled && (info.source === 'trigger' || nextOpen)) {
-      setOpen(nextOpen);
-    }
+  var _props$placeholder = props.placeholder,
+    placeholder = _props$placeholder === void 0 ? '请选择账号' : _props$placeholder,
+    _props$multiple = props.multiple,
+    multiple = _props$multiple === void 0 ? false : _props$multiple;
+  var _React$useState = React.useState(false),
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    open = _React$useState2[0],
+    setOpen = _React$useState2[1];
+  var _React$useState3 = React.useState(props.options || []),
+    _React$useState4 = _slicedToArray(_React$useState3, 2),
+    optionList = _React$useState4[0],
+    setOptionList = _React$useState4[1];
+  var _React$useState5 = React.useState(props.defaultSelectList || []),
+    _React$useState6 = _slicedToArray(_React$useState5, 2),
+    selectedKeys = _React$useState6[0],
+    setSelectedKeys = _React$useState6[1];
+  var handleClearAll = function handleClearAll() {
+    var _props$onChange;
+    setSelectedKeys([]);
+    setOpen(false);
+    (_props$onChange = props.onChange) === null || _props$onChange === void 0 || _props$onChange.call(props, []);
   };
-  var handleChange = function handleChange(value) {
-    var _props$list;
-    if ((_props$list = props.list) !== null && _props$list !== void 0 && (_props$list = _props$list.find(function (item) {
-      return item.value === value.key;
-    })) !== null && _props$list !== void 0 && _props$list.isPersonTk) {
-      message.error('旧版TK账号无法发布，请前往社媒管理重新绑定账号');
-      return;
+  var renderSelectInfo = function renderSelectInfo() {
+    var _props$options;
+    if (selectedKeys.length <= 0) {
+      return null;
     }
-    if (!props.disabled) {
-      setSelectedKeys(function (prevState) {
-        var newSelectedKeys;
-        if (prevState.includes(value.key)) {
-          newSelectedKeys = prevState.filter(function (item) {
-            return item !== value.key;
-          });
-        } else {
-          newSelectedKeys = props.multiple ? [].concat(_toConsumableArray(prevState), [value.key]) : [value.key];
-        }
-        props.onSelectionChange(newSelectedKeys, props.keys);
-        return newSelectedKeys;
-      });
+    if (props.multiple) {
+      return /*#__PURE__*/React.createElement("div", null, "\u5DF2\u9009\u62E9$", selectedKeys.length, "\u4E2A");
     }
+    var info = (_props$options = props.options) === null || _props$options === void 0 || (_props$options = _props$options.filter(function (item) {
+      return item.id === selectedKeys[0];
+    })) === null || _props$options === void 0 ? void 0 : _props$options[0];
+    return /*#__PURE__*/React.createElement("div", {
+      className: styles.selectInfoBox
+    }, /*#__PURE__*/React.createElement("div", {
+      className: styles.accountName
+    }, /*#__PURE__*/React.createElement(TextEllipsis, {
+      lines: 1,
+      showTooltip: false
+    }, info === null || info === void 0 ? void 0 : info.accountName)), /*#__PURE__*/React.createElement("div", {
+      className: styles.languageText
+    }, /*#__PURE__*/React.createElement(TextEllipsis, {
+      lines: 1,
+      showTooltip: false
+    }, (info === null || info === void 0 ? void 0 : info.remark) || '--')));
   };
-  var handleClearAll = function handleClearAll() {
-    setSelectedKeys([]);
-    setOpen(false);
-    props.onSelectionChange([], props.keys);
+  var renderAccountView = function renderAccountView() {
+    return /*#__PURE__*/React.createElement("div", {
+      className: styles.box
+    }, props.disabled && typeof props.disabledIcon === "string" || !props.disabled && typeof props.icon === 'string' ? /*#__PURE__*/React.createElement("img", {
+      width: 48,
+      height: 48,
+      alt: "",
+      src: props.disabled ? props.disabledIcon : props.icon
+    }) : /*#__PURE__*/React.createElement("div", null, props.disabled ? props.disabledIcon : props.icon), /*#__PURE__*/React.createElement("div", {
+      className: styles.centerContentBox
+    }, selectedKeys.length <= 0 && /*#__PURE__*/React.createElement("div", {
+      className: styles.placeHolderText
+    }, placeholder), selectedKeys.length > 0 && (props.renderSelectStatus ? props.renderSelectStatus(selectedKeys) : renderSelectInfo())), /*#__PURE__*/React.createElement("img", {
+      src: (selectedKeys === null || selectedKeys === void 0 ? void 0 : selectedKeys.length) > 0 ? UpIcon : DownIcon,
+      alt: "",
+      onClick: function onClick() {
+        if ((selectedKeys === null || selectedKeys === void 0 ? void 0 : selectedKeys.length) > 0) {
+          handleClearAll === null || handleClearAll === void 0 || handleClearAll();
+        }
+      }
+    }));
+  };
+  var onClickItem = function onClickItem(item) {
+    // const newList = [];
+    if (multiple) {
+      var _props$onChange2;
+      var newList = _toConsumableArray(selectedKeys);
+      if (newList.includes(item.id)) {
+        newList.unshift(item.id);
+      } else {
+        newList.push(item.id);
+      }
+      setSelectedKeys(newList);
+      (_props$onChange2 = props.onChange) === null || _props$onChange2 === void 0 || _props$onChange2.call(props, newList);
+    } else {
+      var _props$onChange3;
+      var _newList = [item.id];
+      setSelectedKeys(_newList);
+      (_props$onChange3 = props.onChange) === null || _props$onChange3 === void 0 || _props$onChange3.call(props, _newList);
+      setOpen(false);
+    }
   };
-  var list = props.list;
-  var isValid = useMemo(function () {
-    return list.every(function (item) {
-      return item.isValid;
+  var onSearchChange = function onSearchChange(e) {
+    var _props$options2;
+    console.log(e.target.value);
+    var searchValue = (e.target.value || '').toString().toLowerCase();
+    var list = (_props$options2 = props.options) === null || _props$options2 === void 0 ? void 0 : _props$options2.filter(function (item) {
+      var accountName = (item.accountName || '').toString().toLowerCase();
+      var ownerName = (item.ownerName || '').toString().toLowerCase();
+      return accountName.includes(searchValue) || ownerName.includes(searchValue);
     });
-  }, [list]);
-  var content = useMemo(function () {
-    switch (props.isValid) {
-      case 'img':
-        return ['大小不超过8M', '尺寸需大于4:5，小于1.91:1'];
-      case 'insImg':
-        return ['Instagram 视频宽不能超过 1920像素'];
-      case 'insVideo':
-        return ['视频宽高需小于1080*1920'];
-      case 'video':
-        return ['视频宽和高需大于360px，小于4096px', '视频帧率需要大于23fps，小于60fps'];
-      default:
-        return [];
+    setOptionList(list || []);
+  };
+  var getLanguageAndCountryList = function getLanguageAndCountryList(item) {
+    var list = [];
+    if (item.country) {
+      list.push(item.country);
+    }
+    if (item.language) {
+      list.push(item.language);
     }
-  }, [props.isValid]);
+    return list;
+  };
   return /*#__PURE__*/React.createElement(Popover, {
-    content: /*#__PURE__*/React.createElement("div", {
-      className: styles['popover_title']
-    }, content.map(function (item, index) {
-      return /*#__PURE__*/React.createElement("div", {
-        key: index,
-        className: styles['popover_item']
-      }, item);
-    })),
-    open: !!content.length
-  }, /*#__PURE__*/React.createElement(Dropdown, {
     trigger: ['click'],
-    onOpenChange: handleOpenChange,
-    open: open,
-    disabled: props.disabled,
-    overlayStyle: {
-      width: 296,
-      boxShadow: "0px 9px 28px 8px rgba(0,0,0,0.05), 0px 6px 16px 0px rgba(0,0,0,0.08), 0px 3px 6px -4px rgba(0,0,0,0.12)",
-      borderRadius: 8
+    classNames: {
+      root: styles.popBox
+    },
+    onOpenChange: function onOpenChange(open) {
+      return setOpen(open);
     },
-    menu: {
-      selectedKeys: selectedKeys,
-      onClick: handleChange,
-      items: props.isValid ? [] : list.map(function (item) {
-        return {
-          key: item.value,
+    arrow: false,
+    placement: "bottomLeft",
+    open: open,
+    content: function content() {
+      return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Input, {
+        style: {
+          height: '36px',
+          color: '#142A51'
+        },
+        prefix: /*#__PURE__*/React.createElement(SearchOutlined, {
           style: {
-            background: !item.isValid ? '#FEECEC' : selectedKeys.includes(item.value) ? '#E9F1FF' : '#FFFFFF'
-          },
-          label: /*#__PURE__*/React.createElement("div", {
-            style: {
-              display: 'flex',
-              justifyContent: 'space-between',
-              alignItems: 'center'
-            }
-          }, /*#__PURE__*/React.createElement("div", {
-            className: styles['wrap_title'],
-            style: {
-              maxWidth: 110,
-              overflow: 'hidden',
-              textOverflow: 'ellipsis',
-              whiteSpace: 'nowrap'
-            }
-          }, item.label), item !== null && item !== void 0 && item.isPersonTk ? /*#__PURE__*/React.createElement("div", {
-            style: {
-              padding: '2px 8px',
-              background: 'rgba(254, 236, 236, 1)',
-              color: '#FA4441',
-              border: '1px solid rgba(250, 68, 65, 1)',
-              borderRadius: 4,
-              whiteSpace: 'nowrap'
-            }
-          }, "\u65E7\u7248\u8D26\u53F7") : null, /*#__PURE__*/React.createElement("div", {
-            className: styles['wrap_right_desc'],
-            style: {
-              width: 77,
-              overflow: 'hidden',
-              textOverflow: 'ellipsis',
-              whiteSpace: 'nowrap'
-            }
-          }, item.desc)),
-          disabled: !item.isValid
-        };
-      })
-    }
-  }, /*#__PURE__*/React.createElement("div", {
-    className: "".concat(styles['wrap'], " ").concat(props.disabled ? styles['wrap_disabled'] : ''),
-    style: {
-      border: !isValid ? '2px solid #FA4441' : selectedKeys.length > 0 ? '2px solid #004FD3' : '1px solid #D4DBE7'
+            color: '#9EA7B5'
+          }
+        }),
+        placeholder: "\u641C\u7D22\u6210\u5458\u6216\u8D26\u53F7\u540D",
+        onChange: onSearchChange
+      }), /*#__PURE__*/React.createElement("div", {
+        className: styles.scrollBox
+      }, optionList.map(function (item) {
+        var _item$ownerName, _item$ownerName2, _item$ownerName3;
+        var languageAndCountryList = getLanguageAndCountryList(item);
+        return /*#__PURE__*/React.createElement("div", {
+          key: item.id,
+          className: classNames(styles.rowBox, _defineProperty(_defineProperty(_defineProperty({}, styles.rowBoxClick, true), styles.rowBoxSelect, selectedKeys.includes(item.id)), styles.rowBoxDisable, item.disabled)),
+          onClick: function onClick() {
+            return onClickItem(item);
+          }
+        }, /*#__PURE__*/React.createElement("div", {
+          className: styles.name
+        }, /*#__PURE__*/React.createElement(TextEllipsis, {
+          lines: 1,
+          showTooltip: false
+        }, item.accountName || '--')), /*#__PURE__*/React.createElement("div", {
+          className: styles.remark
+        }, /*#__PURE__*/React.createElement(TextEllipsis, {
+          lines: 1,
+          showTooltip: false
+        }, item.remark || '无描述')), /*#__PURE__*/React.createElement("div", {
+          className: styles.countryAndLanguage
+        }, /*#__PURE__*/React.createElement(TextEllipsis, {
+          lines: 1,
+          showTooltip: false
+        }, languageAndCountryList.join('/'))), /*#__PURE__*/React.createElement("div", {
+          className: styles.userWrap
+        }, /*#__PURE__*/React.createElement(Tooltip, {
+          title: item.ownerName && ((_item$ownerName = item.ownerName) === null || _item$ownerName === void 0 ? void 0 : _item$ownerName.length) > 4 ? item.ownerName : ''
+        }, /*#__PURE__*/React.createElement("div", {
+          className: styles.userBox
+        }, item.ownerName && ((_item$ownerName2 = item.ownerName) === null || _item$ownerName2 === void 0 ? void 0 : _item$ownerName2.length) > 4 ? "".concat((_item$ownerName3 = item.ownerName) === null || _item$ownerName3 === void 0 ? void 0 : _item$ownerName3.slice(0, 4), "...") : item.ownerName))));
+      }), optionList.length <= 0 && /*#__PURE__*/React.createElement(Empty, {
+        image: Empty.PRESENTED_IMAGE_SIMPLE,
+        description: "\u6682\u65E0\u6570\u636E"
+      })));
     }
-  }, typeof props.icon === 'string' && typeof props.disabledIcon === 'string' ? /*#__PURE__*/React.createElement("img", {
-    width: 48,
-    height: 48,
-    src: list.length && !props.disabled ? props.icon : props.disabledIcon,
-    alt: ""
-  }) : /*#__PURE__*/React.createElement("div", {
-    style: {
-      width: 48,
-      height: 48
-    }
-  }, list.length && !props.disabled ? props.icon : props.disabledIcon), /*#__PURE__*/React.createElement("div", {
-    className: styles['wrap_desc'],
-    style: {
-      color: selectedKeys.length > 0 ? '#142A51' : '#9EA7B5',
-      fontWeight: selectedKeys.length > 0 ? 500 : 400
-    }
-  }, list.length < 1 ? "\u6682\u65E0\u7ED1\u5B9A".concat(props.placeholder) : selectedKeys.length > 0 ? "\u5DF2\u9009\u62E9".concat(selectedKeys.length, "\u4E2A").concat(props.placeholder) : "\u8BF7\u9009\u62E9".concat(props.placeholder)), selectedKeys.length > 0 ? /*#__PURE__*/React.createElement("img", {
-    src: UpIcon,
-    alt: "",
-    onClick: handleClearAll
-  }) : /*#__PURE__*/React.createElement("img", {
-    src: DownIcon,
-    alt: ""
-  }))));
+  }, renderAccountView());
 };
-var AccountSelectList = function AccountSelectList(_ref) {
-  var accounts = _ref.accounts,
-    onChange = _ref.onChange,
-    _ref$value = _ref.value,
-    value = _ref$value === void 0 ? {} : _ref$value;
-  var _useState5 = useState(value),
-    _useState6 = _slicedToArray(_useState5, 2),
-    selectedAccounts = _useState6[0],
-    setSelectedAccounts = _useState6[1];
+var AccountSelectList = function AccountSelectList(props) {
+  var _React$useState7 = React.useState([]),
+    _React$useState8 = _slicedToArray(_React$useState7, 2),
+    accounts = _React$useState8[0],
+    setAccounts = _React$useState8[1];
+  var _React$useState9 = React.useState({}),
+    _React$useState10 = _slicedToArray(_React$useState9, 2),
+    selectValues = _React$useState10[0],
+    setSelectValues = _React$useState10[1];
   useEffect(function () {
-    setSelectedAccounts(value);
-  }, [value]);
-  var handleSelectionChange = function handleSelectionChange(keys, accountKey) {
-    setSelectedAccounts(function (prevState) {
-      var newState = _objectSpread(_objectSpread({}, prevState), {}, _defineProperty({}, accountKey, keys));
-      onChange === null || onChange === void 0 || onChange(newState);
-      return newState;
-    });
-  };
+    setAccounts(props.accounts.map(function (item, index) {
+      return _objectSpread({
+        key: index
+      }, item);
+    }));
+  }, [props.accounts]);
   return /*#__PURE__*/React.createElement(Row, {
     gutter: [32, 32]
   }, accounts === null || accounts === void 0 ? void 0 : accounts.map(function (account, index) {
     return /*#__PURE__*/React.createElement(Col, {
       span: 8,
       key: index
-    }, /*#__PURE__*/React.createElement(AccountSelect, {
-      keys: account.key,
-      list: account.list,
-      placeholder: account.placeholder,
-      icon: account.icon,
-      disabledIcon: account.disabledIcon,
-      isValid: account.isValid,
-      multiple: account.multiple || false,
-      disabled: account.disabled || false,
-      onSelectionChange: handleSelectionChange,
-      selectedValues: selectedAccounts[account.key]
-    }));
+    }, /*#__PURE__*/React.createElement(AccountSelect, _extends({}, account, {
+      onChange: function onChange(values) {
+        var _props$onChange4;
+        var tValues = _objectSpread({}, selectValues);
+        tValues[account.key] = values;
+        setSelectValues(tValues);
+        (_props$onChange4 = props.onChange) === null || _props$onChange4 === void 0 || _props$onChange4.call(props, tValues);
+      }
+    })));
   }));
 };
-export default AccountSelectList;
+AccountSelect.Group = AccountSelectList;
+export default AccountSelect;

package/dist/account-select/index.module.less CHANGED Viewed

@@ -1,58 +1,133 @@
-.wrap {
-  padding: 2px 17px 2px 2px;
-  border-radius: 25px;
+.box {
   display: flex;
-  justify-content: space-between;
+  flex-direction: row;
   align-items: center;
+  justify-content: space-between;
+  padding: 2px 17px 2px 2px;
+  border-radius: 999px;
   cursor: pointer;
-  &_desc {
-    font-family: PingFangSC, PingFang SC;
-    font-weight: 400;
+  border: 1px solid #D4DBE7;
+  .placeHolderText {
     font-size: 14px;
     color: #9EA7B5;
   }
-  &active_desc {
-    font-family: PingFangSC, PingFang SC;
-    font-weight: 500;
-    font-size: 14px;
-    color: #142A51;
+  .centerContentBox {
+    flex: 1;
+    overflow: hidden;
+    margin: 0 12px;
+    .selectInfoBox {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      .accountName {
+        color: #142A51;
+        font-size: 14px;
+        max-width: 66%;
+        flex: 2;
+      }
+      .languageText {
+        font-size: 12px;
+        color: #9EA7B5;
+        flex: 1;
+        max-width: 33%;
+      }
+    }
   }
+}
-  &_title {
-    font-family: PingFangSC, PingFang SC;
-    font-weight: 400;
-    font-size: 14px;
-    color: #142A51;
+.popBox {
+  width: 481px;
+  background: #FFFFFF;
+  box-shadow: 0 9px 28px 8px rgba(0,0,0,0.05), 0 6px 16px 0 rgba(0,0,0,0.08), 0 3px 6px -4px rgba(0,0,0,0.12);
+  border-radius: 8px;
+  :global {
+    .ant-popover-inner {
+      padding: 4px;
+    }
   }
-  &_right_desc {
-    font-family: PingFangSC, PingFang SC;
-    font-weight: 400;
-    font-size: 12px;
-    color: #9EA7B5;
+  .scrollBox {
+    display: flex;
+    flex-direction: column;
+    max-height: 50vh;
+    overflow: auto;
+    margin-top: 4px;
+    gap: 2px;
   }
-}
-.wrap_no_active {
-  background: #F5F7FA;
-  border-radius: 25px;
-  border: 1px solid #D4DBE7;
-  padding: 2px 17px 2px 2px;
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  cursor: pointer;
-}
+  .rowBox {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    padding: 12px 12px;
+    gap: 12px;
+    &:hover {
+      background-color: #F5F7FA;
+      border-radius: 4px;
+    }
+    .name {
+      font-size: 14px;
+      color: #142A51;
+      width: 130px;
+    }
-.popover_title {
-  font-family: PingFangSC, PingFang SC;
-  font-weight: 400;
-  font-size: 14px;
-  color: #FA4441;
-  line-height: 20px;
-  text-align: left;
-  font-style: normal;
+    .remark {
+      font-size: 12px;
+      color: #9EA7B5;
+      flex: 1;
+    }
+    .countryAndLanguage {
+      font-size: 12px;
+      color: #9EA7B5;
+      width: 80px;
+    }
+    .userWrap {
+      width: 80px;
+      display: flex;
+      flex-direction: row;
+      justify-content: flex-end;
+    }
+    .userBox {
+      width: max-content;
+      background: #E9F1FF;
+      border-radius: 4px;
+      border: 1px solid #004FD3;
+      padding: 4px 8px;
+      font-size: 12px;
+      color: #004FD3;
+    }
+  }
+  .rowBoxClick {
+    cursor: pointer;
+  }
+  .rowBoxSelect {
+    background-color: #e6f3ff;
+    border-radius: 4px;
+    &:hover {
+      background-color: #e6f3ff;
+    }
+  }
+  .rowBoxDisable {
+    cursor: not-allowed;
+    &:hover {
+      background-color: #fff;
+    }
+  }
 }

package/dist/account-select/type.d.ts ADDED Viewed

@@ -0,0 +1,80 @@
+import React, { ReactElement } from "react";
+export interface IAccountSelectProps {
+    /**
+     * 普通状态下的icon
+     */
+    icon?: string | React.ReactElement;
+    /**
+     * 禁用状态下的icon
+     */
+    disabledIcon?: string | React.ReactElement;
+    /**
+     * 默认选中的条数
+     */
+    defaultSelectList?: (number | string)[];
+    /**
+     * 没有选择文件的时候默认提示文案
+     */
+    placeholder?: string | React.ReactElement;
+    /**
+     * 是否禁用
+     */
+    disabled?: boolean;
+    /**
+     * 是否多选
+     */
+    multiple?: boolean;
+    /**
+     * 选项发生变化触发
+     * @param values
+     */
+    onChange?: (values: (string | number)[]) => void;
+    /**
+     * 下拉选项列表
+     */
+    options?: IAccountOptionModel[];
+    /**
+     * 自定义渲染选择之后的视图
+     * @param values
+     */
+    renderSelectStatus: (values: (string | number)[]) => ReactElement;
+}
+export interface IAccountOptionModel {
+    /**
+     * 选项唯一值
+     */
+    id: string | number;
+    /**
+     * 账号名
+     */
+    accountName?: string;
+    /**
+     * 备注
+     */
+    remark?: string;
+    /**
+     * 国家
+     */
+    country?: string;
+    /**
+     * 语言
+     */
+    language?: string;
+    /**
+     * 所属人员
+     */
+    ownerName?: string;
+    /**
+     * 不可操作
+     */
+    disabled?: boolean;
+}
+export interface IAccountListProps {
+    accounts: IAccountSelectProps[];
+    onChange?: (selected: {
+        [key: string]: string[];
+    }) => void;
+    value?: {
+        [key: string]: string[];
+    };
+}

package/dist/account-select/type.js ADDED Viewed

	@@ -0,0 +1 @@
1	+ export {};

package/dist/release-video-card/index.js CHANGED Viewed

@@ -118,6 +118,7 @@ var ReleaseVideoCard = function ReleaseVideoCard(props) {
     style: {
       width: 120,
       borderRadius: 8,
+      height: 160,
       overflow: "hidden",
       position: "relative"
     }
@@ -149,10 +150,7 @@ var ReleaseVideoCard = function ReleaseVideoCard(props) {
   }, /*#__PURE__*/React.createElement(TextEllipsis, {
     lines: 1
   }, "\u6807\u9898\uFF1A", props.title || '- -')), /*#__PURE__*/React.createElement("div", {
-    className: styles['card_content'],
-    style: {
-      height: 55
-    }
+    className: styles['card_content']
   }, /*#__PURE__*/React.createElement(TextEllipsis, {
     lines: 2
   }, "\u63CF\u8FF0\uFF1A", props.desc || '- -')), /*#__PURE__*/React.createElement("div", {
@@ -196,7 +194,7 @@ var ReleaseVideoCard = function ReleaseVideoCard(props) {
       marginRight: 12,
       cursor: 'pointer'
     }
-  }, [0, 1].includes(props.status) ? /*#__PURE__*/React.createElement(React.Fragment, null, (_props$editComponent = props.editComponent) !== null && _props$editComponent !== void 0 ? _props$editComponent : /*#__PURE__*/React.createElement("span", null, "\u7F16\u8F91")) : [2, 3].includes(props.status) ? /*#__PURE__*/React.createElement(React.Fragment, null, (_props$detailComponen = props.detailComponent) !== null && _props$detailComponen !== void 0 ? _props$detailComponen : /*#__PURE__*/React.createElement("span", null, "\u8BE6\u60C5")) : null), /*#__PURE__*/React.createElement(Dropdown, {
+  }, [0, 1].includes(props.status) ? /*#__PURE__*/React.createElement(React.Fragment, null, (_props$editComponent = props.editComponent) !== null && _props$editComponent !== void 0 ? _props$editComponent : /*#__PURE__*/React.createElement("span", null, "\u7F16\u8F91")) : [2, 3].includes(props.status) ? /*#__PURE__*/React.createElement(React.Fragment, null, (_props$detailComponen = props.detailComponent) !== null && _props$detailComponen !== void 0 ? _props$detailComponen : /*#__PURE__*/React.createElement("span", null, "\u8BE6\u60C5")) : null), [0, 1].includes(props.status) ? /*#__PURE__*/React.createElement(Dropdown, {
     trigger: ['click'],
     menu: {
       items: [{
@@ -214,7 +212,7 @@ var ReleaseVideoCard = function ReleaseVideoCard(props) {
   }, /*#__PURE__*/React.createElement(Image, {
     src: More,
     preview: false
-  }))))), props.isNew && /*#__PURE__*/React.createElement("div", {
+  }))) : null)), props.isNew && /*#__PURE__*/React.createElement("div", {
     className: styles['new-position']
   }, /*#__PURE__*/React.createElement(Image, {
     src: New,

package/dist/release-video-card/index.module.less CHANGED Viewed

@@ -24,6 +24,10 @@
     text-align: left;
     font-style: normal;
     flex: 1;
+    display: flex;
+    flex-direction: column;
+    justify-content: space-around;
     &__desc {
       font-weight: 400;
       font-size: 14px;

package/dist/text-ellipsis/index.js CHANGED Viewed

@@ -27,7 +27,7 @@ var TextEllipsis = function TextEllipsis(_ref) {
         var parentElement = parentRef.current;
         var parentWidth = parentElement.clientWidth;
         var textWidth = textElement.scrollWidth;
-        setIsTruncated(textWidth > parentWidth);
+        setIsTruncated(textWidth >= parentWidth);
       }
     };
     checkTruncation();
@@ -41,17 +41,21 @@ var TextEllipsis = function TextEllipsis(_ref) {
   }, /*#__PURE__*/React.createElement("div", {
     className: styles['text-ellipsis'],
     ref: parentRef,
+    style: {
+      width: '100%'
+    }
+  }, /*#__PURE__*/React.createElement("div", {
+    ref: textRef,
     style: {
       display: '-webkit-box',
+      width: 'max-content',
+      maxWidth: '100%',
       WebkitBoxOrient: 'vertical',
       WebkitLineClamp: lines,
       overflow: 'hidden',
       textOverflow: 'ellipsis',
-      width: '100%',
       wordBreak: 'break-all'
     }
-  }, /*#__PURE__*/React.createElement("div", {
-    ref: textRef
   }, children)));
 };
 export default TextEllipsis;

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@chlp-tech/rpa-ui",
-  "version": "0.0.9",
+  "version": "0.0.11-beta.1",
   "description": "rpa-ui",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -36,7 +36,7 @@
   },
   "peerDependencies": {
     "@ant-design/icons": ">=4.18.0",
-    "antd": ">=4.18.0",
+    "antd": ">=5.25.0",
     "react": ">=16.9.0",
     "react-dom": ">=16.9.0"
   },
@@ -62,6 +62,7 @@
   },
   "dependencies": {
     "@webav/av-cliper": "^1.0.11",
+    "classnames": "^2.5.1",
     "dayjs": "^1.11.13",
     "js-md5": "^0.8.3",
     "styled-components": "^6.1.12"