UNPKG

burdy

Version:

Open Source Headless Platform

44 lines (43 loc) 1.76 kB
"use strict"; var __importDefault = (this && this.__importDefault) || function (mod) { return (mod && mod.__esModule) ? mod : { "default": mod }; }; Object.defineProperty(exports, "__esModule", { value: true }); const react_1 = require("@fluentui/react"); const react_2 = __importDefault(require("react")); const classNames = (0, react_1.mergeStyleSets)({ root: { padding: '0 8px', minHeight: 60, display: 'flex', flexDirection: 'column', justifyContent: 'center', alignItems: 'flex-start', }, shimmer: { marginTop: 18, marginBottom: 19, }, titleNoMarginBottom: { marginBottom: 0, }, title: { margin: '11px 0px 12px', fontWeight: 600, lineHeight: '36px', fontSize: '18px', }, subtitle: { margin: '0 0 24px', }, noGap: { marginBottom: 0, }, }); const Heading = ({ title, subtitle, children, loading, noPadding = false, noGap = false, }) => { return (react_2.default.createElement("div", { className: classNames.root, style: { padding: noPadding ? 0 : '' } }, loading ? (react_2.default.createElement(react_1.Shimmer, { width: 80, shimmerElements: [{ type: react_1.ShimmerElementType.line, height: 8 }], className: classNames.shimmer })) : (react_2.default.createElement(react_2.default.Fragment, null, title && (react_2.default.createElement("div", { className: `${classNames.title} ${noGap && classNames.noGap}` }, title)), subtitle && (react_2.default.createElement("div", { className: `${classNames.subtitle}` }, subtitle)), children && react_2.default.createElement("div", { className: classNames.subtitle }, children))))); }; exports.default = Heading;