@teamix/pro 1.6.0-beta.5 → 2.0.0-beta.1

package/lib/card/index.js

@@ -1,310 +0,0 @@
-"use strict";
-
-function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-var _exportNames = {
-  ProCard: true
-};
-exports.default = exports.ProCard = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _classnames3 = _interopRequireDefault(require("classnames"));
-var _result = _interopRequireDefault(require("@teamix/result"));
-var _components = require("@alicloudfe/components");
-var _icon = _interopRequireDefault(require("@teamix/icon"));
-var _utils = require("@teamix/utils");
-var _field = require("../field");
-var _message = require("../utils/message");
-var _skeleton = require("../skeleton");
-var _actions = require("../actions");
-var _utils2 = require("./utils");
-var _divider = _interopRequireDefault(require("./divider"));
-var _selectable = _interopRequireDefault(require("./selectable"));
-var _tab = _interopRequireDefault(require("./tab"));
-require("./index.scss");
-var _proField = _interopRequireWildcard(require("@teamix/pro-field"));
-var _reactDom = _interopRequireDefault(require("react-dom"));
-var _cardContainer = require("./card-container");
-Object.keys(_cardContainer).forEach(function (key) {
-  if (key === "default" || key === "__esModule") return;
-  if (Object.prototype.hasOwnProperty.call(_exportNames, key)) return;
-  if (key in exports && exports[key] === _cardContainer[key]) return;
-  Object.defineProperty(exports, key, {
-    enumerable: true,
-    get: function get() {
-      return _cardContainer[key];
-    }
-  });
-});
-var _excluded = ["context"],
-  _excluded2 = ["children", "title", "subTitle", "tooltip", "tooltipIcon", "tags", "description", "extra", "actions", "message", "style", "className", "image", "hoveredShadow", "divider", "bordered", "compacted", "centered", "loading", "contentLoading", "empty", "borderColor", "backgroundColor", "contentClassName", "contentStyle", "direction", "wrap", "spacing", "split", "collapsible", "defaultCollapsed", "collapsed", "onCollapse", "context"];
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
-function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-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(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-var cls = (0, _utils.usePrefixCls)('teamix-pro-card');
-var renderActionGroup = function renderActionGroup(extra, context) {
-  if (!extra) {
-    return null;
-  }
-  if (extra.actions instanceof Array) {
-    var userContext = extra.context,
-      others = _objectWithoutProperties(extra, _excluded);
-    var mergedContext = _objectSpread(_objectSpread({}, context), userContext);
-    return /*#__PURE__*/_react.default.createElement(_actions.ProActionGroup, _objectSpread(_objectSpread({
-      context: mergedContext
-    }, others), {}, {
-      type: "text"
-    }));
-  }
-  return extra;
-};
-var getFlexDirectionClassName = function getFlexDirectionClassName(direction, split) {
-  if (split) {
-    return "flex-direction-".concat(split === 'horizontal' ? 'row' : 'column');
-  }
-  return "flex-direction-".concat(direction);
-};
-var ProCard = function ProCard(props) {
-  var _classnames, _classnames2;
-  var children = props.children,
-    title = props.title,
-    subTitle = props.subTitle,
-    tooltip = props.tooltip,
-    tooltipIcon = props.tooltipIcon,
-    tags = props.tags,
-    description = props.description,
-    extra = props.extra,
-    actions = props.actions,
-    message = props.message,
-    style = props.style,
-    className = props.className,
-    image = props.image,
-    hoveredShadow = props.hoveredShadow,
-    divider = props.divider,
-    bordered = props.bordered,
-    compacted = props.compacted,
-    centered = props.centered,
-    loading = props.loading,
-    contentLoading = props.contentLoading,
-    empty = props.empty,
-    borderColor = props.borderColor,
-    backgroundColor = props.backgroundColor,
-    contentClassName = props.contentClassName,
-    contentStyle = props.contentStyle,
-    direction = props.direction,
-    wrap = props.wrap,
-    spacing = props.spacing,
-    split = props.split,
-    collapsible = props.collapsible,
-    defaultCollapsed = props.defaultCollapsed,
-    collapsed = props.collapsed,
-    onCollapse = props.onCollapse,
-    context = props.context,
-    others = _objectWithoutProperties(props, _excluded2);
-  var _React$useState = _react.default.useState(defaultCollapsed !== undefined ? defaultCollapsed : false),
-    _React$useState2 = _slicedToArray(_React$useState, 2),
-    innerCollapseState = _React$useState2[0],
-    setInnerCollapseState = _React$useState2[1];
-  var cardRef = _react.default.useRef();
-  // 表头 tooltip tags description 宽度
-  var _React$useState3 = _react.default.useState(0),
-    _React$useState4 = _slicedToArray(_React$useState3, 2),
-    headerWithoutTitleWidth = _React$useState4[0],
-    setHeaderWithoutTitleWidth = _React$useState4[1];
-  var _formatSpacing = (0, _utils2.formatSpacing)(spacing),
-    horizonal = _formatSpacing.horizonal,
-    vertical = _formatSpacing.vertical;
-  (0, _react.useEffect)(function () {
-    calculateHeaderWidth();
-  }, []);
-  var hasDivider = (divider || !!split) && (title || extra);
-  var hasCollapse = collapsible === true || defaultCollapsed !== undefined || collapsed !== undefined;
-  var collapseState = collapsed !== undefined ? collapsed : innerCollapseState;
-  var showContent = hasCollapse ? !collapseState : true;
-  var onCollapseChanged = function onCollapseChanged() {
-    onCollapse && onCollapse(!collapseState);
-    if (collapsed !== undefined) {
-      return;
-    }
-    setInnerCollapseState(!collapseState);
-  };
-  var childCardStyle = split ? {} : {
-    paddingRight: horizonal,
-    paddingLeft: horizonal,
-    paddingTop: vertical,
-    paddingBottom: vertical
-  };
-  var dividerStyle = direction === 'row' || direction === 'row-reverse' ? {
-    marginTop: vertical,
-    marginBottom: vertical,
-    marginLeft: 20 - horizonal,
-    marginRight: 20 - horizonal
-  } : {
-    marginTop: 20 - vertical,
-    marginBottom: 20 - vertical,
-    marginLeft: horizonal,
-    marginRight: horizonal
-  };
-  // 判断是否套了卡片，如果套了的话，为自身卡片内容区设置负间距，以适配栅格系统
-  var containProCard = false;
-  // 如果嵌套了 ProCard，为其添加一层栅格化的 col 和 padding
-  var childrenModified = _react.default.Children.map(children, function (element, index) {
-    var _element$type, _element$type2;
-    if (element === null || element === void 0 ? void 0 : (_element$type = element.type) === null || _element$type === void 0 ? void 0 : _element$type.isProCard) {
-      containProCard = true;
-      var col = element.props.col;
-      var _getColClassAndStyle = (0, _utils2.getColClassAndStyle)(col),
-        colClassName = _getColClassAndStyle.className,
-        colStyle = _getColClassAndStyle.style;
-      return /*#__PURE__*/_react.default.createElement("div", {
-        style: _objectSpread(_objectSpread({}, childCardStyle), colStyle),
-        className: (0, _classnames3.default)(cls('col'), colClassName),
-        key: "pro-card-col-".concat(index)
-      }, /*#__PURE__*/_react.default.cloneElement(element));
-    }
-    if (element === null || element === void 0 ? void 0 : (_element$type2 = element.type) === null || _element$type2 === void 0 ? void 0 : _element$type2.isProCardDivider) {
-      return /*#__PURE__*/_react.default.cloneElement(element, {
-        style: dividerStyle
-      });
-    }
-    return element;
-  });
-  var cardClassName = (0, _classnames3.default)(cls(), className, backgroundColor, (_classnames = {
-    'border-none': !bordered
-  }, _defineProperty(_classnames, "border-".concat(borderColor), borderColor), _defineProperty(_classnames, "compacted", compacted), _defineProperty(_classnames, "hoverable", hoveredShadow), _classnames));
-  var cardContentClassName = (0, _classnames3.default)(cls('content'), contentClassName, getFlexDirectionClassName(direction, split), (_classnames2 = {
-    'contain-pro-card': containProCard
-  }, _defineProperty(_classnames2, "split-".concat(split), split), _defineProperty(_classnames2, 'flex-wrap', wrap), _defineProperty(_classnames2, "centered", centered || empty), _classnames2));
-  var cardContentMargin = containProCard && !split ? {
-    marginRight: -horizonal,
-    marginLeft: -horizonal,
-    marginTop: -vertical,
-    marginBottom: -vertical
-  } : {};
-  var cardContentStyle = _objectSpread(_objectSpread({}, cardContentMargin), contentStyle);
-  // 计算宽度
-  var calculateHeaderWidth = function calculateHeaderWidth() {
-    if (cardRef === null || cardRef === void 0 ? void 0 : cardRef.current) {
-      var _tooltipDom$clientWid, _tagsDom$clientWidth, _descriptionDom$clien;
-      var cardDom = _reactDom.default.findDOMNode(cardRef.current);
-      var headerDom = cardDom === null || cardDom === void 0 ? void 0 : cardDom.querySelector('.teamix-pro-card-title');
-      var tooltipDom = headerDom === null || headerDom === void 0 ? void 0 : headerDom.querySelector('.teamix-pro-card-title-tooltip');
-      var tagsDom = headerDom === null || headerDom === void 0 ? void 0 : headerDom.querySelector('.teamix-pro-tags');
-      var descriptionDom = headerDom === null || headerDom === void 0 ? void 0 : headerDom.querySelector('.teamix-pro-card-title-description');
-      var widthList = [(_tooltipDom$clientWid = tooltipDom === null || tooltipDom === void 0 ? void 0 : tooltipDom.clientWidth) !== null && _tooltipDom$clientWid !== void 0 ? _tooltipDom$clientWid : 0, (_tagsDom$clientWidth = tagsDom === null || tagsDom === void 0 ? void 0 : tagsDom.clientWidth) !== null && _tagsDom$clientWidth !== void 0 ? _tagsDom$clientWidth : 0, (_descriptionDom$clien = descriptionDom === null || descriptionDom === void 0 ? void 0 : descriptionDom.clientWidth) !== null && _descriptionDom$clien !== void 0 ? _descriptionDom$clien : 0].filter(function (item) {
-        return item;
-      });
-      var width = widthList.reduce(function (acc, cur) {
-        return acc + cur;
-      }, 0) + widthList.length * 8;
-      // 无法取出精准宽度，减去1作为阈值 10为右padding
-      setHeaderWithoutTitleWidth(width - 1 + 10);
-    }
-  };
-  var renderTitle = function renderTitle() {
-    var icon = tooltipIcon || 'info-circle-line';
-    var tooltipTrigger = typeof icon === 'string' ? /*#__PURE__*/_react.default.createElement(_icon.default, {
-      size: "small",
-      type: icon
-    }) : icon;
-    return /*#__PURE__*/_react.default.createElement("div", {
-      className: cls('title')
-    }, hasCollapse && /*#__PURE__*/_react.default.createElement("div", {
-      className: (0, _classnames3.default)(cls('title-collapse'), {
-        collapsed: collapseState
-      }),
-      onClick: onCollapseChanged
-    }, /*#__PURE__*/_react.default.createElement(_icon.default, {
-      size: "small",
-      type: "down-fill"
-    }), /*#__PURE__*/_react.default.createElement("div", {
-      className: cls('title-name')
-    }, typeof title === 'string' ? /*#__PURE__*/_react.default.createElement(_proField.default, {
-      value: title,
-      type: "text",
-      render: {
-        ellipsis: true
-      }
-    }) : title)), !hasCollapse && /*#__PURE__*/_react.default.createElement("div", {
-      className: cls('title-name'),
-      style: {
-        maxWidth: "calc(100% - ".concat(headerWithoutTitleWidth, "px)")
-      }
-    }, typeof title === 'string' ? /*#__PURE__*/_react.default.createElement(_proField.Ellipsis, {
-      tooltip: title
-    }, title) : title), tooltip && /*#__PURE__*/_react.default.createElement("div", {
-      className: cls('title-tooltip')
-    }, /*#__PURE__*/_react.default.createElement(_components.Balloon.Tooltip, {
-      align: "t",
-      trigger: tooltipTrigger
-    }, tooltip)), tags && (0, _field.renderTags)(tags, 'small'), description && /*#__PURE__*/_react.default.createElement("div", {
-      className: cls('title-description')
-    }, /*#__PURE__*/_react.default.createElement(_proField.default, {
-      value: description,
-      type: "text",
-      render: {
-        ellipsis: true
-      }
-    })));
-  };
-  return /*#__PURE__*/_react.default.createElement(_components.Card, _objectSpread({
-    free: true,
-    className: cardClassName,
-    style: style,
-    actions: renderActionGroup(actions, context),
-    // @ts-ignore
-    ref: cardRef
-  }, others), !loading && image && /*#__PURE__*/_react.default.createElement(_components.Card.Media, {
-    component: "img",
-    src: image
-  }), (title || extra) && /*#__PURE__*/_react.default.createElement(_components.Card.Header, {
-    title: loading && !contentLoading ? /*#__PURE__*/_react.default.createElement(_skeleton.ProSkeletonRaw.Card.Title, null) : renderTitle(),
-    subTitle: !loading && subTitle,
-    extra: !loading && renderActionGroup(extra, context)
-  }), hasDivider && /*#__PURE__*/_react.default.createElement(_components.Card.Divider, null), showContent && /*#__PURE__*/_react.default.createElement(_components.Card.Content, {
-    style: split ? {
-      padding: 0,
-      margin: 0
-    } : {}
-  }, (loading || contentLoading) && /*#__PURE__*/_react.default.createElement(_skeleton.ProSkeletonRaw.Card.Content, null), !(loading || contentLoading) && /*#__PURE__*/_react.default.createElement("div", {
-    className: cardContentClassName,
-    style: cardContentStyle
-  }, empty && /*#__PURE__*/_react.default.createElement("div", {
-    className: cls('empty')
-  }, childrenModified ? childrenModified : /*#__PURE__*/_react.default.createElement(_result.default, {
-    theme: "hybridcloud-container",
-    img: "noData",
-    title: (0, _utils.getMessage)('noData'),
-    style: {
-      padding: '50px 0 60px'
-    }
-  })), !empty && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, message && /*#__PURE__*/_react.default.createElement("div", {
-    className: cls('content-message')
-  }, (0, _message.renderProMessage)(message, {
-    type: 'notice'
-  })), childrenModified))));
-};
-exports.ProCard = ProCard;
-ProCard.defaultProps = {
-  bordered: true,
-  spacing: 16,
-  direction: 'row'
-};
-ProCard.Divider = _divider.default;
-ProCard.Selectable = _selectable.default;
-ProCard.Tab = _tab.default;
-ProCard.isProCard = true;
-var _default = ProCard;
-exports.default = _default;

package/lib/card/index.scss

@@ -1,313 +0,0 @@
-@import "xconsole";
-
-.teamix-pro-card {
-  width: 100%;
-
-  &-container {
-    display: flex;
-
-    &-wrap {
-      flex-wrap: wrap;
-    }
-
-    &-flex {
-      &-row {
-        flex-direction: row;
-      }
-
-      &-row-reverse {
-        flex-direction: row-reverse;
-      }
-
-      &-column {
-        flex-direction: column;
-      }
-
-      &-column-reverse {
-        flex-direction: column-reverse;
-      }
-    }
-  }
-
-  &-col {
-    width: 100%;
-    $grid-columns: 24;
-    @for $i from 1 through $grid-columns {
-      &-#{$i} {
-        $width: percentage($i / $grid-columns);
-        flex: 0 0 $width;
-        width: $width;
-        max-width: $width;
-      }
-    }
-  }
-
-  .next-card-header-titles {
-    padding-right: 8px;
-  }
-  .next-card-header-extra {
-    margin-top: 2px;
-  }
-
-  &-title {
-    display: flex;
-    align-items: center;
-
-    .next-menu-btn.next-menu-btn.next-menu-btn.next-menu-btn.next-menu-btn.next-menu-btn {
-      i {
-        margin-right: 0;
-      }
-    }
-
-    & > div {
-      display: flex;
-      align-items: center;
-      &:not(:last-child) {
-        margin-right: var(--s-2, 8px);
-      }
-    }
-
-    &-name {
-      flex-shrink: 0;
-    }
-    &-name > .teamix-pro-field {
-     width: calc(100% - 24px);
-    }
-
-    &-collapse {
-      cursor: pointer;
-      .teamix-pro-card-title-name {
-        width: 100%;
-      }
-
-      & > i {
-        transition: transform 0.2s;
-        color: var(--color-text1-8, #848484);
-        margin-right: var(--s-2, 8px);
-      }
-
-      &.collapsed {
-        & > i {
-          transform: rotate(-90deg);
-        }
-      }
-    }
-
-    &-description,
-    &-tooltip {
-      color: var(--color-text1-8, #848484);
-      font-weight: normal;
-    }
-
-    &-description {
-      font-size: 12px;
-      min-width: 40px;
-    }
-  }
-
-  &-divider {
-    flex: none;
-    background-color: var(--color-line1-1, #eaeaea);
-  }
-
-  &-content {
-    &.centered {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-    }
-
-    &.contain-pro-card {
-      display: flex;
-
-      &.flex-wrap {
-        flex-wrap: wrap;
-      }
-
-      &.flex-direction {
-        &-row {
-          flex-direction: row;
-
-          .teamix-pro-card-divider {
-            width: 1px;
-          }
-        }
-
-        &-row-reverse {
-          flex-direction: row-reverse;
-          .teamix-pro-card-divider {
-            width: 1px;
-          }
-        }
-
-        &-column {
-          flex-direction: column;
-          .teamix-pro-card-divider {
-            height: 1px;
-          }
-        }
-
-        &-column-reverse {
-          flex-direction: column-reverse;
-          .teamix-pro-card-divider {
-            height: 1px;
-          }
-        }
-      }
-
-      &.split-horizontal,
-      &.split-vertical {
-        & > .teamix-pro-card-col > .teamix-pro-card {
-          border: none;
-        }
-      }
-
-      &.split-horizontal {
-        & > .teamix-pro-card-col {
-          &:not(:last-child) {
-            border-right: 1px solid var(--color-line1-1, #eaeaea);
-          }
-        }
-      }
-      &.split-vertical {
-        & > .teamix-pro-card-col {
-          &:not(:last-child) {
-            border-bottom: 1px solid var(--color-line1-1, #eaeaea);
-          }
-        }
-      }
-    }
-
-    &-message {
-      margin-bottom: var(--s-2);
-    }
-  }
-
-  &-tab {
-    margin-top: calc(0px - var(--s-2));
-
-    & > .next-tabs-bar {
-      border-bottom: none;
-    }
-
-    & > .next-tabs-content {
-      padding-top: var(--s-5, 20px);
-    }
-  }
-
-  &-empty {
-    display: flex;
-    flex-direction: column;
-    align-items: center;
-    color: var(--color-text1-8, #848484);
-  }
-
-  & > .next-card-actions {
-    & > .teamix-pro-actions {
-      & > .next-btn {
-        margin-right: 0;
-        flex-grow: 1;
-      }
-
-      & > .next-divider {
-        margin: 0;
-      }
-    }
-  }
-
-  &.hoverable {
-    &:hover {
-      box-shadow: var(--shadow-3, 0px 6px 24px 0px rgba(0, 0, 0, 0.1));
-    }
-  }
-
-  &.compacted {
-    border: none;
-
-    & > .next-card-header {
-      margin-top: 0;
-      padding: 0;
-    }
-    & > .next-card-content-container {
-      margin: 0;
-      padding: 0;
-    }
-  }
-
-  &.border {
-    &-blue {
-      border-color: var(--color-notice-5);
-    }
-
-    &-orange {
-      border-color: var(--color-warning-5);
-    }
-
-    &-yellow {
-      border-color: var(--color-help-5);
-    }
-
-    &-red {
-      border-color: var(--color-error-5);
-    }
-
-    &-green {
-      border-color: var(--color-success-5);
-    }
-
-    &-grey {
-      border-color: var(--color-line1-1);
-    }
-
-    &-transparent {
-      border-color: transparent;
-    }
-
-    &-none {
-      border: none;
-    }
-  }
-
-  &-selectable {
-    cursor: pointer;
-
-    &-icon {
-      &-selected {
-        color: var(--color-notice-5);
-      }
-
-      &-unselected {
-        color: var(--color-line1-1);
-      }
-    }
-  }
-
-  &.blue {
-    background-color: var(--color-notice-1);
-  }
-
-  &.orange {
-    background-color: var(--color-warning-1);
-  }
-
-  &.yellow {
-    background-color: var(--color-help-1);
-  }
-
-  &.red {
-    background-color: var(--color-error-1);
-  }
-
-  &.green {
-    background-color: var(--color-success-1);
-  }
-
-  &.grey {
-    background-color: var(--color-fill1-2);
-  }
-
-  &.transparent {
-    background: transparent;
-  }
-
-}

package/lib/card/selectable.d.ts

@@ -1,13 +0,0 @@
-import { ProCardProps } from './index';
-export interface ProCardSelectableProps extends Omit<ProCardProps, 'onSelect'> {
-    selected?: boolean;
-    onSelect?: (selected: boolean) => void;
-}
-declare const ProCardSelectable: {
-    (props: ProCardSelectableProps): JSX.Element;
-    defaultProps: {
-        hoveredShadow: boolean;
-    };
-    isProCard: boolean;
-};
-export default ProCardSelectable;

package/lib/card/selectable.js

@@ -1,44 +0,0 @@
-"use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _react = _interopRequireDefault(require("react"));
-var _classnames = _interopRequireDefault(require("classnames"));
-var _icon = _interopRequireDefault(require("@teamix/icon"));
-var _utils = require("@teamix/utils");
-var _index = require("./index");
-var _excluded = ["selected", "onSelect", "className", "onClick"];
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
-var cls = (0, _utils.usePrefixCls)('teamix-pro-card-selectable');
-var ProCardSelectable = function ProCardSelectable(props) {
-  var selected = props.selected,
-    onSelect = props.onSelect,
-    className = props.className,
-    _onClick = props.onClick,
-    others = _objectWithoutProperties(props, _excluded);
-  return /*#__PURE__*/_react.default.createElement(_index.ProCard, _objectSpread({
-    className: (0, _classnames.default)(cls(), className),
-    borderColor: selected ? 'blue' : 'grey',
-    extra: /*#__PURE__*/_react.default.createElement(_icon.default, {
-      className: cls('icon', selected ? 'icon-selected' : 'icon-unselected'),
-      type: selected ? 'success-fill' : 'circle-line'
-    }),
-    onClick: function onClick(e) {
-      _onClick && _onClick(e);
-      onSelect && onSelect(!selected);
-    }
-  }, others));
-};
-ProCardSelectable.defaultProps = {
-  hoveredShadow: true
-};
-ProCardSelectable.isProCard = true;
-var _default = ProCardSelectable;
-exports.default = _default;

package/lib/card/tab.d.ts

@@ -1,6 +0,0 @@
-import { TabProps } from '@alicloudfe/components/types/tab';
-declare const ProCardTab: {
-    (props: TabProps): JSX.Element;
-    Item: typeof import("@alifd/next/types/tab").Item;
-};
-export default ProCardTab;