UNPKG

@razorpay/blade

Version:

The Design System that powers Razorpay

27 lines (24 loc) 2.82 kB
import React__default from 'react'; import { PopoverContentWrapper } from './PopoverContentWrapper.native.js'; import { PopoverCloseButton } from './PopoverCloseButton.js'; import { usePopoverContext } from './PopoverContext.js'; import 'react-native'; import '@babel/runtime/helpers/slicedToArray'; import { isReactNative } from '../../utils/platform/isReactNative.js'; import '../../tokens/global/typography.js'; import '../../tokens/global/motion.js'; import useTheme from '../BladeProvider/useTheme.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 { useIsMobile } from '../../utils/useIsMobile.js'; import 'styled-components/native'; import '@gorhom/portal'; import 'react-native-gesture-handler'; import '../BottomSheet/BottomSheetStack.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,openInteraction=_usePopoverContext.openInteraction;var showCloseButton=openInteraction==='click';var isFloating=!(title||titleLeading);if(isFloating){if(!showCloseButton){return null;}return jsx(BaseBox,{borderRadius:"max",position:"absolute",padding:"spacing.2",top:"spacing.3",right:"spacing.3",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:'medium'}):null,title?jsx(BaseBox,{id:titleId,paddingRight:"spacing.4",children:jsx(Text,{size:"large",weight:"semibold",children:title})}):null,showCloseButton?jsx(BaseBox,{marginLeft:"auto",children:jsx(PopoverCloseButton,{})}):null]});};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();var _useTheme=useTheme(),colorScheme=_useTheme.colorScheme;return jsxs(PopoverContentWrapper,{ref:ref,styles:style,side:side,isVisible:isVisible,isMobile:isMobile,colorScheme:colorScheme,children:[jsxs(BaseBox,{padding:"spacing.5",display:"flex",flexDirection:"column",gap:"spacing.5",children:[jsxs(BaseBox,{display:"flex",flexDirection:"column",gap:"spacing.2",children:[jsx(PopoverHeader,{title:title,titleLeading:titleLeading}),jsx(BaseBox,{children:children})]}),footer?jsx(BaseBox,{children:footer}):null]}),arrow]});}); export { PopoverContent }; //# sourceMappingURL=PopoverContent.js.map