@nex-ui/react/dist/cjs/components/popover/PopoverRoot.cjs

🎉 A beautiful, modern, and reliable React component library.

"use client";
'use strict';

var jsxRuntime = require('react/jsx-runtime');
var react = require('react');
var PopoverContext = require('./PopoverContext.cjs');
var useSlotClasses = require('../utils/useSlotClasses.cjs');
var useStyles = require('../utils/useStyles.cjs');
var popover = require('../../theme/recipes/popover.cjs');
var useSlot = require('../utils/useSlot.cjs');
var PopperRoot = require('../popper/PopperRoot.cjs');

const slots = [
    'root'
];
const useAriaProps = (ownerState)=>{
    const { id, 'aria-modal': ariaModal, role = 'dialog' } = ownerState;
    return react.useMemo(()=>({
            id,
            role,
            'aria-modal': ariaModal
        }), [
        ariaModal,
        id,
        role
    ]);
};
const PopoverRoot = ({ children })=>{
    const { motionProps, ...props } = PopoverContext.usePopover();
    const slotClasses = useSlotClasses.useSlotClasses({
        name: 'Popover',
        slots
    });
    const ariaProps = useAriaProps(props);
    const style = useStyles.useStyles({
        ownerState: props,
        name: 'Popover',
        recipe: popover.popoverRecipe
    });
    const [PopoverRootRoot, getPopoverRootRootProps] = useSlot.useSlot({
        style,
        elementType: PopperRoot.PopperRoot,
        shouldForwardComponent: false,
        externalForwardedProps: {
            ...props,
            ...motionProps
        },
        classNames: slotClasses.root,
        a11y: ariaProps
    });
    return /*#__PURE__*/ jsxRuntime.jsx(PopoverRootRoot, {
        ...getPopoverRootRootProps(),
        children: children
    });
};
PopoverRoot.displayName = 'PopoverRoot';

exports.PopoverRoot = PopoverRoot;