123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123 |
- "use strict";
- "use client";
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
- var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
- Object.defineProperty(exports, "__esModule", {
- value: true
- });
- Object.defineProperty(exports, "SpaceContext", {
- enumerable: true,
- get: function () {
- return _context2.SpaceContext;
- }
- });
- exports.default = void 0;
- var React = _interopRequireWildcard(require("react"));
- var _classnames = _interopRequireDefault(require("classnames"));
- var _toArray = _interopRequireDefault(require("rc-util/lib/Children/toArray"));
- var _gapSize = require("../_util/gapSize");
- var _context = require("../config-provider/context");
- var _Compact = _interopRequireDefault(require("./Compact"));
- var _context2 = require("./context");
- var _Item = _interopRequireDefault(require("./Item"));
- var _style = _interopRequireDefault(require("./style"));
- var __rest = void 0 && (void 0).__rest || function (s, e) {
- var t = {};
- for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0) t[p] = s[p];
- if (s != null && typeof Object.getOwnPropertySymbols === "function") for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
- if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i])) t[p[i]] = s[p[i]];
- }
- return t;
- };
- const InternalSpace = /*#__PURE__*/React.forwardRef((props, ref) => {
- var _a;
- const {
- getPrefixCls,
- direction: directionConfig,
- size: contextSize,
- className: contextClassName,
- style: contextStyle,
- classNames: contextClassNames,
- styles: contextStyles
- } = (0, _context.useComponentConfig)('space');
- const {
- size = contextSize !== null && contextSize !== void 0 ? contextSize : 'small',
- align,
- className,
- rootClassName,
- children,
- direction = 'horizontal',
- prefixCls: customizePrefixCls,
- split,
- style,
- wrap = false,
- classNames: customClassNames,
- styles
- } = props,
- otherProps = __rest(props, ["size", "align", "className", "rootClassName", "children", "direction", "prefixCls", "split", "style", "wrap", "classNames", "styles"]);
- const [horizontalSize, verticalSize] = Array.isArray(size) ? size : [size, size];
- const isPresetVerticalSize = (0, _gapSize.isPresetSize)(verticalSize);
- const isPresetHorizontalSize = (0, _gapSize.isPresetSize)(horizontalSize);
- const isValidVerticalSize = (0, _gapSize.isValidGapNumber)(verticalSize);
- const isValidHorizontalSize = (0, _gapSize.isValidGapNumber)(horizontalSize);
- const childNodes = (0, _toArray.default)(children, {
- keepEmpty: true
- });
- const mergedAlign = align === undefined && direction === 'horizontal' ? 'center' : align;
- const prefixCls = getPrefixCls('space', customizePrefixCls);
- const [wrapCSSVar, hashId, cssVarCls] = (0, _style.default)(prefixCls);
- const cls = (0, _classnames.default)(prefixCls, contextClassName, hashId, `${prefixCls}-${direction}`, {
- [`${prefixCls}-rtl`]: directionConfig === 'rtl',
- [`${prefixCls}-align-${mergedAlign}`]: mergedAlign,
- [`${prefixCls}-gap-row-${verticalSize}`]: isPresetVerticalSize,
- [`${prefixCls}-gap-col-${horizontalSize}`]: isPresetHorizontalSize
- }, className, rootClassName, cssVarCls);
- const itemClassName = (0, _classnames.default)(`${prefixCls}-item`, (_a = customClassNames === null || customClassNames === void 0 ? void 0 : customClassNames.item) !== null && _a !== void 0 ? _a : contextClassNames.item);
- // Calculate latest one
- let latestIndex = 0;
- const nodes = childNodes.map((child, i) => {
- var _a;
- if (child !== null && child !== undefined) {
- latestIndex = i;
- }
- const key = (child === null || child === void 0 ? void 0 : child.key) || `${itemClassName}-${i}`;
- return /*#__PURE__*/React.createElement(_Item.default, {
- className: itemClassName,
- key: key,
- index: i,
- split: split,
- style: (_a = styles === null || styles === void 0 ? void 0 : styles.item) !== null && _a !== void 0 ? _a : contextStyles.item
- }, child);
- });
- const spaceContext = React.useMemo(() => ({
- latestIndex
- }), [latestIndex]);
- // =========================== Render ===========================
- if (childNodes.length === 0) {
- return null;
- }
- const gapStyle = {};
- if (wrap) {
- gapStyle.flexWrap = 'wrap';
- }
- if (!isPresetHorizontalSize && isValidHorizontalSize) {
- gapStyle.columnGap = horizontalSize;
- }
- if (!isPresetVerticalSize && isValidVerticalSize) {
- gapStyle.rowGap = verticalSize;
- }
- return wrapCSSVar(/*#__PURE__*/React.createElement("div", Object.assign({
- ref: ref,
- className: cls,
- style: Object.assign(Object.assign(Object.assign({}, gapStyle), contextStyle), style)
- }, otherProps), /*#__PURE__*/React.createElement(_context2.SpaceContextProvider, {
- value: spaceContext
- }, nodes)));
- });
- const Space = InternalSpace;
- Space.Compact = _Compact.default;
- if (process.env.NODE_ENV !== 'production') {
- Space.displayName = 'Space';
- }
- var _default = exports.default = Space;
|