@razorpay/blade
Version:
The Design System that powers Razorpay
21 lines (18 loc) • 2.26 kB
JavaScript
import React__default from 'react';
import { PopoverContentWrapper } from './PopoverContentWrapper.native.js';
import { PopoverCloseButton } from './PopoverCloseButton.js';
import { usePopoverContext } from './PopoverContext.js';
import { BaseBox } from '../Box/BaseBox/BaseBox.native.js';
import '../Typography/Heading/Heading.js';
import { Text } from '../Typography/Text/Text.js';
import '../Typography/Code/Code.js';
import '../Typography/Display/Display.js';
import 'react-native';
import '@babel/runtime/helpers/slicedToArray';
import { isReactNative } from '../../utils/platform/isReactNative.js';
import '../BladeProvider/useTheme.js';
import { useIsMobile } from '../../utils/useIsMobile.js';
import { jsxs, jsx } from 'react/jsx-runtime';
var PopoverHeader=function PopoverHeader(_ref){var title=_ref.title,titleLeading=_ref.titleLeading;var _usePopoverContext=usePopoverContext(),titleId=_usePopoverContext.titleId;var isFloating=!(title||titleLeading);if(isFloating){return jsx(BaseBox,{borderRadius:"max",position:"absolute",padding:"spacing.2",top:"spacing.2",right:"spacing.2",zIndex:1,children:jsx(PopoverCloseButton,{})});}return jsxs(BaseBox,{display:"flex",flexDirection:"row",flexWrap:isReactNative()?'wrap':'nowrap',alignItems:"center",gap:"spacing.3",children:[titleLeading?React__default.cloneElement(titleLeading,{size:'large'}):null,title?jsx(BaseBox,{id:titleId,paddingRight:"spacing.4",children:jsx(Text,{size:"large",weight:"semibold",children:title})}):null,jsx(BaseBox,{marginLeft:"auto",children:jsx(PopoverCloseButton,{})})]});};var PopoverContent=React__default.forwardRef(function(_ref2,ref){var children=_ref2.children,title=_ref2.title,titleLeading=_ref2.titleLeading,footer=_ref2.footer,arrow=_ref2.arrow,side=_ref2.side,style=_ref2.style,isVisible=_ref2.isVisible;var isMobile=useIsMobile();return jsxs(PopoverContentWrapper,{ref:ref,styles:style,side:side,isVisible:isVisible,isMobile:isMobile,children:[jsxs(BaseBox,{padding:"spacing.4",display:"flex",flexDirection:"column",gap:"spacing.4",children:[jsx(PopoverHeader,{title:title,titleLeading:titleLeading}),jsx(BaseBox,{children:children}),footer?jsx(BaseBox,{children:footer}):null]}),arrow]});});
export { PopoverContent };
//# sourceMappingURL=PopoverContent.js.map