tdesign-react
Version:
TDesign Component for React
200 lines (192 loc) • 6.48 kB
JavaScript
/**
* tdesign v1.13.2
* (c) 2025 tdesign
* @license MIT
*/
;
Object.defineProperty(exports, '__esModule', { value: true });
var slicedToArray = require('../_chunks/dep-e17e2d31.js');
var defineProperty = require('../_chunks/dep-cc768e34.js');
var toConsumableArray = require('../_chunks/dep-64a1054a.js');
var React = require('react');
var classNames = require('classnames');
var hooks_useConfig = require('../hooks/useConfig.js');
var _util_helper = require('../_util/helper.js');
var _util_parseTNode = require('../_util/parseTNode.js');
var skeleton_defaultProps = require('./defaultProps.js');
var hooks_useDefaultProps = require('../hooks/useDefaultProps.js');
var isNumber = require('../_chunks/dep-422caf30.js');
require('../_chunks/dep-b7d577ac.js');
require('../_chunks/dep-6d4d8660.js');
require('../config-provider/ConfigContext.js');
require('../_chunks/dep-3a869b87.js');
require('../_chunks/dep-ac58e1cc.js');
require('dayjs');
require('../_chunks/dep-7da96a57.js');
require('../_chunks/dep-07b911d8.js');
require('../_chunks/dep-4b02d669.js');
require('../_chunks/dep-f0379c5f.js');
require('../_chunks/dep-ddacd27a.js');
require('../_chunks/dep-028b759d.js');
require('../_chunks/dep-8a116183.js');
require('../_chunks/dep-4671b9bd.js');
require('../_chunks/dep-bed9d73e.js');
require('../_chunks/dep-780eda7b.js');
require('../_chunks/dep-47bdc05f.js');
require('../_chunks/dep-cab13149.js');
require('../_chunks/dep-a30819a4.js');
require('../_chunks/dep-6a7ba247.js');
require('../_chunks/dep-c87d9752.js');
require('../_chunks/dep-bd956a2d.js');
require('../_chunks/dep-0cdb3286.js');
require('../_chunks/dep-865c186c.js');
require('../_chunks/dep-f4e58639.js');
require('../_chunks/dep-781a2854.js');
require('../_chunks/dep-1ef213f8.js');
require('../_chunks/dep-e2c832a5.js');
require('../_chunks/dep-810b3643.js');
require('../_chunks/dep-a70197cb.js');
require('../_chunks/dep-62193a48.js');
require('../_chunks/dep-f076775e.js');
require('../_chunks/dep-4be7f839.js');
require('../_chunks/dep-d42c60f4.js');
require('../_chunks/dep-05b4c661.js');
require('../_chunks/dep-4bc3c0ab.js');
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
var React__default = /*#__PURE__*/_interopDefaultLegacy(React);
var classNames__default = /*#__PURE__*/_interopDefaultLegacy(classNames);
var ThemeMap = {
text: [1],
avatar: [{
type: "circle",
size: "56px"
}],
paragraph: [1, 1, {
width: "70%"
}],
"avatar-text": [[{
type: "circle"
}, {
type: "text",
height: "32px"
}]],
tab: [{
height: "30px"
}, {
height: "200px"
}],
article: [{
type: "rect",
height: "30px",
width: "100%"
}, {
type: "rect",
height: "200px",
width: "100%"
}].concat(toConsumableArray._toConsumableArray([3, 2, 2, 2].map(function (value) {
return Array(value).fill({
type: "text",
height: "30px"
});
})))
};
var Skeleton = function Skeleton(originalProps) {
var props = hooks_useDefaultProps["default"](originalProps, skeleton_defaultProps.skeletonDefaultProps);
var animation = props.animation,
loading = props.loading,
rowCol = props.rowCol,
theme = props.theme,
className = props.className,
style = props.style,
_props$delay = props.delay,
delay = _props$delay === void 0 ? 0 : _props$delay,
children = props.children;
var _useConfig = hooks_useConfig["default"](),
classPrefix = _useConfig.classPrefix;
var name = "".concat(classPrefix, "-skeleton");
var renderCols = function renderCols(_cols) {
var getColItemClass = function getColItemClass(obj) {
return classNames__default["default"]("".concat(name, "__col"), "".concat(name, "--type-").concat(obj.type || "text"), defineProperty._defineProperty({}, "".concat(name, "--animation-").concat(animation), animation));
};
var getColItemStyle = function getColItemStyle(obj) {
var styleName = ["width", "height", "marginRight", "marginLeft", "margin", "size", "background", "backgroundColor"];
var style2 = {};
styleName.forEach(function (name2) {
if (name2 in obj) {
var px = _util_helper.pxCompat(obj[name2]);
if (name2 === "size") {
var _ref = [px, px];
style2.width = _ref[0];
style2.height = _ref[1];
} else {
style2[name2] = px;
}
}
});
return style2;
};
var cols = [];
if (Array.isArray(_cols)) {
cols = _cols;
} else if (isNumber.isNumber(_cols)) {
cols = new Array(_cols).fill({
type: "text"
});
} else {
cols = [_cols];
}
return cols.map(function (item, index) {
return /* @__PURE__ */React__default["default"].createElement("div", {
key: index,
className: getColItemClass(item),
style: getColItemStyle(item)
}, _util_parseTNode["default"](item.content));
});
};
var renderRowCol = function renderRowCol(_rowCol) {
var renderedRowCol = _rowCol || rowCol;
return renderedRowCol.map(function (item, index) {
return /* @__PURE__ */React__default["default"].createElement("div", {
key: index,
className: "".concat(name, "__row")
}, renderCols(item));
});
};
var _useState = React.useState(loading),
_useState2 = slicedToArray._slicedToArray(_useState, 2),
ctrlLoading = _useState2[0],
setCtrlLoading = _useState2[1];
React.useEffect(function () {
if (delay > 0 && !loading) {
var timeout = setTimeout(function () {
setCtrlLoading(loading);
}, delay);
return function () {
return clearTimeout(timeout);
};
}
setCtrlLoading(loading);
}, [delay, loading]);
if (!ctrlLoading) {
return /* @__PURE__ */React__default["default"].createElement(React__default["default"].Fragment, null, children);
}
var childrenContent = [];
if (theme && !rowCol) {
childrenContent.push(renderRowCol(ThemeMap[theme]));
}
if (rowCol) {
childrenContent.push(renderRowCol(rowCol));
}
if (!theme && !rowCol) {
childrenContent.push(renderRowCol([1, 1, 1, {
width: "70%"
}]));
}
return /* @__PURE__ */React__default["default"].createElement("div", {
className: className,
style: style
}, childrenContent);
};
Skeleton.displayName = "Skeleton";
exports["default"] = Skeleton;
//# sourceMappingURL=Skeleton.js.map