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

React elements in Brizy style

import React, { useCallback, useMemo } from "react";
import { classNames } from "../classNamesFn";
import { getCustomSize, getSizeResponsive, getHeightStyle, getWidthStyle, getBorderStyle, getColor, getZIndexStyle, } from "./utils";
export const Card = ({ loading, children, shadow = false, size = "middle", height, cover, width, onClick, borderRadius, borderWidth, borderStyle, borderColor, color, hoverColor, zIndex, }) => {
    const className = classNames()("card", {
        "card--loading": loading,
        "card--shadow": shadow,
        "card--cover": cover,
        "card--color-inherit": color === "inherit",
        "card--hoverColor": color === "inherit" && hoverColor,
        "card--hoverColor-inherit": hoverColor === "inherit",
        "card--onclick": onClick,
    }, getSizeResponsive(size));
    const _onClick = useCallback(() => {
        onClick === null || onClick === void 0 ? void 0 : onClick();
    }, [onClick]);
    const _getCustomSize = useMemo(() => {
        return getCustomSize(size);
    }, [size]);
    const _getHeightStyle = useMemo(() => {
        return getHeightStyle(height);
    }, [height]);
    const _getBorderStyle = useMemo(() => {
        return getBorderStyle(borderWidth, borderRadius, borderStyle, borderColor);
    }, [borderWidth, borderRadius, borderStyle, borderColor]);
    const _getColor = useMemo(() => {
        return getColor(color, hoverColor);
    }, [color, hoverColor]);
    const _getWidthStyle = useMemo(() => {
        return getWidthStyle(width);
    }, [width]);
    const _getZIndexStyle = useMemo(() => {
        return getZIndexStyle(zIndex);
    }, [zIndex]);
    return (React.createElement("div", { className: className, style: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, _getCustomSize), _getHeightStyle), _getBorderStyle), _getColor), _getWidthStyle), _getZIndexStyle), onClick: _onClick },
        cover && React.createElement("img", { src: cover }),
        loading && children ? (React.createElement(React.Fragment, null,
            React.createElement("div", null),
            React.createElement("div", null),
            React.createElement("div", null),
            React.createElement("div", null),
            React.createElement("div", null),
            React.createElement("div", null),
            React.createElement("div", null),
            React.createElement("div", null),
            React.createElement("div", null),
            React.createElement("div", null))) : (children)));
};