import { clsx } from 'clsx';
import { forwardRef } from 'react';
import Body from '../../body/Body.mjs';
import { jsx, jsxs } from 'react/jsx-runtime';

const Option = /*#__PURE__*/forwardRef(({
  media = '',
  title,
  content,
  as: component,
  button,
  decision = true,
  disabled = false,
  complex,
  inverseMediaCircle = true,
  className,
  showMediaAtAllSizes,
  showMediaCircle = true,
  isContainerAligned = false,
  ...rest
}, reference) => {
  const Element = component ?? 'label';
  return /*#__PURE__*/jsx(Element, {
    ...rest,
    ref: reference,
    className: clsx('np-option', className, {
      'decision-complex': complex,
      decision,
      disabled,
      'np-option__sm-media': showMediaAtAllSizes,
      'np-option__container-aligned': isContainerAligned
    }),
    disabled: disabled && Element === 'button',
    children: /*#__PURE__*/jsxs("div", {
      className: "media",
      children: [media && /*#__PURE__*/jsx("div", {
        className: "media-left",
        children: showMediaCircle ? /*#__PURE__*/jsx("div", {
          className: clsx('circle circle-sm text-primary', {
            'circle-inverse': inverseMediaCircle
          }),
          children: media
        }) : /*#__PURE__*/jsx("div", {
          className: "np-option__no-media-circle",
          children: media
        })
      }), /*#__PURE__*/jsxs("div", {
        className: "media-body",
        children: [/*#__PURE__*/jsx("h4", {
          className: "np-text-body-large-bold text-primary np-option__title",
          children: title
        }), content && /*#__PURE__*/jsx(Body, {
          className: "d-block np-option__body",
          children: content
        })]
      }), /*#__PURE__*/jsx("div", {
        className: "media-right",
        children: button
      })]
    })
  });
});

export { Option as default };
//# sourceMappingURL=Option.mjs.map
