@hitachivantara/uikit-react-core/dist/esm/Select/Option.js

Core React components for the NEXT Design System.

import { jsx } from "react/jsx-runtime";
import { useRef } from "react";
import { useOption } from "@mui/base/useOption";
import { useForkRef } from "@mui/material/utils";
import { createClasses, useDefaultProps } from "@hitachivantara/uikit-react-utils";
import { fixedForwardRef } from "../types/generic.js";
import { outlineStyles } from "../utils/focusUtils.js";
import { HvListItem } from "../ListContainer/ListItem/ListItem.js";
const { staticClasses, useClasses } = createClasses("HvOption", {
  root: {},
  highlighted: {
    ...outlineStyles
  }
});
const HvOption = fixedForwardRef(function HvOption2(props, ref) {
  const {
    classes: classesProp,
    className,
    disabled = false,
    label,
    value,
    children,
    ...others
  } = useDefaultProps("HvOption", props);
  const { classes, cx } = useClasses(classesProp);
  const optionRef = useRef(null);
  const rootRef = useForkRef(optionRef, ref);
  const computedLabel = label ?? (typeof children === "string" ? children : optionRef.current?.textContent?.trim());
  const { getRootProps, selected, highlighted } = useOption({
    disabled,
    label: computedLabel,
    rootRef,
    value
  });
  return /* @__PURE__ */ jsx(
    HvListItem,
    {
      ref,
      selected,
      className: cx(classes.root, className, {
        [classes.highlighted]: highlighted
      }),
      ...getRootProps(others),
      children
    }
  );
});
export {
  HvOption,
  staticClasses as optionClasses
};