Compact.js 5.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138
  1. "use strict";
  2. var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
  3. Object.defineProperty(exports, "__esModule", {
  4. value: true
  5. });
  6. exports.useCompactItemContext = exports.spaceCompactProps = exports.spaceCompactItemProps = exports.default = exports.SpaceCompactItemContext = exports.NoCompactStyle = void 0;
  7. var _vue = require("vue");
  8. var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
  9. var _classNames = _interopRequireDefault(require("../_util/classNames"));
  10. var _createContext = _interopRequireDefault(require("../_util/createContext"));
  11. var _useConfigInject = _interopRequireDefault(require("../config-provider/hooks/useConfigInject"));
  12. var _style = _interopRequireDefault(require("./style"));
  13. var _vueTypes = _interopRequireDefault(require("../_util/vue-types"));
  14. var _type = require("../_util/type");
  15. var _lodashEs = require("lodash");
  16. var _propsUtil = require("../_util/props-util");
  17. const spaceCompactItemProps = () => ({
  18. compactSize: String,
  19. compactDirection: _vueTypes.default.oneOf((0, _type.tuple)('horizontal', 'vertical')).def('horizontal'),
  20. isFirstItem: (0, _type.booleanType)(),
  21. isLastItem: (0, _type.booleanType)()
  22. });
  23. exports.spaceCompactItemProps = spaceCompactItemProps;
  24. const SpaceCompactItemContext = exports.SpaceCompactItemContext = (0, _createContext.default)(null);
  25. const useCompactItemContext = (prefixCls, direction) => {
  26. const compactItemContext = SpaceCompactItemContext.useInject();
  27. const compactItemClassnames = (0, _vue.computed)(() => {
  28. if (!compactItemContext || (0, _lodashEs.isEmpty)(compactItemContext)) return '';
  29. const {
  30. compactDirection,
  31. isFirstItem,
  32. isLastItem
  33. } = compactItemContext;
  34. const separator = compactDirection === 'vertical' ? '-vertical-' : '-';
  35. return (0, _classNames.default)({
  36. [`${prefixCls.value}-compact${separator}item`]: true,
  37. [`${prefixCls.value}-compact${separator}first-item`]: isFirstItem,
  38. [`${prefixCls.value}-compact${separator}last-item`]: isLastItem,
  39. [`${prefixCls.value}-compact${separator}item-rtl`]: direction.value === 'rtl'
  40. });
  41. });
  42. return {
  43. compactSize: (0, _vue.computed)(() => compactItemContext === null || compactItemContext === void 0 ? void 0 : compactItemContext.compactSize),
  44. compactDirection: (0, _vue.computed)(() => compactItemContext === null || compactItemContext === void 0 ? void 0 : compactItemContext.compactDirection),
  45. compactItemClassnames
  46. };
  47. };
  48. exports.useCompactItemContext = useCompactItemContext;
  49. const NoCompactStyle = exports.NoCompactStyle = (0, _vue.defineComponent)({
  50. name: 'NoCompactStyle',
  51. setup(_, _ref) {
  52. let {
  53. slots
  54. } = _ref;
  55. SpaceCompactItemContext.useProvide(null);
  56. return () => {
  57. var _a;
  58. return (_a = slots.default) === null || _a === void 0 ? void 0 : _a.call(slots);
  59. };
  60. }
  61. });
  62. const spaceCompactProps = () => ({
  63. prefixCls: String,
  64. size: {
  65. type: String
  66. },
  67. direction: _vueTypes.default.oneOf((0, _type.tuple)('horizontal', 'vertical')).def('horizontal'),
  68. align: _vueTypes.default.oneOf((0, _type.tuple)('start', 'end', 'center', 'baseline')),
  69. block: {
  70. type: Boolean,
  71. default: undefined
  72. }
  73. });
  74. exports.spaceCompactProps = spaceCompactProps;
  75. const CompactItem = (0, _vue.defineComponent)({
  76. name: 'CompactItem',
  77. props: spaceCompactItemProps(),
  78. setup(props, _ref2) {
  79. let {
  80. slots
  81. } = _ref2;
  82. SpaceCompactItemContext.useProvide(props);
  83. return () => {
  84. var _a;
  85. return (_a = slots.default) === null || _a === void 0 ? void 0 : _a.call(slots);
  86. };
  87. }
  88. });
  89. const Compact = (0, _vue.defineComponent)({
  90. name: 'ASpaceCompact',
  91. inheritAttrs: false,
  92. props: spaceCompactProps(),
  93. setup(props, _ref3) {
  94. let {
  95. attrs,
  96. slots
  97. } = _ref3;
  98. const {
  99. prefixCls,
  100. direction: directionConfig
  101. } = (0, _useConfigInject.default)('space-compact', props);
  102. const compactItemContext = SpaceCompactItemContext.useInject();
  103. const [wrapSSR, hashId] = (0, _style.default)(prefixCls);
  104. const clx = (0, _vue.computed)(() => {
  105. return (0, _classNames.default)(prefixCls.value, hashId.value, {
  106. [`${prefixCls.value}-rtl`]: directionConfig.value === 'rtl',
  107. [`${prefixCls.value}-block`]: props.block,
  108. [`${prefixCls.value}-vertical`]: props.direction === 'vertical'
  109. });
  110. });
  111. return () => {
  112. var _a;
  113. const childNodes = (0, _propsUtil.flattenChildren)(((_a = slots.default) === null || _a === void 0 ? void 0 : _a.call(slots)) || []);
  114. // =========================== Render ===========================
  115. if (childNodes.length === 0) {
  116. return null;
  117. }
  118. return wrapSSR((0, _vue.createVNode)("div", (0, _objectSpread2.default)((0, _objectSpread2.default)({}, attrs), {}, {
  119. "class": [clx.value, attrs.class]
  120. }), [childNodes.map((child, i) => {
  121. var _a;
  122. const key = child && child.key || `${prefixCls.value}-item-${i}`;
  123. const noCompactItemContext = !compactItemContext || (0, _lodashEs.isEmpty)(compactItemContext);
  124. return (0, _vue.createVNode)(CompactItem, {
  125. "key": key,
  126. "compactSize": (_a = props.size) !== null && _a !== void 0 ? _a : 'middle',
  127. "compactDirection": props.direction,
  128. "isFirstItem": i === 0 && (noCompactItemContext || (compactItemContext === null || compactItemContext === void 0 ? void 0 : compactItemContext.isFirstItem)),
  129. "isLastItem": i === childNodes.length - 1 && (noCompactItemContext || (compactItemContext === null || compactItemContext === void 0 ? void 0 : compactItemContext.isLastItem))
  130. }, {
  131. default: () => [child]
  132. });
  133. })]));
  134. };
  135. }
  136. });
  137. var _default = exports.default = Compact;