@drivy/cobalt/components/Layout/Surfaces/index.js

Opinionated design system for Drivy's projects.

import React from 'react';
import cx from 'classnames';

const getDirectionClasses = (direction) => {
    const directionClasses = [];
    if (typeof direction === "string") {
        directionClasses.push(`c-flex-${direction}`.replace("column", "col"));
    }
    else {
        for (const [key, value] of Object.entries(direction)) {
            directionClasses.push(`${key}:c-flex-${value}`.replace("column", "col"));
        }
    }
    return directionClasses;
};
const Flexible = ({ children, direction = "column", bottomPadding = false, isFullHeight = false, }) => {
    return (React.createElement("div", { className: cx("cobalt-layout-flexible", getDirectionClasses(direction), {
            "cobalt-layout--bottomPadding": bottomPadding,
            "cobalt-layout--fullHeight": isFullHeight,
        }) }, children));
};
const FlexibleWithConstraint = ({ children, size, direction = "column", bottomPadding = false, isFullHeight = false, }) => {
    return (React.createElement("div", { className: cx(`cobalt-layout-flexibleWithConstraint cobalt-layout-flexibleWithConstraint--${size}`, getDirectionClasses(direction), {
            "cobalt-layout--bottomPadding": bottomPadding,
            "cobalt-layout--fullHeight": isFullHeight,
        }) }, children));
};
const Fixed = ({ children, width, direction = "column", bottomPadding = false, isFullHeight = false, }) => {
    return (React.createElement("div", { className: cx(`cobalt-layout-fixed cobalt-layout-fixed--${width}`, getDirectionClasses(direction), {
            "cobalt-layout--bottomPadding": bottomPadding,
            "cobalt-layout--fullHeight": isFullHeight,
        }) }, children));
};

export { Fixed, Flexible, FlexibleWithConstraint };
//# sourceMappingURL=index.js.map