@brizy/ui
Version:
React elements in Brizy style
22 lines (21 loc) • 1.83 kB
JavaScript
import React, { useCallback } from "react";
import { classNames } from "../classNamesFn";
import { getAlignStyles, getColor, getSize, LoadingContent } from "./utils";
import { BRZ_PREFIX } from "../constants";
export const ShapeText = ({ boxed, boxInnerSpacing, sourceAlign, loading, loadingSettings, source, content, hoverColor, onClick, }) => {
var _a;
const _onClick = useCallback(() => {
onClick === null || onClick === void 0 ? void 0 : onClick();
}, [onClick]);
const className = classNames()("shape-text", { "shape-text__onclick": onClick });
const iconClassName = classNames()("shape-text__source", {
"shape-text__source-boxed": boxed && !loading,
"shape-text__source--loading": loading,
});
const contentClassName = classNames()("shape-text__content", {
"shape-text__content--loading": loading,
});
return (React.createElement("div", { className: className, style: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, getColor(hoverColor)), getAlignStyles(sourceAlign)), (boxed && getSize(`--${BRZ_PREFIX}-shape-text-size`, boxInnerSpacing))), getSize(`--${BRZ_PREFIX}-shape-text-source-loading`, loadingSettings === null || loadingSettings === void 0 ? void 0 : loadingSettings.sourceSize)), getSize(`--${BRZ_PREFIX}-shape-text-content--loading-size`, loadingSettings === null || loadingSettings === void 0 ? void 0 : loadingSettings.contentSize)), onClick: _onClick },
React.createElement("div", { className: iconClassName }, !loading && source),
React.createElement("div", { className: contentClassName }, loading ? React.createElement(LoadingContent, { lines: (_a = loadingSettings === null || loadingSettings === void 0 ? void 0 : loadingSettings.contentLines) !== null && _a !== void 0 ? _a : 3 }) : content)));
};