@wix/design-system/dist/esm/PopoverNext/PopoverNext.js

@wix/design-system

import React, { useEffect, useRef } from 'react';
import Trigger from './components/Trigger/Trigger';
import Content from './components/Content/Content';
import { usePopover } from './hooks/usePopover';
import { PopoverNextContext } from './PopoverNext.context';
import { st, classes } from './PopoverNext.st.css.js';
import PropTypes from 'prop-types';
import { APPEND_TO, placements } from './PopoverNext.constants';
import deprecationLog from '../utils/deprecationLog';
function PopoverNext({ children, appendTo, dataHook, className, onMouseEnter, onMouseLeave, onKeyDown, fluid, open = false, skin = 'light', theme, // deprecated
shown, // deprecated
dataListType, ...restOptions }) {
    const rootRef = useRef(null);
    const popover = usePopover({
        ...restOptions,
        skin: theme || skin,
        open: shown ?? open,
        appendTo,
        onMouseEnter,
        onMouseLeave,
        dataHook,
        rootRef,
    });
    useEffect(() => {
        if (theme) {
            deprecationLog('<PopoverNext /> - `theme` prop is deprecated and will be removed in next major version, please use `skin` instead');
        }
        if (shown !== undefined) {
            deprecationLog('<PopoverNext /> - `shown` prop is deprecated and will be removed in next major version, please use `open` instead');
        }
    }, [theme, shown]);
    return (React.createElement(PopoverNextContext.Provider, { value: popover },
        React.createElement("div", { ref: rootRef, "data-hook": dataHook, "data-popover-root": true, "data-list-type": dataListType, className: st(classes.root, { fluid }, className), onKeyDown: onKeyDown }, children)));
}
PopoverNext.displayName = 'PopoverNext';
PopoverNext.propTypes = {
    dataHook: PropTypes.string,
    className: PropTypes.string,
    children: PropTypes.node,
    open: PropTypes.bool,
    onOpenChange: PropTypes.func.isRequired,
    focusManagerEnabled: PropTypes.bool,
    appendTo: PropTypes.oneOfType([
        PropTypes.oneOf(Object.values(APPEND_TO)),
        PropTypes.func,
    ]),
    dynamicWidth: PropTypes.bool,
    width: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
    minWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
    maxWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
    zIndex: PropTypes.number,
    excludeClass: PropTypes.string,
    hideDelay: PropTypes.number,
    moveBy: PropTypes.shape({ x: PropTypes.number, y: PropTypes.number }),
    onMouseEnter: PropTypes.func,
    onMouseLeave: PropTypes.func,
    flip: PropTypes.bool,
    onKeyDown: PropTypes.func,
    placement: PropTypes.oneOf(placements),
    fixed: PropTypes.bool,
    showDelay: PropTypes.number,
    timeout: PropTypes.oneOfType([
        PropTypes.number,
        PropTypes.shape({ enter: PropTypes.number, exit: PropTypes.number }),
    ]),
    role: PropTypes.string,
    tabIndex: PropTypes.number,
    ['aria-label']: PropTypes.string,
    ['aria-labelledby']: PropTypes.string,
    ['aria-describedby']: PropTypes.string,
    style: PropTypes.object,
    id: PropTypes.string,
    transitionSettings: PropTypes.any,
    fluid: PropTypes.bool,
    animate: PropTypes.bool,
    onShow: PropTypes.func,
    onHide: PropTypes.func,
    showArrow: PropTypes.bool,
    onEscPress: PropTypes.func,
    interactive: PropTypes.bool,
    contentClassName: PropTypes.string,
    customArrow: PropTypes.func,
};
PopoverNext.Trigger = Trigger;
PopoverNext.Content = Content;
export default PopoverNext;
//# sourceMappingURL=PopoverNext.js.map