20 lines
973 B
JavaScript
20 lines
973 B
JavaScript
'use client';
|
|
import * as React from 'react';
|
|
import { applyTriggerPropsToChildren, getReactElementRef, getTriggerChild, useMergedRefs } from '@fluentui/react-utilities';
|
|
import { useOverflowItem } from '../../useOverflowItem';
|
|
/**
|
|
* Attaches overflow item behavior to its child registered with the OverflowContext.
|
|
* It does not render an element of its own.
|
|
*
|
|
* Behaves similarly to other `*Trigger` components in Fluent UI React.
|
|
*/ export const OverflowItem = /*#__PURE__*/ React.forwardRef((props, ref)=>{
|
|
const { id, groupId, priority, pinned, children } = props;
|
|
const containerRef = useOverflowItem(id, priority, groupId, pinned);
|
|
const child = getTriggerChild(children);
|
|
return applyTriggerPropsToChildren(children, {
|
|
ref: useMergedRefs(containerRef, ref, getReactElementRef(child))
|
|
});
|
|
});
|
|
// type casting here is required to ensure internal type FluentTriggerComponent is not leaked
|
|
OverflowItem.isFluentTriggerComponent = true;
|