@alicloudfe/components
Version:
A react component library for aliyun
56 lines (55 loc) • 2.92 kB
JavaScript
var __assign = (this && this.__assign) || function () {
__assign = Object.assign || function(t) {
for (var s, i = 1, n = arguments.length; i < n; i++) {
s = arguments[i];
for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
t[p] = s[p];
}
return t;
};
return __assign.apply(this, arguments);
};
import React from 'react';
import { Card as NextCard, Dropdown, Menu, Icon } from '@alifd/next';
import hoistNonReactStatics from 'hoist-non-react-statics';
import ConfigProvider from '../config-provider';
import { useCssVar } from '../utils/useCssVar';
var Card = React.forwardRef(function (props, ref) {
return React.createElement(NextCard, __assign({}, props, { ref: ref }));
});
hoistNonReactStatics(Card, NextCard);
Card.DropDownActions = function (_a) {
var actions = _a.actions;
var theme = useCssVar('--alicloudfe-components-theme').trim();
var actionIcon = (function () {
if (theme.startsWith('hybridcloud')) {
return (React.createElement(Icon, { className: "hybridcloud-card-dropdown-actions-icon", type: "ellipsis", size: "large" }));
}
else if (theme.startsWith('yunxiao')) {
return (React.createElement(Icon, { className: "yunxiao-card-dropdown-actions-icon", type: "ellipsis" }));
}
else {
return React.createElement(Icon, { type: "ellipsis-vertical", size: "small" });
}
})();
return (React.createElement(Dropdown, { trigger: actionIcon, triggerType: "click" },
React.createElement(Menu, null, actions.map(function (_a, idx) {
var label = _a.label, onClick = _a.onClick;
return (React.createElement(Menu.Item, { onClick: onClick, key: idx }, label));
}))));
};
var CollapsableTail = function (_a) {
var collapsed = _a.collapsed, onCollapsedChange = _a.onCollapsedChange, prefix = _a.prefix, _b = _a.children, children = _b === void 0 ? '展开更多' : _b;
return (React.createElement("div", { className: prefix + "card-collapsable-tail", onClick: function () { return onCollapsedChange(!collapsed); } },
children,
collapsed ? React.createElement(Icon, { type: "3212" }) : React.createElement(Icon, { type: "3213" })));
};
Card.CollapsableTail = ConfigProvider.config(CollapsableTail);
var CollapsableHead = function (_a) {
var collapsed = _a.collapsed, onCollapsedChange = _a.onCollapsedChange, prefix = _a.prefix, _b = _a.children, children = _b === void 0 ? '标题' : _b;
return (React.createElement("div", { className: prefix + "card-collapsable-head", onClick: function () { return onCollapsedChange(!collapsed); } },
children,
collapsed ? React.createElement(Icon, { type: "3212" }) : React.createElement(Icon, { type: "3213" })));
};
Card.CollapsableHead = ConfigProvider.config(CollapsableHead);
export default Card;