@cainiaofe/cn-ui-layout
Version:
- 安装 cone-cli | [Cone-CLI 使用指引](https://alidocs.dingtalk.com/i/nodes/xdqZp24KneBJzvGM6XezJvyb7RA0Nr1E) - `tnpm i -g @alife/cone-cli@latest` - 安装依赖包 - `cone install` - 启动研发 - `cone start`
62 lines (61 loc) • 3.45 kB
JavaScript
;
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
exports.__esModule = true;
exports["default"] = void 0;
var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));
var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));
var _react = _interopRequireWildcard(require("react"));
var _classnames = _interopRequireDefault(require("classnames"));
var _constant = require("./common/constant");
var _context = _interopRequireDefault(require("./common/context"));
var _utils = require("./utils");
var _useFlexClassNames = _interopRequireDefault(require("./hooks/use-flex-class-names"));
var _excluded = ["width", "height", "children", "className", "verAlign", "style", "autoFit", "gap"];
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { "default": e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n["default"] = e, t && t.set(e, n), n; }
/**
* 行拆分布局 (子元素如果不是 Row、Col 或 Cell, 则默认用 Cell 包裹)
*/
var Row = function Row(props, ref) {
var width = props.width,
height = props.height,
children = props.children,
className = props.className,
verAlign = props.verAlign,
style = props.style,
autoFit = props.autoFit,
gapProp = props.gap,
others = (0, _objectWithoutPropertiesLoose2["default"])(props, _excluded);
var _useContext = (0, _react.useContext)(_context["default"]),
prefix = _useContext.prefix,
gridGap = _useContext.gridGap;
var clsPrefix = prefix + "row-flex";
var gap = (0, _utils.getGapVal)(gridGap, gapProp);
var validWidth = width || (style === null || style === void 0 ? void 0 : style.width);
var newStyle = (0, _react.useMemo)(function () {
return (0, _extends2["default"])({
// @ts-ignore
alignItems: _constant.VER_ALIGN_ALIAS_MAP[verAlign] || verAlign
}, width ? {
width: (0, _utils.wrapUnit)(width)
} : null, height ? {
height: (0, _utils.wrapUnit)(height)
} : null, gap ? {
gap: (0, _utils.wrapUnit)(gap)
} : null, validWidth ? {
flexBasis: (0, _utils.wrapUnit)(validWidth)
} : null, style);
}, [verAlign, width, height, gap, style, validWidth]);
var flexClassNames = (0, _useFlexClassNames["default"])(props);
return /*#__PURE__*/_react["default"].createElement("div", (0, _extends2["default"])({}, others, {
className: (0, _classnames["default"])(className, clsPrefix, flexClassNames),
style: newStyle,
ref: ref
}), children);
};
var RefRow = /*#__PURE__*/(0, _react.forwardRef)(Row);
RefRow.displayName = 'Row';
RefRow.typeMark = 'Row';
var _default = exports["default"] = RefRow;
module.exports = exports.default;
module.exports.default = exports.default;