@itwin/itwinui-layouts-react
Version:
iTwinUI package that provides React components for most common layouts
34 lines (33 loc) • 1.44 kB
JavaScript
;
var __importDefault = (this && this.__importDefault) || function (mod) {
return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.Grid = void 0;
/*---------------------------------------------------------------------------------------------
* Copyright (c) Bentley Systems, Incorporated. All rights reserved.
* See LICENSE.md in the project root for license terms and full copyright notice.
*--------------------------------------------------------------------------------------------*/
var react_1 = __importDefault(require("react"));
var classnames_1 = __importDefault(require("classnames"));
var GridItem_1 = require("./GridItem");
/**
* Grid component based on CSS grid.
* Grid has 12 columns across all screen breakpoints to keep consistent layouts.
* Recommended to use `Grid.Item` components as children but can take any `ReactNode` component.
*
* @example
*
* <Grid>
* <Grid.Item />
* <Grid.Item columnSpan={6}/>
* <Grid.Item columnSpan={5}/>
* </Grid>
*/
var Grid = function (props) {
var className = props.className, style = props.style, children = props.children;
return (react_1.default.createElement("div", { className: (0, classnames_1.default)('iui-layouts-grid', className), style: style }, children));
};
exports.Grid = Grid;
exports.Grid.Item = GridItem_1.GridItem;
exports.default = exports.Grid;