@awsui/components-react/grid/internal.js

AWS UI is a collection of [React](https://reactjs.org/) components that help create intuitive, responsive, and accessible user experiences for web applications. It is developed by Amazon Web Services (AWS). This work is available under the terms of the [A

import { __assign, __rest } from "tslib";
import React from 'react';
import clsx from 'clsx';
import flattenChildren from 'react-keyed-flatten-children';
import { getBaseProps } from '../internal/base-component';
import { matchBreakpointMapping } from '../internal/breakpoints';
import { isDevelopment } from '../internal/is-development';
import * as logging from '../internal/logging';
import styles from './styles.css.js';
var InternalGrid = React.forwardRef(function (_a, ref) {
    var _b;
    var breakpoint = _a.breakpoint, _c = _a.gridDefinition, gridDefinition = _c === void 0 ? [] : _c, _d = _a.disableGutters, disableGutters = _d === void 0 ? false : _d, children = _a.children, responsiveClassName = _a.responsiveClassName, restProps = __rest(_a, ["breakpoint", "gridDefinition", "disableGutters", "children", "responsiveClassName"]);
    var baseProps = getBaseProps(restProps);
    var flattenedChildren = flattenChildren(children);
    if (isDevelopment) {
        var columnCount = gridDefinition.length;
        var childCount = flattenedChildren.length;
        if (columnCount !== childCount) {
            logging.warnOnce('Grid', "The number of children (" + childCount + ") does not match the number of columns defined (" + columnCount + ").");
        }
    }
    return (React.createElement("div", __assign({}, baseProps, { className: clsx(styles.grid, baseProps.className, (_b = {}, _b[styles['no-gutters']] = disableGutters, _b), responsiveClassName ? responsiveClassName(breakpoint) : null), ref: ref }), flattenedChildren.map(function (child, i) {
        var _a, _b, _c, _d;
        var key = child.key;
        return (React.createElement("div", { key: key, className: clsx(styles['grid-column'], getColumnClassNames('colspan', (_a = gridDefinition[i]) === null || _a === void 0 ? void 0 : _a.colspan, breakpoint), getColumnClassNames('offset', (_b = gridDefinition[i]) === null || _b === void 0 ? void 0 : _b.offset, breakpoint), getColumnClassNames('pull', (_c = gridDefinition[i]) === null || _c === void 0 ? void 0 : _c.pull, breakpoint), getColumnClassNames('push', (_d = gridDefinition[i]) === null || _d === void 0 ? void 0 : _d.push, breakpoint)) }, child));
    })));
});
function getColumnClassNames(prop, mapping, breakpoint) {
    if (breakpoint === null || mapping === undefined) {
        return null;
    }
    if (typeof mapping === 'number') {
        return styles[prop + "-" + mapping];
    }
    return styles[prop + "-" + matchBreakpointMapping(mapping, breakpoint)];
}
export default InternalGrid;