@boomerang-io/carbon-addons-boomerang-react/dist/esm/internal/ListBox/ListBoxMenuItem.js

Carbon Addons for Boomerang apps

import React, { useRef, useState, useEffect } from 'react';
import cx from 'classnames';
import { prefix } from '../settings.js';

/*
IBM Confidential
694970X, 69497O0
© Copyright IBM Corp. 2022, 2024
*/
/**
 * Copyright IBM Corp. 2016, 2018
 *
 * This source code is licensed under the Apache-2.0 license found in the
 * LICENSE file in the root directory of this source tree.
 */
function useIsTruncated(ref) {
    const [isTruncated, setIsTruncated] = useState(false);
    useEffect(() => {
        const { offsetWidth, scrollWidth } = ref.current;
        setIsTruncated(offsetWidth < scrollWidth);
    }, [ref, setIsTruncated]);
    return isTruncated;
}
/**
 * `ListBoxMenuItem` is a helper component for managing the container class
 * name, alongside any classes for any corresponding states, for a generic list
 * box menu item.
 */
const ListBoxMenuItem = React.forwardRef(function ListBoxMenuItem({ children, isActive, isHighlighted, title, ...rest }, forwardedRef) {
    const ref = useRef(null);
    const isTruncated = useIsTruncated(forwardedRef?.menuItemOptionRef || ref);
    const className = cx(`${prefix}--list-box__menu-item`, {
        [`${prefix}--list-box__menu-item--active`]: isActive,
        [`${prefix}--list-box__menu-item--highlighted`]: isHighlighted,
    });
    return (React.createElement("div", { ...rest, className: className, title: isTruncated ? title : undefined },
        React.createElement("div", { className: `${prefix}--list-box__menu-item__option`, ref: forwardedRef?.menuItemOptionRef || ref }, children)));
});
ListBoxMenuItem.displayName = "ListBoxMenuItem";
ListBoxMenuItem.defaultProps = {
    isActive: false,
    isHighlighted: false,
};

export { ListBoxMenuItem as default };