Row.mjs 2.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. import { createVNode as _createVNode } from "vue";
  2. import { computed, defineComponent } from "vue";
  3. import { truthProp, makeStringProp, makeNumericProp, createNamespace } from "../utils/index.mjs";
  4. import { useChildren } from "@vant/use";
  5. const [name, bem] = createNamespace("row");
  6. const ROW_KEY = Symbol(name);
  7. const rowProps = {
  8. tag: makeStringProp("div"),
  9. wrap: truthProp,
  10. align: String,
  11. gutter: makeNumericProp(0),
  12. justify: String
  13. };
  14. var stdin_default = defineComponent({
  15. name,
  16. props: rowProps,
  17. setup(props, {
  18. slots
  19. }) {
  20. const {
  21. children,
  22. linkChildren
  23. } = useChildren(ROW_KEY);
  24. const groups = computed(() => {
  25. const groups2 = [[]];
  26. let totalSpan = 0;
  27. children.forEach((child, index) => {
  28. totalSpan += Number(child.span);
  29. if (totalSpan > 24) {
  30. groups2.push([index]);
  31. totalSpan -= 24;
  32. } else {
  33. groups2[groups2.length - 1].push(index);
  34. }
  35. });
  36. return groups2;
  37. });
  38. const spaces = computed(() => {
  39. const gutter = Number(props.gutter);
  40. const spaces2 = [];
  41. if (!gutter) {
  42. return spaces2;
  43. }
  44. groups.value.forEach((group) => {
  45. const averagePadding = gutter * (group.length - 1) / group.length;
  46. group.forEach((item, index) => {
  47. if (index === 0) {
  48. spaces2.push({
  49. right: averagePadding
  50. });
  51. } else {
  52. const left = gutter - spaces2[item - 1].right;
  53. const right = averagePadding - left;
  54. spaces2.push({
  55. left,
  56. right
  57. });
  58. }
  59. });
  60. });
  61. return spaces2;
  62. });
  63. linkChildren({
  64. spaces
  65. });
  66. return () => {
  67. const {
  68. tag,
  69. wrap,
  70. align,
  71. justify
  72. } = props;
  73. return _createVNode(tag, {
  74. "class": bem({
  75. [`align-${align}`]: align,
  76. [`justify-${justify}`]: justify,
  77. nowrap: !wrap
  78. })
  79. }, {
  80. default: () => {
  81. var _a;
  82. return [(_a = slots.default) == null ? void 0 : _a.call(slots)];
  83. }
  84. });
  85. };
  86. }
  87. });
  88. export {
  89. ROW_KEY,
  90. stdin_default as default
  91. };