@hitachivantara/uikit-react-core/dist/esm/FormElement/LabelContainer.js

Core React components for the NEXT Design System.

import { jsxs, jsx } from "react/jsx-runtime";
import { useDefaultProps, createClasses } from "@hitachivantara/uikit-react-utils";
import { theme } from "@hitachivantara/uikit-styles";
import { HvInfoMessage } from "./InfoMessage/InfoMessage.js";
import { HvLabel } from "./Label/Label.js";
const { useClasses } = createClasses("HvLabelContainer", {
  root: {
    display: "flex",
    alignItems: "center",
    gap: theme.space.xs,
    height: 24,
    marginBottom: theme.space.xxs
  },
  label: {},
  description: {}
});
const HvLabelContainer = (props) => {
  const {
    label,
    description,
    inputId,
    labelId,
    descriptionId,
    classes: classesProp,
    labelProps,
    descriptionProps,
    children,
    ...others
  } = useDefaultProps("HvLabelContainer", props);
  const { classes } = useClasses(classesProp, false);
  if (label == null && description == null && children == null) return null;
  return /* @__PURE__ */ jsxs("div", { className: classes.root, ...others, children: [
    label != null && /* @__PURE__ */ jsx(
      HvLabel,
      {
        id: labelId,
        className: classes.label,
        htmlFor: inputId,
        label,
        ...labelProps
      }
    ),
    description != null && /* @__PURE__ */ jsx(
      HvInfoMessage,
      {
        disableGutter: true,
        id: descriptionId,
        className: classes.description,
        ...descriptionProps,
        children: description
      }
    ),
    children
  ] });
};
export {
  HvLabelContainer
};