import { clsx } from 'clsx';
import { useContext } from 'react';
import { SelectInputOptionContentWithinTriggerContext } from '../SelectInput.contexts.mjs';
import { jsxs, jsx } from 'react/jsx-runtime';

function SelectInputOptionContent({
  title,
  note,
  description,
  icon
}) {
  const withinTrigger = useContext(SelectInputOptionContentWithinTriggerContext);
  return /*#__PURE__*/jsxs("div", {
    className: clsx('np-select-input-option-content-container', (note || description) && 'np-text-body-large'),
    children: [icon ? /*#__PURE__*/jsx("div", {
      className: clsx('np-select-input-option-content-icon', !withinTrigger && 'np-select-input-option-content-icon--not-within-trigger'),
      children: icon
    }) : null, /*#__PURE__*/jsxs("div", {
      className: "np-select-input-option-content-text",
      children: [/*#__PURE__*/jsxs("div", {
        className: clsx('np-select-input-option-content-text-line-1', withinTrigger && 'np-select-input-option-content-text-within-trigger'),
        children: [/*#__PURE__*/jsx("div", {
          className: "d-inline",
          children: title
        }), note ? /*#__PURE__*/jsx("span", {
          className: "np-select-input-option-content-text-secondary np-text-body-default",
          children: note
        }) : null]
      }), description ? /*#__PURE__*/jsx("div", {
        className: clsx('np-select-input-option-content-text-secondary np-text-body-default', withinTrigger && 'np-select-input-option-content-text-within-trigger np-select-input-option-description-in-trigger'),
        children: description
      }) : null]
    })]
  });
}

export { SelectInputOptionContent };
//# sourceMappingURL=SelectInputOptionContent.mjs.map
