import { clsx } from 'clsx';
import messages from './Label.messages.mjs';
import { useIntl } from 'react-intl';
import Body from '../body/Body.mjs';
import { jsx, jsxs } from 'react/jsx-runtime';

const Label = ({
  className,
  children,
  htmlFor,
  id
}) => {
  return /*#__PURE__*/jsx("label", {
    id: id,
    htmlFor: htmlFor,
    className: clsx('np-label d-flex flex-column np-text-body-default-bold text-primary m-b-0', className),
    children: children
  });
};
// eslint-disable-next-line functional/immutable-data
Label.Optional = function Optional({
  children,
  className
}) {
  const {
    formatMessage
  } = useIntl();
  return /*#__PURE__*/jsxs("div", {
    children: [children, /*#__PURE__*/jsx(Body, {
      as: "span",
      className: clsx('text-secondary', 'm-l-1', className),
      children: formatMessage(messages.optionalLabel)
    })]
  });
};
// eslint-disable-next-line functional/immutable-data
Label.Description = function Description({
  id,
  children,
  className
}) {
  return children ? /*#__PURE__*/jsx(Body, {
    id: id,
    className: clsx('text-secondary', className),
    children: children
  }) : null;
};

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