@engie-group/fluid-design-system-react/lib/components/multi-select/tag/NJMultiSelectTag.js

Fluid Design System React

import { jsx } from 'react/jsx-runtime';
import React__default, { useCallback } from 'react';
import '../../menu/anchor/NJMenuAnchor.js';
import '../../menu/dropdown/NJMenuDropdown.js';
import '../../menu/group/NJMenuGroup.js';
import '../../menu/item/NJMenuItem.js';
import '../../popover/anchor/NJPopoverAnchor.js';
import '../../popover/NJPopoverContext.js';
import '../../popover/NJPopoverInteractionContext.js';
import '../../menu/NJMenuContext.js';
import { useMenuSelectionContext } from '../../menu/NJMenuSelectionContext.js';
import '../../menu/NJMenuItemContext.js';
import { NJTag } from '../../tag/NJTag.js';

const NJMultiSelectTag = React__default.forwardRef((props, forwardedRef) => {
    const { children, index, onClose, ...rest } = props;
    const selectionContext = useMenuSelectionContext();
    const handleClose = useCallback((e) => {
        selectionContext?.selectItem(index);
        onClose?.(e);
    }, [selectionContext]);
    return (jsx(NJTag, { ref: forwardedRef, ...rest, onClose: handleClose, children: children }));
});
NJMultiSelectTag.displayName = 'NJMultiSelectTag';

export { NJMultiSelectTag };