5ea7bdacc5cda5cca0f4515d9996d8ea8a7cadb17ef74dc5982901edcfcef86922bc1e6f71652e17026d9b19274b9540046ef7796e9ee0b72d3ca8f129d435 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  1. import { isVNode, defineComponent, renderSlot, createVNode, createTextVNode, Comment } from 'vue';
  2. import SpaceItem from './item.mjs';
  3. import { useSpace } from './use-space.mjs';
  4. import { PatchFlags, isFragment, isValidElementNode } from '../../../utils/vue/vnode.mjs';
  5. import { buildProps, definePropType } from '../../../utils/vue/props/runtime.mjs';
  6. import { isNumber } from '../../../utils/types.mjs';
  7. import { isString, isArray } from '@vue/shared';
  8. import { componentSizes } from '../../../constants/size.mjs';
  9. const spaceProps = buildProps({
  10. direction: {
  11. type: String,
  12. values: ["horizontal", "vertical"],
  13. default: "horizontal"
  14. },
  15. class: {
  16. type: definePropType([
  17. String,
  18. Object,
  19. Array
  20. ]),
  21. default: ""
  22. },
  23. style: {
  24. type: definePropType([String, Array, Object]),
  25. default: ""
  26. },
  27. alignment: {
  28. type: definePropType(String),
  29. default: "center"
  30. },
  31. prefixCls: {
  32. type: String
  33. },
  34. spacer: {
  35. type: definePropType([Object, String, Number, Array]),
  36. default: null,
  37. validator: (val) => isVNode(val) || isNumber(val) || isString(val)
  38. },
  39. wrap: Boolean,
  40. fill: Boolean,
  41. fillRatio: {
  42. type: Number,
  43. default: 100
  44. },
  45. size: {
  46. type: [String, Array, Number],
  47. values: componentSizes,
  48. validator: (val) => {
  49. return isNumber(val) || isArray(val) && val.length === 2 && val.every(isNumber);
  50. }
  51. }
  52. });
  53. const Space = defineComponent({
  54. name: "ElSpace",
  55. props: spaceProps,
  56. setup(props, { slots }) {
  57. const { classes, containerStyle, itemStyle } = useSpace(props);
  58. function extractChildren(children, parentKey = "", extractedChildren = []) {
  59. const { prefixCls } = props;
  60. children.forEach((child, loopKey) => {
  61. if (isFragment(child)) {
  62. if (isArray(child.children)) {
  63. child.children.forEach((nested, key) => {
  64. if (isFragment(nested) && isArray(nested.children)) {
  65. extractChildren(nested.children, `${parentKey + key}-`, extractedChildren);
  66. } else {
  67. if (isVNode(nested) && (nested == null ? void 0 : nested.type) === Comment) {
  68. extractedChildren.push(nested);
  69. } else {
  70. extractedChildren.push(createVNode(SpaceItem, {
  71. style: itemStyle.value,
  72. prefixCls,
  73. key: `nested-${parentKey + key}`
  74. }, {
  75. default: () => [nested]
  76. }, PatchFlags.PROPS | PatchFlags.STYLE, ["style", "prefixCls"]));
  77. }
  78. }
  79. });
  80. }
  81. } else if (isValidElementNode(child)) {
  82. extractedChildren.push(createVNode(SpaceItem, {
  83. style: itemStyle.value,
  84. prefixCls,
  85. key: `LoopKey${parentKey + loopKey}`
  86. }, {
  87. default: () => [child]
  88. }, PatchFlags.PROPS | PatchFlags.STYLE, ["style", "prefixCls"]));
  89. }
  90. });
  91. return extractedChildren;
  92. }
  93. return () => {
  94. var _a;
  95. const { spacer, direction } = props;
  96. const children = renderSlot(slots, "default", { key: 0 }, () => []);
  97. if (((_a = children.children) != null ? _a : []).length === 0)
  98. return null;
  99. if (isArray(children.children)) {
  100. let extractedChildren = extractChildren(children.children);
  101. if (spacer) {
  102. const len = extractedChildren.length - 1;
  103. extractedChildren = extractedChildren.reduce((acc, child, idx) => {
  104. const children2 = [...acc, child];
  105. if (idx !== len) {
  106. children2.push(createVNode("span", {
  107. style: [
  108. itemStyle.value,
  109. direction === "vertical" ? "width: 100%" : null
  110. ],
  111. key: idx
  112. }, [
  113. isVNode(spacer) ? spacer : createTextVNode(spacer, PatchFlags.TEXT)
  114. ], PatchFlags.STYLE));
  115. }
  116. return children2;
  117. }, []);
  118. }
  119. return createVNode("div", {
  120. class: classes.value,
  121. style: containerStyle.value
  122. }, extractedChildren, PatchFlags.STYLE | PatchFlags.CLASS);
  123. }
  124. return children.children;
  125. };
  126. }
  127. });
  128. export { Space as default, spaceProps };
  129. //# sourceMappingURL=space.mjs.map