@brizy/ui/es/Inline/index.js

React elements in Brizy style

import React, { Children, useCallback } from "react";
import { classNames } from "../classNamesFn";
import { ifElse, pipe, prop } from "ramda";
import { getAlign, getMargin, getAlignY, getSpacing, getCustomSpacingStyles, getCustomColumnsStyles } from "./getData";
import { emptyStyles } from "../utils";
export const Inline = (props) => {
    const { children, columns, spacing = "none", align = "left", alignY = "top", onClick } = props;
    const spacingClassName = classNames(getSpacing(spacing))({ col: columns });
    const parentClassName = classNames(getAlign(align), getAlignY(alignY), getMargin(spacing))("inline");
    const _onClick = useCallback(() => {
        onClick === null || onClick === void 0 ? void 0 : onClick();
    }, [onClick]);
    const makeColumnStyles = ifElse(prop("columns"), pipe(prop("columns"), getCustomColumnsStyles), emptyStyles);
    const makeSpacing = ifElse(prop("spacing"), pipe(prop("spacing"), getCustomSpacingStyles), emptyStyles);
    return (React.createElement("div", { className: parentClassName, onClick: _onClick, style: Object.assign(Object.assign({}, makeSpacing(props)), makeColumnStyles(props)) }, Children.map(children, (child) => {
        if (child) {
            return React.createElement("div", { className: spacingClassName }, child);
        }
    })));
};