@cerberus-design/react/dist/components/admonition/admonition.js

The Cerberus Design React component library.

import { jsxs, jsx } from 'react/jsx-runtime';
import { splitProps } from '../../utils/index.js';
import { Show } from '../show/show.js';
import { AdmonitionParts } from './parts.js';
import { MatchAvatar } from './match-avatar.js';

function Admonition(props) {
  const [elProps, styleProps, rootProps] = splitProps(
    props,
    ["heading", "icon", "children"],
    ["palette", "usage"]
  );
  return /* @__PURE__ */ jsxs(AdmonitionParts.Root, { ...styleProps, ...rootProps, children: [
    /* @__PURE__ */ jsx(
      Show,
      {
        when: elProps.icon,
        fallback: /* @__PURE__ */ jsx(MatchAvatar, { palette: styleProps.palette }),
        children: /* @__PURE__ */ jsx(AdmonitionParts.Indicator, { children: elProps.icon })
      }
    ),
    /* @__PURE__ */ jsxs(AdmonitionParts.Content, { children: [
      /* @__PURE__ */ jsx(Show, { when: elProps.heading, children: /* @__PURE__ */ jsx(AdmonitionParts.Heading, { children: elProps.heading }) }),
      /* @__PURE__ */ jsx(AdmonitionParts.Description, { children: elProps.children })
    ] })
  ] });
}

export { Admonition };