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

const Label = /*#__PURE__*/forwardRef(({
  className,
  children,
  htmlFor,
  id
}, ref) => {
  return /*#__PURE__*/jsx("label", {
    ref: ref,
    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
  });
});
Label.displayName = 'Label';
const 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)
    })]
  });
};
const Description = function Description({
  id,
  children,
  className
}) {
  return children ? /*#__PURE__*/jsx(Body, {
    id: id,
    className: clsx('text-secondary', className),
    children: children
  }) : null;
};
// eslint-disable-next-line functional/immutable-data
const LabelNamespace = Object.assign(Label, {
  Optional,
  Description
});

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