@dnb/eufemia
Version:
DNB Eufemia Design System UI Library
69 lines (68 loc) • 2.11 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _push = _interopRequireDefault(require("core-js-pure/stable/instance/push.js"));
var _react = _interopRequireDefault(require("react"));
var _clsx = _interopRequireDefault(require("clsx"));
var _Space = _interopRequireDefault(require("../space/Space.js"));
var _withComponentMarkers = _interopRequireDefault(require("../../shared/helpers/withComponentMarkers.js"));
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function GridContainer(props) {
const {
columns,
rowGap,
columnGap,
style,
className,
children,
element = 'div',
...rest
} = props;
const styleObj = {
...compute(columns),
...style
};
const n = 'dnb-grid-container';
const unsetClasses = [];
for (const prop in styleObj) {
if (styleObj[prop] === 'unset') {
const disableClass = `${n}__disabled--${prop.replace(/--([a-z]+)-.*/, '$1')}`;
(0, _push.default)(unsetClasses).call(unsetClasses, disableClass);
}
}
const cn = (0, _clsx.default)(n, className, unsetClasses, columnGap && `${n}--column-gap-${columnGap === true ? 'small' : columnGap}`, rowGap && `${n}--row-gap-${rowGap === true ? 'small' : rowGap}`);
return (0, _jsxRuntime.jsx)(_Space.default, {
element: element,
className: cn,
style: styleObj,
...rest,
children: children
});
}
(0, _withComponentMarkers.default)(GridContainer, {
_supportsSpacingProps: true
});
var _default = exports.default = GridContainer;
function compute(columns) {
if (!columns) {
return null;
}
const result = {};
if (typeof columns === 'number') {
columns = {
small: columns,
medium: columns,
large: columns
};
}
for (const media in columns) {
var _columns;
const value = (_columns = columns) === null || _columns === void 0 ? void 0 : _columns[media];
result[`--${media}-columns`] = value || 'unset';
}
return result;
}
//# sourceMappingURL=Container.js.map