antd-mobile
Version:
<div align="center">
65 lines (64 loc) • 2.43 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.Ellipsis = void 0;
var _react = _interopRequireDefault(require("react"));
var _nativeProps = require("../../utils/native-props");
var _useResizeEffect = require("../../utils/use-resize-effect");
var _withDefaultProps = require("../../utils/with-default-props");
var _withStopPropagation = require("../../utils/with-stop-propagation");
var _useMeasure = _interopRequireDefault(require("./useMeasure"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
const classPrefix = `adm-ellipsis`;
const defaultProps = {
direction: 'end',
rows: 1,
expandText: '',
content: '',
collapseText: '',
stopPropagationForActionButtons: [],
onContentClick: () => {},
defaultExpanded: false
};
const Ellipsis = p => {
const props = (0, _withDefaultProps.mergeProps)(defaultProps, p);
const {
content,
direction,
rows,
expandText,
collapseText,
stopPropagationForActionButtons,
onContentClick,
defaultExpanded
} = props;
// ============================ Refs ============================
const rootRef = _react.default.useRef(null);
// ========================== Expanded ==========================
const [expanded, setExpanded] = _react.default.useState(defaultExpanded);
const expandNode = expandText ? (0, _withStopPropagation.withStopPropagation)(stopPropagationForActionButtons, _react.default.createElement("a", {
onClick: () => {
setExpanded(true);
}
}, expandText)) : null;
const collapseNode = collapseText ? (0, _withStopPropagation.withStopPropagation)(stopPropagationForActionButtons, _react.default.createElement("a", {
onClick: () => {
setExpanded(false);
}
}, collapseText)) : null;
// ========================== Ellipsis ==========================
const [measureNodes, forceResize] = (0, _useMeasure.default)(rootRef, content, rows, direction, expanded, expandNode, collapseNode);
(0, _useResizeEffect.useResizeEffect)(forceResize, rootRef);
// =========================== Render ===========================
return (0, _nativeProps.withNativeProps)(props, _react.default.createElement("div", {
ref: rootRef,
className: classPrefix,
onClick: e => {
if (e.target === e.currentTarget) {
onContentClick(e);
}
}
}, measureNodes));
};
exports.Ellipsis = Ellipsis;