@nex-ui/react
Version:
🎉 A beautiful, modern, and reliable React component library.
68 lines (65 loc) • 2.09 kB
JavaScript
"use client";
import { jsx } from 'react/jsx-runtime';
import { PopoverRoot } from './PopoverRoot.mjs';
import { usePopover } from './PopoverContext.mjs';
import { useDefaultProps } from '../utils/useDefaultProps.mjs';
import { usePopper } from '../popper/PopperContext.mjs';
import { useStyles } from '../utils/useStyles.mjs';
import { useSlotClasses } from '../utils/useSlotClasses.mjs';
import { useSlot } from '../utils/useSlot.mjs';
import { PopperContent } from '../popper/PopperContent.mjs';
import { FocusTrap } from '../focusTrap/FocusTrap.mjs';
import { popoverContentRecipe } from '../../theme/recipes/popover.mjs';
const slots = [
'root'
];
const PopoverContent = (inProps)=>{
const props = useDefaultProps({
name: 'PopoverContent',
props: inProps
});
const { open } = usePopper();
const { restoreFocus } = usePopover();
const { maxHeight, maxWidth = 480, color = 'default', radius = 'md', ...remainingProps } = props;
const ownerState = {
...props,
color,
radius
};
const style = useStyles({
ownerState,
name: 'PopoverContent',
recipe: popoverContentRecipe
});
const slotClasses = useSlotClasses({
name: 'PopoverContent',
slots
});
const [PopoverContentRoot, getPopoverContentRootProps] = useSlot({
style,
elementType: PopperContent,
shouldForwardComponent: false,
externalForwardedProps: remainingProps,
classNames: slotClasses.root,
dataAttrs: {
color,
radius
},
additionalProps: {
maxWidth,
maxHeight,
tabIndex: -1
}
});
return /*#__PURE__*/ jsx(PopoverRoot, {
children: /*#__PURE__*/ jsx(FocusTrap, {
active: open,
restoreFocus: restoreFocus,
children: /*#__PURE__*/ jsx(PopoverContentRoot, {
...getPopoverContentRootProps()
})
})
});
};
PopoverContent.displayName = 'PopoverContent';
export { PopoverContent };