Paragraph.js 1.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051
  1. import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
  2. import { createVNode as _createVNode } from "vue";
  3. import { defineComponent } from 'vue';
  4. export var skeletonParagraphProps = function skeletonParagraphProps() {
  5. return {
  6. prefixCls: String,
  7. width: {
  8. type: [Number, String, Array]
  9. },
  10. rows: Number
  11. };
  12. };
  13. var SkeletonParagraph = defineComponent({
  14. compatConfig: {
  15. MODE: 3
  16. },
  17. name: 'SkeletonParagraph',
  18. props: skeletonParagraphProps(),
  19. setup: function setup(props) {
  20. var getWidth = function getWidth(index) {
  21. var width = props.width,
  22. _props$rows = props.rows,
  23. rows = _props$rows === void 0 ? 2 : _props$rows;
  24. if (Array.isArray(width)) {
  25. return width[index];
  26. }
  27. // last paragraph
  28. if (rows - 1 === index) {
  29. return width;
  30. }
  31. return undefined;
  32. };
  33. return function () {
  34. var prefixCls = props.prefixCls,
  35. rows = props.rows;
  36. var rowList = _toConsumableArray(Array(rows)).map(function (_, index) {
  37. var width = getWidth(index);
  38. return _createVNode("li", {
  39. "key": index,
  40. "style": {
  41. width: typeof width === 'number' ? "".concat(width, "px") : width
  42. }
  43. }, null);
  44. });
  45. return _createVNode("ul", {
  46. "class": prefixCls
  47. }, [rowList]);
  48. };
  49. }
  50. });
  51. export default SkeletonParagraph;