@grafana/ui/dist/cjs/components/InfoBox/FeatureInfoBox.cjs

Grafana Components Library

'use strict';

Object.defineProperty(exports, '__esModule', { value: true });

var jsxRuntime = require('react/jsx-runtime');
var css = require('@emotion/css');
var React = require('react');
var ThemeContext = require('../../themes/ThemeContext.cjs');
var FeatureBadge = require('../FeatureBadge/FeatureBadge.cjs');
var InfoBox = require('./InfoBox.cjs');

"use strict";
const FeatureInfoBox = React.memo(
  React.forwardRef(({ title, featureState, ...otherProps }, ref) => {
    const styles = ThemeContext.useStyles2(getFeatureInfoBoxStyles);
    const titleEl = featureState ? /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
      /* @__PURE__ */ jsxRuntime.jsx("div", { className: styles.badge, children: /* @__PURE__ */ jsxRuntime.jsx(FeatureBadge.FeatureBadge, { featureState }) }),
      /* @__PURE__ */ jsxRuntime.jsx("h3", { children: title })
    ] }) : /* @__PURE__ */ jsxRuntime.jsx("h3", { children: title });
    return /* @__PURE__ */ jsxRuntime.jsx(InfoBox.InfoBox, { branded: true, title: titleEl, urlTitle: "Read documentation", ref, ...otherProps });
  })
);
FeatureInfoBox.displayName = "FeatureInfoBox";
const getFeatureInfoBoxStyles = (theme) => {
  return {
    badge: css.css({
      marginBottom: theme.spacing(1)
    })
  };
};

exports.FeatureInfoBox = FeatureInfoBox;
//# sourceMappingURL=FeatureInfoBox.cjs.map