@nutui/nutui-react
Version:
京东风格的轻量级移动端 React 组件库，支持一套代码生成 H5 和小程序
62 lines (61 loc) • 2.11 kB
JavaScript
import { _ as _define_property } from "@swc/helpers/_/_define_property";
import { _ as _object_spread } from "@swc/helpers/_/_object_spread";
import { _ as _object_without_properties } from "@swc/helpers/_/_object_without_properties";
import React from "react";
import classNames from "classnames";
import { GridItem } from "../griditem/griditem";
import GridContext from "./context";
var defaultProps = {
columns: 4,
gap: 9,
center: true,
square: true,
reverse: false,
direction: 'vertical'
};
export var Grid = function(props) {
var _ref = _object_spread({}, defaultProps, props), children = _ref.children, columns = _ref.columns, gap = _ref.gap, center = _ref.center, square = _ref.square, reverse = _ref.reverse, direction = _ref.direction, style = _ref.style, className = _ref.className, onClick = _ref.onClick, rest = _object_without_properties(_ref, [
"children",
"columns",
"gap",
"center",
"square",
"reverse",
"direction",
"style",
"className",
"onClick"
]);
var childrenDom = React.Children.toArray(children);
var classPrefix = 'nut-grid';
var rootClass = function() {
return classNames(classPrefix, _define_property({}, "".concat(classPrefix, "-border"), !gap), className);
};
var rootStyle = function() {
var styleSelf = {};
if (style) {
styleSelf = style;
}
return styleSelf;
};
return /*#__PURE__*/ React.createElement("div", _object_spread({
className: rootClass(),
style: rootStyle()
}, rest), /*#__PURE__*/ React.createElement(GridContext.Provider, {
value: {
onClick: onClick
}
}, childrenDom.map(function(item, idex) {
return /*#__PURE__*/ React.cloneElement(item, {
index: idex,
columns: columns,
center: center,
gap: gap,
square: square,
reverse: reverse,
direction: direction
});
})));
};
Grid.displayName = 'NutGrid';
Grid.Item = GridItem;