UNPKG

@kubit-ui-web/react-components

Version:

Kubit React Components is a customizable, accessible library of React web components, designed to enhance your application's user experience

23 lines 2.22 kB
"use strict"; var __importDefault = (this && this.__importDefault) || function (mod) { return (mod && mod.__esModule) ? mod : { "default": mod }; }; Object.defineProperty(exports, "__esModule", { value: true }); exports.PopoverStandAlone = void 0; const jsx_runtime_1 = require("react/jsx-runtime"); const react_1 = __importDefault(require("react")); const aria_1 = require("../../utils/aria/aria"); const cssAnimation_1 = require("../cssAnimation/cssAnimation"); const overlay_1 = require("../overlay/overlay"); const popover_styled_1 = require("./popover.styled"); const PopoverStandAloneComponent = ({ children, animationExecution, animationConfig, dataTestId = 'popover', ...props }, ref) => { const ariaProps = (0, aria_1.pickAriaProps)(props); if (props.open) { return ((0, jsx_runtime_1.jsxs)("div", { ref: ref, children: [props.hasBackDrop && (0, jsx_runtime_1.jsx)(overlay_1.Overlay, { variant: props.styles[props.device]?.overlay }), (0, jsx_runtime_1.jsx)(popover_styled_1.PopoverAnimationStyled, { ref: props.forwardedRef, as: animationConfig ? cssAnimation_1.CssAnimation : 'div', "data-testid": dataTestId, exec: animationExecution, id: props.id, options: animationConfig?.animationOptions, variant: animationConfig?.animation, children: (0, jsx_runtime_1.jsx)(popover_styled_1.PopoverStyled // Allow to identificate the element , { "data-popover": true, ...ariaProps, align: props.align, as: props.component, autoWidth: props?.autoWidth, bottom: props?.bottom, device: props.device, extraAlignGap: props.extraAlignGap, extraWidth: props.extraWidth || props.styles?.[props.device]?.extraWidth, extraWidthSide: props.extraWidthSide || props.styles?.[props.device]?.extraWidthSide, left: props?.left, open: props.open, positionVariant: props.positionVariant, right: props?.right, role: props.role, tabIndex: props.tabIndex, top: props?.top, onKeyDown: props.onKeyDown, ...props.styles, children: children }) })] })); } return (0, jsx_runtime_1.jsx)(popover_styled_1.PopoverAnimationStyled, { id: props.id }); }; exports.PopoverStandAlone = react_1.default.forwardRef(PopoverStandAloneComponent); //# sourceMappingURL=popoverStandAlone.js.map