@laerdal/life-react-components 6.1.1-dev.1.full → 6.1.2-dev.1.full
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/Popover/Popover.cjs
CHANGED
|
@@ -18,7 +18,8 @@ function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return
|
|
|
18
18
|
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
|
|
19
19
|
const PopoverContainer = exports.PopoverContainer = _styledComponents.default.div`
|
|
20
20
|
//height: ${props => props.$size === _types.Size.Small ? '240px' : props.$size === _types.Size.Large ? '480px' : '360px'};
|
|
21
|
-
min-width: ${props
|
|
21
|
+
${props => props.$size && `min-width: ${props.$size === _types.Size.Small ? '320px' : props.$size === _types.Size.Large ? '640px' : '480px'};`}
|
|
22
|
+
width: ${props => !props.$size ? 'fit-content' : 'auto'};
|
|
22
23
|
border-radius: 4px;
|
|
23
24
|
background: ${props => _.COLORS.generateToken({
|
|
24
25
|
componentType: 'bg-surface',
|
|
@@ -40,20 +41,22 @@ const PopoverContainer = exports.PopoverContainer = _styledComponents.default.di
|
|
|
40
41
|
|
|
41
42
|
&::after {
|
|
42
43
|
${props => props.$showArrowPointer ? renderArrowStyles(props.$position) : ''}
|
|
44
|
+
}
|
|
43
45
|
`;
|
|
44
46
|
const PopoverTopSectionContainer = exports.PopoverTopSectionContainer = _styledComponents.default.div`
|
|
45
|
-
|
|
47
|
+
${props => props.$size && `height: ${props.$size === _types.Size.Small ? '56px' : props.$size === _types.Size.Large ? '72px' : '64px'};`}
|
|
46
48
|
display: flex;
|
|
47
49
|
`;
|
|
48
50
|
const PopoverMiddleSectionContainer = exports.PopoverMiddleSectionContainer = _styledComponents.default.div`
|
|
49
51
|
margin: 8px;
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
${
|
|
52
|
+
${props => props.$size && `height: ${props.$size === _types.Size.Small ? '104px' : props.$size === _types.Size.Large ? '304px' : '208px'};`}
|
|
53
|
+
${props => props.$size && `padding: ${props.$size === _types.Size.Small ? '0 8px' : props.$size === _types.Size.Large ? '0 16px' : '0 12px'};`}
|
|
54
|
+
${props => !props.$size && `padding: 8px;`}
|
|
55
|
+
${props => props.$size && 'overflow-y: auto;'}
|
|
56
|
+
${props => props.$size && (0, _styles.scrollBarStyling)(_types.Size.Small)}
|
|
54
57
|
`;
|
|
55
58
|
const PopoverBottomSectionContainer = exports.PopoverBottomSectionContainer = _styledComponents.default.div`
|
|
56
|
-
|
|
59
|
+
${props => props.$size && `height: ${props.$size === _types.Size.Small ? '64px' : props.$size === _types.Size.Large ? '88px' : '72px'};`}
|
|
57
60
|
display: flex;
|
|
58
61
|
|
|
59
62
|
.bottom-flex {
|
|
@@ -67,11 +70,15 @@ const TextContainer = _styledComponents.default.div`
|
|
|
67
70
|
componentType: 'text',
|
|
68
71
|
defaultVariant: 'default'
|
|
69
72
|
}, props.theme)};
|
|
70
|
-
|
|
73
|
+
${props => props.$size && `margin: ${renderMargins(props.$note, props.$size)};`}
|
|
74
|
+
${props => !props.$size && `margin: 8px;`}
|
|
71
75
|
flex-grow: 1;
|
|
72
76
|
`;
|
|
73
77
|
const NoteContainer = _styledComponents.default.div`
|
|
74
|
-
${props => props.$size
|
|
78
|
+
${props => !props.$size ? (0, _.ComponentXSStyling)(_.ComponentTextStyle.Regular, _.COLORS.generateToken({
|
|
79
|
+
componentType: 'text',
|
|
80
|
+
defaultVariant: 'subtle'
|
|
81
|
+
}, props.theme)) : props.$size === _types.Size.Small ? (0, _styles.ComponentXXSStyling)(_.ComponentTextStyle.Regular, _.COLORS.generateToken({
|
|
75
82
|
componentType: 'text',
|
|
76
83
|
defaultVariant: 'subtle'
|
|
77
84
|
}, props.theme)) : props.$size === _types.Size.Large ? (0, _styles.ComponentSStyling)(_.ComponentTextStyle.Regular, _.COLORS.generateToken({
|
|
@@ -83,16 +90,19 @@ const NoteContainer = _styledComponents.default.div`
|
|
|
83
90
|
}, props.theme))}
|
|
84
91
|
`;
|
|
85
92
|
const LabelContainer = _styledComponents.default.div`
|
|
86
|
-
${props => props.$size === _types.Size.Small ? (0, _styles.ComponentSStyling)(_.ComponentTextStyle.Bold, null) : props.$size === _types.Size.Large ? (0, _styles.ComponentLStyling)(_.ComponentTextStyle.Bold, null) : (0, _styles.ComponentMStyling)(_.ComponentTextStyle.Bold, null)}
|
|
93
|
+
${props => !props.$size ? (0, _styles.ComponentMStyling)(_.ComponentTextStyle.Bold, null) : props.$size === _types.Size.Small ? (0, _styles.ComponentSStyling)(_.ComponentTextStyle.Bold, null) : props.$size === _types.Size.Large ? (0, _styles.ComponentLStyling)(_.ComponentTextStyle.Bold, null) : (0, _styles.ComponentMStyling)(_.ComponentTextStyle.Bold, null)}
|
|
87
94
|
`;
|
|
88
95
|
const CloseButtonContainer = _styledComponents.default.div`
|
|
89
|
-
|
|
96
|
+
${props => props.$size && `margin: ${props.$size === _types.Size.Small ? '4px 16px 4px 0' : props.$size === _types.Size.Large ? '12px 24px 12px 0' : '8px 20px 8px 0'};`}
|
|
97
|
+
${props => !props.$size && `margin: 8px;`}
|
|
90
98
|
`;
|
|
91
99
|
const TextButtonContainer = _styledComponents.default.div`
|
|
92
|
-
|
|
100
|
+
${props => props.$size && `margin: ${props.$size === _types.Size.Small ? '8px 0 8px 16px' : props.$size === _types.Size.Large ? '16px 0 16px 24px' : '12px 0 12px 20px'};`}
|
|
101
|
+
${props => !props.$size && `margin: 8px;`}
|
|
93
102
|
`;
|
|
94
103
|
const IconButtonContainer = _styledComponents.default.div`
|
|
95
|
-
|
|
104
|
+
${props => props.$size && `margin: ${props.$size === _types.Size.Small ? '8px 16px 8px 0' : props.$size === _types.Size.Large ? '16px 24px 16px 0' : '12px 20px 12px 0'};`}
|
|
105
|
+
${props => !props.$size && `margin: 8px;`}
|
|
96
106
|
display: flex;
|
|
97
107
|
`;
|
|
98
108
|
const PopoverWrapper = exports.PopoverWrapper = _styledComponents.default.div`
|
|
@@ -122,6 +132,9 @@ const PopoverWrapper = exports.PopoverWrapper = _styledComponents.default.div`
|
|
|
122
132
|
}`}
|
|
123
133
|
`;
|
|
124
134
|
const renderMargins = (isNotePresent, size) => {
|
|
135
|
+
if (!size) {
|
|
136
|
+
return isNotePresent ? '8px' : '12px 8px';
|
|
137
|
+
}
|
|
125
138
|
if (isNotePresent) {
|
|
126
139
|
return size === _types.Size.Small ? '10px 16px' : size === _types.Size.Large ? '14px 24px' : '12px 20px';
|
|
127
140
|
} else {
|
|
@@ -184,7 +197,7 @@ const renderArrowStyles = position => {
|
|
|
184
197
|
;
|
|
185
198
|
const Popover = _ref => {
|
|
186
199
|
let {
|
|
187
|
-
size
|
|
200
|
+
size,
|
|
188
201
|
topSectionProps,
|
|
189
202
|
bottomSectionProps,
|
|
190
203
|
mainContent,
|
|
@@ -196,9 +209,10 @@ const Popover = _ref => {
|
|
|
196
209
|
const [showPopover, setShowPopover] = React.useState(false);
|
|
197
210
|
const theme = (0, _styledComponents.useTheme)();
|
|
198
211
|
const popoverRef = React.useRef(null);
|
|
212
|
+
const wrapperRef = React.useRef(null);
|
|
199
213
|
React.useEffect(() => {
|
|
200
214
|
const checkIfClickedOutside = e => {
|
|
201
|
-
if (showPopover && popoverRef.current && !popoverRef.current.contains(e.target)) {
|
|
215
|
+
if (showPopover && popoverRef.current && !popoverRef.current.contains(e.target) && wrapperRef.current && !wrapperRef.current.contains(e.target)) {
|
|
202
216
|
setShowPopover(false);
|
|
203
217
|
}
|
|
204
218
|
};
|
|
@@ -207,6 +221,12 @@ const Popover = _ref => {
|
|
|
207
221
|
document.removeEventListener('mousedown', checkIfClickedOutside);
|
|
208
222
|
};
|
|
209
223
|
}, [showPopover]);
|
|
224
|
+
const handleWrapperClick = e => {
|
|
225
|
+
if (showOnClick) {
|
|
226
|
+
e.stopPropagation();
|
|
227
|
+
setShowPopover(!showPopover);
|
|
228
|
+
}
|
|
229
|
+
};
|
|
210
230
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(PopoverWrapper, {
|
|
211
231
|
$position: position,
|
|
212
232
|
$showOnClick: showOnClick,
|
|
@@ -273,7 +293,8 @@ const Popover = _ref => {
|
|
|
273
293
|
})]
|
|
274
294
|
})]
|
|
275
295
|
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
276
|
-
|
|
296
|
+
ref: wrapperRef,
|
|
297
|
+
onClick: handleWrapperClick,
|
|
277
298
|
children: [children, /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
278
299
|
className: "pointer-space"
|
|
279
300
|
})]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Popover.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_","_Button","_icons","_styles","_types","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","PopoverContainer","exports","styled","div","props","$size","Size","Small","Large","COLORS","generateToken","componentType","defaultVariant","theme","BOXSHADOWS","BOXSHADOW_CENTERED","Z_INDEXES","popover","$position","Position","Bottom","Top","Left","Right","$showArrowPointer","renderArrowStyles","PopoverTopSectionContainer","PopoverMiddleSectionContainer","scrollBarStyling","PopoverBottomSectionContainer","TextContainer","renderMargins","$note","NoteContainer","ComponentXXSStyling","ComponentTextStyle","Regular","ComponentSStyling","ComponentXSStyling","LabelContainer","Bold","ComponentLStyling","ComponentMStyling","CloseButtonContainer","TextButtonContainer","IconButtonContainer","PopoverWrapper","$showOnClick","$showPopover","isNotePresent","size","position","Popover","_ref","Medium","topSectionProps","bottomSectionProps","mainContent","children","showOnClick","showArrowPointer","showPopover","setShowPopover","useState","useTheme","popoverRef","useRef","useEffect","checkIfClickedOutside","current","contains","target","document","addEventListener","removeEventListener","jsxs","ref","note","jsx","text","IconButton","action","useTransparentBackground","iconColor","variant","shape","SystemIcons","Close","textButton","icon","TextButton","onClick","label","className","iconButtons","map","iconButton","propTypes","_propTypes","string","isRequired","arrayOf","node","func","bool","_default"],"sources":["../../src/Popover/Popover.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled, { useTheme } from 'styled-components';\r\nimport { COLORS, ComponentTextStyle, ComponentXSStyling } from '..';\r\nimport { TextButton, IconButton } from '../Button';\r\nimport { SystemIcons } from '../icons';\r\nimport { BOXSHADOWS, ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentXXSStyling, scrollBarStyling, Z_INDEXES } from '../styles';\r\nimport { Position, Size } from '../types';\r\n\r\nexport const PopoverContainer = styled.div<{ $size: Size; $position: Position; $showArrowPointer: boolean }>`\r\n //height: ${(props) => (props.$size === Size.Small ? '240px' : props.$size === Size.Large ? '480px' : '360px')};\r\n min-width: ${(props) => (props.$size === Size.Small ? '320px' : props.$size === Size.Large ? '640px' : '480px')};\r\n border-radius: 4px;\r\n background: ${props => COLORS.generateToken({ componentType: 'bg-surface', defaultVariant: 'high' }, props.theme)};\r\n cursor: default;\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\r\n\r\n position: absolute; \r\n visibility: hidden;\r\n opacity: 0;\r\n z-index: ${Z_INDEXES.popover};\r\n\r\n ${(props) => (props.$position == Position.Bottom ? 'right: 50%; top: calc(100% + 16px); transform: translateX(50%);' : '')}\r\n ${(props) => (props.$position == Position.Top ? 'right: 50%; bottom: calc(100% + 16px); transform: translateX(50%);' : '')}\r\n\r\n ${(props) => (props.$position == Position.Left ? 'bottom: 50%; right: calc(100% + 16px); transform: translateY(50%);' : '')}\r\n ${(props) => (props.$position == Position.Right ? 'bottom: 50%; left: calc(100% + 16px); transform: translateY(50%);' : '')}\r\n\r\n &::after {\r\n ${(props) => (props.$showArrowPointer ? renderArrowStyles(props.$position) : '')}\r\n`;\r\n\r\nexport const PopoverTopSectionContainer = styled.div<{ $size: Size }>`\r\n height: ${(props) => (props.$size === Size.Small ? '56px' : props.$size === Size.Large ? '72px' : '64px')};\r\n display: flex;\r\n`;\r\n\r\nexport const PopoverMiddleSectionContainer = styled.div<{ $size: Size }>`\r\n margin: 8px;\r\n height: ${(props) => (props.$size === Size.Small ? '104px' : props.$size === Size.Large ? '304px' : '208px')};\r\n padding: ${(props) => (props.$size === Size.Small ? '0 8px' : props.$size === Size.Large ? '0 16px' : '0 12px')};\r\n overflow-y: auto;\r\n ${scrollBarStyling(Size.Small)}\r\n`;\r\n\r\nexport const PopoverBottomSectionContainer = styled.div<{ $size: Size }>`\r\n height: ${(props) => (props.$size === Size.Small ? '64px' : props.$size === Size.Large ? '88px' : '72px')}; \r\n display: flex;\r\n\r\n .bottom-flex {\r\n flex: 1;\r\n }\r\n`;\r\n\r\nconst TextContainer = styled.div<{ $note: boolean; $size: Size }>`\r\n display: flex;\r\n flex-direction: column;\r\n color: ${props => COLORS.generateToken({ componentType: 'text', defaultVariant: 'default' }, props.theme)};\r\n margin: ${(props) => renderMargins(props.$note, props.$size)};\r\n flex-grow: 1;\r\n`;\r\n\r\nconst NoteContainer = styled.div<{ $size: Size }>`\r\n ${(props) =>\r\n props.$size === Size.Small\r\n ? ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.generateToken({ componentType: 'text', defaultVariant: 'subtle' }, props.theme))\r\n : props.$size === Size.Large\r\n ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.generateToken({ componentType: 'text', defaultVariant: 'subtle' }, props.theme))\r\n : ComponentXSStyling(ComponentTextStyle.Regular, COLORS.generateToken({ componentType: 'text', defaultVariant: 'subtle' }, props.theme))}\r\n`;\r\n\r\nconst LabelContainer = styled.div<{ $size: Size }>`\r\n ${(props) =>\r\n props.$size === Size.Small\r\n ? ComponentSStyling(ComponentTextStyle.Bold, null)\r\n : props.$size === Size.Large\r\n ? ComponentLStyling(ComponentTextStyle.Bold, null)\r\n : ComponentMStyling(ComponentTextStyle.Bold, null)}\r\n`;\r\n\r\nconst CloseButtonContainer = styled.div<{ $size: Size }>`\r\n margin: ${(props) => (props.$size === Size.Small ? '4px 16px 4px 0' : props.$size === Size.Large ? '12px 24px 12px 0' : '8px 20px 8px 0')};\r\n`;\r\n\r\nconst TextButtonContainer = styled.div<{ $size: Size }>`\r\n margin: ${(props) => (props.$size === Size.Small ? '8px 0 8px 16px' : props.$size === Size.Large ? '16px 0 16px 24px' : '12px 0 12px 20px')};\r\n`;\r\n\r\nconst IconButtonContainer = styled.div<{ $size: Size }>`\r\n margin: ${(props) => (props.$size === Size.Small ? '8px 16px 8px 0' : props.$size === Size.Large ? '16px 24px 16px 0' : '12px 20px 12px 0')};\r\n display: flex;\r\n`;\r\n\r\nexport const PopoverWrapper = styled.div<{ $position: Position; $showOnClick: boolean; $showPopover: boolean }>`\r\n position: relative;\r\n\r\n .pointer-space {\r\n height: ${(props) => (props.$position === Position.Top || props.$position === Position.Bottom ? '16px' : '100%')};\r\n width: ${(props) => (props.$position === Position.Left || props.$position === Position.Right ? '16px' : '100%')};\r\n position: absolute;\r\n\r\n ${(props) => (props.$position === Position.Left ? 'right:100%; bottom: 0%' : '')};\r\n ${(props) => (props.$position === Position.Right ? 'left:100%; bottom: 0%' : '')};\r\n\r\n ${(props) => (props.$position === Position.Top ? 'bottom: 100%' : '')};\r\n ${(props) => (props.$position === Position.Bottom ? 'top: 100%' : '')};\r\n }\r\n\r\n ${(props) =>\r\n props.$showOnClick\r\n ? `${PopoverContainer} {\r\n visibility: ${props.$showPopover ? 'visible' : 'hidden'};\r\n opacity: ${props.$showPopover ? '1' : '0'};\r\n }\r\n cursor: pointer;`\r\n : `&:hover {\r\n ${PopoverContainer} {\r\n visibility: visible;\r\n opacity: 1;\r\n }\r\n }`}\r\n`;\r\n\r\nconst renderMargins = (isNotePresent: boolean, size: Size): string => {\r\n if (isNotePresent) {\r\n return size === Size.Small ? '10px 16px' : size === Size.Large ? '14px 24px' : '12px 20px';\r\n } else {\r\n return size === Size.Small ? '18px 16px' : size === Size.Large ? '24px' : '20px';\r\n }\r\n};\r\n\r\nconst renderArrowStyles = (position: Position) => {\r\n if (position === Position.Bottom) {\r\n return `height: 0px;\r\n width: 0px;\r\n border-top: 16px solid transparent;\r\n border-right: 12px solid transparent;\r\n border-bottom: 16px solid rgb(255,255,255);\r\n border-left: 12px solid transparent;\r\n content: \"\";\r\n position: absolute;\r\n right: calc(50% - 12px);\r\n bottom: calc(100% - 1px);`;\r\n }\r\n\r\n if (position === Position.Top) {\r\n return `height: 0px;\r\n width: 0px;\r\n border-top: 16px solid rgb(255,255,255);\r\n border-right: 12px solid transparent;\r\n border-bottom: 16px solid transparent;\r\n border-left: 12px solid transparent;\r\n content: \"\";\r\n position: absolute;\r\n right: calc(50% - 12px);\r\n top: calc(100% - 1px);`;\r\n }\r\n\r\n if (position === Position.Left) {\r\n return `height: 0px;\r\n width: 0px;\r\n border-top: 12px solid transparent;\r\n border-right: 16px solid transparent;\r\n border-bottom: 12px solid transparent;\r\n border-left: 16px solid rgb(255,255,255);\r\n content: \"\";\r\n position: absolute;\r\n left: calc(100% - 1px);\r\n bottom: calc(50% - 12px);`;\r\n }\r\n\r\n if (position === Position.Right) {\r\n return `height: 0px;\r\n width: 0px;\r\n border-top: 12px solid transparent;\r\n border-right: 16px solid rgb(255,255,255);\r\n border-bottom: 12px solid transparent;\r\n border-left: 16px solid transparent;\r\n content: \"\";\r\n position: absolute;\r\n right: calc(100% - 1px);\r\n bottom: calc(50% - 12px);`;\r\n }\r\n};\r\n\r\nexport interface PopoverTopSectionProps {\r\n /**\r\n * Required. The main text to be displayed in the top section of the popover.\r\n */\r\n text: string;\r\n\r\n /**\r\n * Optional. A note to be displayed below the main text in the top section of the popover.\r\n */\r\n note?: string;\r\n};\r\n\r\nexport interface PopoverActionButtonProps {\r\n /**\r\n * Required. The icon to be displayed on the button.\r\n */\r\n icon: React.ReactNode;\r\n\r\n /**\r\n * Required. The handler function to be called when the button is clicked.\r\n */\r\n action: () => void;\r\n\r\n /**\r\n * Optional. The label for the button. If provided, the button will display this text.\r\n */\r\n label?: string;\r\n};\r\n\r\nexport interface PopoverBottomSectionProps {\r\n /**\r\n * Optional. An array of PopoverActionButtonProps objects.\r\n * Each object represents an icon button to be displayed in the bottom section of the popover.\r\n */\r\n iconButtons?: PopoverActionButtonProps[];\r\n\r\n /**\r\n * Optional. A PopoverActionButtonProps object representing a text button to be displayed in the bottom section of the popover.\r\n */\r\n textButton?: PopoverActionButtonProps;\r\n};\r\n\r\nexport interface PopoverProps {\r\n /**\r\n * Optional. The size of the popover. It can be 'Small', 'Medium', or 'Large'.\r\n * Defaults to 'Medium' if not specified.\r\n */\r\n size?: Size.Small | Size.Medium | Size.Large;\r\n\r\n /**\r\n * Optional. Properties for the top section of the popover.\r\n */\r\n topSectionProps?: PopoverTopSectionProps;\r\n\r\n /**\r\n * Optional. Properties for the bottom section of the popover.\r\n */\r\n bottomSectionProps?: PopoverBottomSectionProps;\r\n\r\n /**\r\n * Required. The main content to be displayed in the popover.\r\n */\r\n mainContent: React.ReactNode;\r\n\r\n /**\r\n * Required. The children to be rendered inside the popover.\r\n */\r\n children: React.ReactNode;\r\n\r\n /**\r\n * Required. The position of the popover relative to the target element.\r\n * It can be 'Top', 'Bottom', 'Right', or 'Left'.\r\n */\r\n position: Position.Top | Position.Bottom | Position.Right | Position.Left;\r\n\r\n /**\r\n * Required. A boolean indicating whether the popover should be shown when the target element is clicked. Defaults to 'false', meaning that popover will be shown on mouse hover.\r\n */\r\n showOnClick: boolean;\r\n\r\n /**\r\n * Optional. A boolean indicating whether an arrow pointer should be shown on the popover.\r\n * Defaults to 'false' if not specified.\r\n */\r\n showArrowPointer?: boolean;\r\n};\r\n\r\nconst Popover: React.FunctionComponent<PopoverProps> = ({\r\n size = Size.Medium,\r\n topSectionProps,\r\n bottomSectionProps,\r\n mainContent,\r\n children,\r\n position,\r\n showOnClick = false,\r\n showArrowPointer = false,\r\n}) => {\r\n const [showPopover, setShowPopover] = React.useState(false);\r\n const theme = useTheme();\r\n const popoverRef = React.useRef<any>(null);\r\n\r\n React.useEffect(() => {\r\n const checkIfClickedOutside = (e: { target: any }) => {\r\n if (showPopover && popoverRef.current && !popoverRef.current.contains(e.target)) {\r\n setShowPopover(false);\r\n }\r\n };\r\n\r\n document.addEventListener('mousedown', checkIfClickedOutside);\r\n\r\n return () => {\r\n document.removeEventListener('mousedown', checkIfClickedOutside);\r\n };\r\n }, [showPopover]);\r\n\r\n return (\r\n <PopoverWrapper $position={position} $showOnClick={showOnClick} $showPopover={showPopover}>\r\n <PopoverContainer $size={size} $position={position} ref={popoverRef} $showArrowPointer={showArrowPointer}>\r\n {!!topSectionProps && (\r\n <PopoverTopSectionContainer $size={size}>\r\n <TextContainer $note={!!topSectionProps?.note} $size={size}>\r\n {topSectionProps?.note && <NoteContainer $size={size}>{topSectionProps.note}</NoteContainer>}\r\n <LabelContainer $size={size}>{topSectionProps?.text}</LabelContainer>\r\n </TextContainer>\r\n\r\n {showOnClick && (\r\n <CloseButtonContainer $size={size} data-testid={'closeBtn'}>\r\n <IconButton action={() => setShowPopover(false)} useTransparentBackground \r\n iconColor={COLORS.generateToken({ componentType: 'icon', defaultVariant: 'subtle' }, theme)} variant=\"secondary\" shape=\"circular\">\r\n <SystemIcons.Close />\r\n </IconButton>\r\n </CloseButtonContainer>\r\n )}\r\n </PopoverTopSectionContainer>\r\n )}\r\n\r\n <PopoverMiddleSectionContainer $size={size}>{mainContent}</PopoverMiddleSectionContainer>\r\n\r\n {!!bottomSectionProps && (\r\n <PopoverBottomSectionContainer $size={size}>\r\n {!!bottomSectionProps?.textButton?.icon && (\r\n <TextButtonContainer $size={size} data-testid={'textBtn'}>\r\n <TextButton size={size} variant=\"secondary\" icon={bottomSectionProps.textButton.icon} onClick={bottomSectionProps.textButton.action}>\r\n {bottomSectionProps.textButton.label}\r\n </TextButton>\r\n </TextButtonContainer>\r\n )}\r\n\r\n <div className=\"bottom-flex\" />\r\n\r\n <IconButtonContainer $size={size} data-testid={'iconBtn'}>\r\n {bottomSectionProps?.iconButtons?.map((iconButton) => (\r\n <IconButton action={iconButton.action} variant=\"secondary\" shape=\"circular\" useTransparentBackground>\r\n {iconButton.icon}\r\n </IconButton>\r\n ))}\r\n </IconButtonContainer>\r\n </PopoverBottomSectionContainer>\r\n )}\r\n </PopoverContainer>\r\n\r\n <div onClick={() => showOnClick && setShowPopover(!showPopover)}>\r\n {children}\r\n\r\n <div className=\"pointer-space\" />\r\n </div>\r\n </PopoverWrapper>\r\n );\r\n};\r\n\r\nexport default Popover;\r\n"],"mappings":";;;;;;;;AAAA,IAAAA,KAAA,GAAAC,uBAAA,CAAAC,OAAA;AACA,IAAAC,iBAAA,GAAAF,uBAAA,CAAAC,OAAA;AACA,IAAAE,CAAA,GAAAF,OAAA;AACA,IAAAG,OAAA,GAAAH,OAAA;AACA,IAAAI,MAAA,GAAAJ,OAAA;AACA,IAAAK,OAAA,GAAAL,OAAA;AACA,IAAAM,MAAA,GAAAN,OAAA;AAA0C,IAAAO,WAAA,GAAAP,OAAA;AAAA,SAAAQ,yBAAAC,CAAA,6BAAAC,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAF,wBAAA,YAAAA,CAAAC,CAAA,WAAAA,CAAA,GAAAG,CAAA,GAAAD,CAAA,KAAAF,CAAA;AAAA,SAAAV,wBAAAU,CAAA,EAAAE,CAAA,SAAAA,CAAA,IAAAF,CAAA,IAAAA,CAAA,CAAAI,UAAA,SAAAJ,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAK,OAAA,EAAAL,CAAA,QAAAG,CAAA,GAAAJ,wBAAA,CAAAG,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAG,GAAA,CAAAN,CAAA,UAAAG,CAAA,CAAAI,GAAA,CAAAP,CAAA,OAAAQ,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAd,CAAA,oBAAAc,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAhB,CAAA,EAAAc,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAb,CAAA,EAAAc,CAAA,UAAAG,CAAA,KAAAA,CAAA,CAAAV,GAAA,IAAAU,CAAA,CAAAC,GAAA,IAAAP,MAAA,CAAAC,cAAA,CAAAJ,CAAA,EAAAM,CAAA,EAAAG,CAAA,IAAAT,CAAA,CAAAM,CAAA,IAAAd,CAAA,CAAAc,CAAA,YAAAN,CAAA,CAAAH,OAAA,GAAAL,CAAA,EAAAG,CAAA,IAAAA,CAAA,CAAAe,GAAA,CAAAlB,CAAA,EAAAQ,CAAA,GAAAA,CAAA;AAEnC,MAAMW,gBAAgB,GAAAC,OAAA,CAAAD,gBAAA,GAAGE,yBAAM,CAACC,GAAqE;AAC5G,cAAeC,KAAK,IAAMA,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACC,KAAK,GAAG,OAAO,GAAGH,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACE,KAAK,GAAG,OAAO,GAAG,OAAQ;AAChH,eAAgBJ,KAAK,IAAMA,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACC,KAAK,GAAG,OAAO,GAAGH,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACE,KAAK,GAAG,OAAO,GAAG,OAAQ;AACjH;AACA,gBAAgBJ,KAAK,IAAIK,QAAM,CAACC,aAAa,CAAC;EAAEC,aAAa,EAAE,YAAY;EAAEC,cAAc,EAAE;AAAO,CAAC,EAAER,KAAK,CAACS,KAAK,CAAC;AACnH;AACA,gBAAgBC,kBAAU,CAACC,kBAAkB;AAC7C;AACA;AACA;AACA;AACA,aAAaC,iBAAS,CAACC,OAAO;AAC9B;AACA,IAAKb,KAAK,IAAMA,KAAK,CAACc,SAAS,IAAIC,eAAQ,CAACC,MAAM,GAAG,iEAAiE,GAAG,EAAG;AAC5H,IAAKhB,KAAK,IAAMA,KAAK,CAACc,SAAS,IAAIC,eAAQ,CAACE,GAAG,GAAG,oEAAoE,GAAG,EAAG;AAC5H;AACA,IAAKjB,KAAK,IAAMA,KAAK,CAACc,SAAS,IAAIC,eAAQ,CAACG,IAAI,GAAG,oEAAoE,GAAG,EAAG;AAC7H,IAAKlB,KAAK,IAAMA,KAAK,CAACc,SAAS,IAAIC,eAAQ,CAACI,KAAK,GAAG,mEAAmE,GAAG,EAAG;AAC7H;AACA;AACA,MAAOnB,KAAK,IAAMA,KAAK,CAACoB,iBAAiB,GAAGC,iBAAiB,CAACrB,KAAK,CAACc,SAAS,CAAC,GAAG,EAAG;AACpF,CAAC;AAEM,MAAMQ,0BAA0B,GAAAzB,OAAA,CAAAyB,0BAAA,GAAGxB,yBAAM,CAACC,GAAoB;AACrE,YAAaC,KAAK,IAAMA,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACC,KAAK,GAAG,MAAM,GAAGH,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACE,KAAK,GAAG,MAAM,GAAG,MAAO;AAC3G;AACA,CAAC;AAEM,MAAMmB,6BAA6B,GAAA1B,OAAA,CAAA0B,6BAAA,GAAGzB,yBAAM,CAACC,GAAoB;AACxE;AACA,YAAaC,KAAK,IAAMA,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACC,KAAK,GAAG,OAAO,GAAGH,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACE,KAAK,GAAG,OAAO,GAAG,OAAQ;AAC9G,aAAcJ,KAAK,IAAMA,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACC,KAAK,GAAG,OAAO,GAAGH,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACE,KAAK,GAAG,QAAQ,GAAG,QAAS;AACjH;AACA,IAAI,IAAAoB,wBAAgB,EAACtB,WAAI,CAACC,KAAK,CAAC;AAChC,CAAC;AAEM,MAAMsB,6BAA6B,GAAA5B,OAAA,CAAA4B,6BAAA,GAAG3B,yBAAM,CAACC,GAAoB;AACxE,YAAaC,KAAK,IAAMA,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACC,KAAK,GAAG,MAAM,GAAGH,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACE,KAAK,GAAG,MAAM,GAAG,MAAO;AAC3G;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,MAAMsB,aAAa,GAAG5B,yBAAM,CAACC,GAAoC;AACjE;AACA;AACA,WAAWC,KAAK,IAAIK,QAAM,CAACC,aAAa,CAAC;EAAEC,aAAa,EAAE,MAAM;EAAEC,cAAc,EAAE;AAAU,CAAC,EAAER,KAAK,CAACS,KAAK,CAAC;AAC3G,YAAaT,KAAK,IAAK2B,aAAa,CAAC3B,KAAK,CAAC4B,KAAK,EAAE5B,KAAK,CAACC,KAAK,CAAC;AAC9D;AACA,CAAC;AAED,MAAM4B,aAAa,GAAG/B,yBAAM,CAACC,GAAoB;AACjD,IAAKC,KAAK,IACNA,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACC,KAAK,GACtB,IAAA2B,2BAAmB,EAACC,oBAAkB,CAACC,OAAO,EAAE3B,QAAM,CAACC,aAAa,CAAC;EAAEC,aAAa,EAAE,MAAM;EAAEC,cAAc,EAAE;AAAS,CAAC,EAAER,KAAK,CAACS,KAAK,CAAC,CAAC,GACvIT,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACE,KAAK,GAC1B,IAAA6B,yBAAiB,EAACF,oBAAkB,CAACC,OAAO,EAAE3B,QAAM,CAACC,aAAa,CAAC;EAAEC,aAAa,EAAE,MAAM;EAAEC,cAAc,EAAE;AAAS,CAAC,EAAER,KAAK,CAACS,KAAK,CAAC,CAAC,GACrI,IAAAyB,oBAAkB,EAACH,oBAAkB,CAACC,OAAO,EAAE3B,QAAM,CAACC,aAAa,CAAC;EAAEC,aAAa,EAAE,MAAM;EAAEC,cAAc,EAAE;AAAS,CAAC,EAAER,KAAK,CAACS,KAAK,CAAC,CAAC;AAC9I,CAAC;AAED,MAAM0B,cAAc,GAAGrC,yBAAM,CAACC,GAAoB;AAClD,IAAKC,KAAK,IACNA,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACC,KAAK,GACtB,IAAA8B,yBAAiB,EAACF,oBAAkB,CAACK,IAAI,EAAE,IAAI,CAAC,GAChDpC,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACE,KAAK,GAC1B,IAAAiC,yBAAiB,EAACN,oBAAkB,CAACK,IAAI,EAAE,IAAI,CAAC,GAChD,IAAAE,yBAAiB,EAACP,oBAAkB,CAACK,IAAI,EAAE,IAAI,CAAC;AACxD,CAAC;AAED,MAAMG,oBAAoB,GAAGzC,yBAAM,CAACC,GAAoB;AACxD,YAAaC,KAAK,IAAMA,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACC,KAAK,GAAG,gBAAgB,GAAGH,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACE,KAAK,GAAG,kBAAkB,GAAG,gBAAiB;AAC3I,CAAC;AAED,MAAMoC,mBAAmB,GAAG1C,yBAAM,CAACC,GAAoB;AACvD,YAAaC,KAAK,IAAMA,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACC,KAAK,GAAG,gBAAgB,GAAGH,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACE,KAAK,GAAG,kBAAkB,GAAG,kBAAmB;AAC7I,CAAC;AAED,MAAMqC,mBAAmB,GAAG3C,yBAAM,CAACC,GAAoB;AACvD,YAAaC,KAAK,IAAMA,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACC,KAAK,GAAG,gBAAgB,GAAGH,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACE,KAAK,GAAG,kBAAkB,GAAG,kBAAmB;AAC7I;AACA,CAAC;AAEM,MAAMsC,cAAc,GAAA7C,OAAA,CAAA6C,cAAA,GAAG5C,yBAAM,CAACC,GAA0E;AAC/G;AACA;AACA;AACA,cAAeC,KAAK,IAAMA,KAAK,CAACc,SAAS,KAAKC,eAAQ,CAACE,GAAG,IAAIjB,KAAK,CAACc,SAAS,KAAKC,eAAQ,CAACC,MAAM,GAAG,MAAM,GAAG,MAAO;AACpH,aAAchB,KAAK,IAAMA,KAAK,CAACc,SAAS,KAAKC,eAAQ,CAACG,IAAI,IAAIlB,KAAK,CAACc,SAAS,KAAKC,eAAQ,CAACI,KAAK,GAAG,MAAM,GAAG,MAAO;AACnH;AACA;AACA,MAAOnB,KAAK,IAAMA,KAAK,CAACc,SAAS,KAAKC,eAAQ,CAACG,IAAI,GAAG,wBAAwB,GAAG,EAAG;AACpF,MAAOlB,KAAK,IAAMA,KAAK,CAACc,SAAS,KAAKC,eAAQ,CAACI,KAAK,GAAG,uBAAuB,GAAG,EAAG;AACpF;AACA,MAAOnB,KAAK,IAAMA,KAAK,CAACc,SAAS,KAAKC,eAAQ,CAACE,GAAG,GAAG,cAAc,GAAG,EAAG;AACzE,MAAOjB,KAAK,IAAMA,KAAK,CAACc,SAAS,KAAKC,eAAQ,CAACC,MAAM,GAAG,WAAW,GAAG,EAAG;AACzE;AACA;AACA,IAAKhB,KAAK,IACNA,KAAK,CAAC2C,YAAY,GACd,GAAG/C,gBAAgB;AAC3B,sBAAsBI,KAAK,CAAC4C,YAAY,GAAG,SAAS,GAAG,QAAQ;AAC/D,mBAAmB5C,KAAK,CAAC4C,YAAY,GAAG,GAAG,GAAG,GAAG;AACjD;AACA,qBAAqB,GACb;AACR,QAAQhD,gBAAgB;AACxB;AACA;AACA;AACA,MAAM;AACN,CAAC;AAED,MAAM+B,aAAa,GAAGA,CAACkB,aAAsB,EAAEC,IAAU,KAAa;EACpE,IAAID,aAAa,EAAE;IACjB,OAAOC,IAAI,KAAK5C,WAAI,CAACC,KAAK,GAAG,WAAW,GAAG2C,IAAI,KAAK5C,WAAI,CAACE,KAAK,GAAG,WAAW,GAAG,WAAW;EAC5F,CAAC,MAAM;IACL,OAAO0C,IAAI,KAAK5C,WAAI,CAACC,KAAK,GAAG,WAAW,GAAG2C,IAAI,KAAK5C,WAAI,CAACE,KAAK,GAAG,MAAM,GAAG,MAAM;EAClF;AACF,CAAC;AAED,MAAMiB,iBAAiB,GAAI0B,QAAkB,IAAK;EAChD,IAAIA,QAAQ,KAAKhC,eAAQ,CAACC,MAAM,EAAE;IAChC,OAAO;AACX;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,sCAAsC;EACpC;EAEA,IAAI+B,QAAQ,KAAKhC,eAAQ,CAACE,GAAG,EAAE;IAC7B,OAAO;AACX;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,mCAAmC;EACjC;EAEA,IAAI8B,QAAQ,KAAKhC,eAAQ,CAACG,IAAI,EAAE;IAC9B,OAAO;AACX;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,sCAAsC;EACpC;EAEA,IAAI6B,QAAQ,KAAKhC,eAAQ,CAACI,KAAK,EAAE;IAC/B,OAAO;AACX;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,sCAAsC;EACpC;AACF,CAAC;AAYA;AAiBA;AAaA;AA6CA;AAED,MAAM6B,OAA8C,GAAGC,IAAA,IASjD;EAAA,IATkD;IACtDH,IAAI,GAAG5C,WAAI,CAACgD,MAAM;IAClBC,eAAe;IACfC,kBAAkB;IAClBC,WAAW;IACXC,QAAQ;IACRP,QAAQ;IACRQ,WAAW,GAAG,KAAK;IACnBC,gBAAgB,GAAG;EACrB,CAAC,GAAAP,IAAA;EACC,MAAM,CAACQ,WAAW,EAAEC,cAAc,CAAC,GAAG5F,KAAK,CAAC6F,QAAQ,CAAC,KAAK,CAAC;EAC3D,MAAMlD,KAAK,GAAG,IAAAmD,0BAAQ,EAAC,CAAC;EACxB,MAAMC,UAAU,GAAG/F,KAAK,CAACgG,MAAM,CAAM,IAAI,CAAC;EAE1ChG,KAAK,CAACiG,SAAS,CAAC,MAAM;IACpB,MAAMC,qBAAqB,GAAIvF,CAAkB,IAAK;MACpD,IAAIgF,WAAW,IAAII,UAAU,CAACI,OAAO,IAAI,CAACJ,UAAU,CAACI,OAAO,CAACC,QAAQ,CAACzF,CAAC,CAAC0F,MAAM,CAAC,EAAE;QAC/ET,cAAc,CAAC,KAAK,CAAC;MACvB;IACF,CAAC;IAEDU,QAAQ,CAACC,gBAAgB,CAAC,WAAW,EAAEL,qBAAqB,CAAC;IAE7D,OAAO,MAAM;MACXI,QAAQ,CAACE,mBAAmB,CAAC,WAAW,EAAEN,qBAAqB,CAAC;IAClE,CAAC;EACH,CAAC,EAAE,CAACP,WAAW,CAAC,CAAC;EAEjB,oBACE,IAAAlF,WAAA,CAAAgG,IAAA,EAAC7B,cAAc;IAAC5B,SAAS,EAAEiC,QAAS;IAACJ,YAAY,EAAEY,WAAY;IAACX,YAAY,EAAEa,WAAY;IAAAH,QAAA,gBACxF,IAAA/E,WAAA,CAAAgG,IAAA,EAAC3E,gBAAgB;MAACK,KAAK,EAAE6C,IAAK;MAAChC,SAAS,EAAEiC,QAAS;MAACyB,GAAG,EAAEX,UAAW;MAACzC,iBAAiB,EAAEoC,gBAAiB;MAAAF,QAAA,GACtG,CAAC,CAACH,eAAe,iBAChB,IAAA5E,WAAA,CAAAgG,IAAA,EAACjD,0BAA0B;QAACrB,KAAK,EAAE6C,IAAK;QAAAQ,QAAA,gBACtC,IAAA/E,WAAA,CAAAgG,IAAA,EAAC7C,aAAa;UAACE,KAAK,EAAE,CAAC,CAACuB,eAAe,EAAEsB,IAAK;UAACxE,KAAK,EAAE6C,IAAK;UAAAQ,QAAA,GACxDH,eAAe,EAAEsB,IAAI,iBAAI,IAAAlG,WAAA,CAAAmG,GAAA,EAAC7C,aAAa;YAAC5B,KAAK,EAAE6C,IAAK;YAAAQ,QAAA,EAAEH,eAAe,CAACsB;UAAI,CAAgB,CAAC,eAC5F,IAAAlG,WAAA,CAAAmG,GAAA,EAACvC,cAAc;YAAClC,KAAK,EAAE6C,IAAK;YAAAQ,QAAA,EAAEH,eAAe,EAAEwB;UAAI,CAAiB,CAAC;QAAA,CACxD,CAAC,EAEfpB,WAAW,iBACV,IAAAhF,WAAA,CAAAmG,GAAA,EAACnC,oBAAoB;UAACtC,KAAK,EAAE6C,IAAK;UAAC,eAAa,UAAW;UAAAQ,QAAA,eACzD,IAAA/E,WAAA,CAAAmG,GAAA,EAACvG,OAAA,CAAAyG,UAAU;YAACC,MAAM,EAAEA,CAAA,KAAMnB,cAAc,CAAC,KAAK,CAAE;YAACoB,wBAAwB;YACvEC,SAAS,EAAE1E,QAAM,CAACC,aAAa,CAAC;cAAEC,aAAa,EAAE,MAAM;cAAEC,cAAc,EAAE;YAAS,CAAC,EAAEC,KAAK,CAAE;YAACuE,OAAO,EAAC,WAAW;YAACC,KAAK,EAAC,UAAU;YAAA3B,QAAA,eACjI,IAAA/E,WAAA,CAAAmG,GAAA,EAACtG,MAAA,CAAA8G,WAAW,CAACC,KAAK,IAAE;UAAC,CACX;QAAC,CACO,CACvB;MAAA,CACyB,CAC7B,eAED,IAAA5G,WAAA,CAAAmG,GAAA,EAACnD,6BAA6B;QAACtB,KAAK,EAAE6C,IAAK;QAAAQ,QAAA,EAAED;MAAW,CAAgC,CAAC,EAExF,CAAC,CAACD,kBAAkB,iBACnB,IAAA7E,WAAA,CAAAgG,IAAA,EAAC9C,6BAA6B;QAACxB,KAAK,EAAE6C,IAAK;QAAAQ,QAAA,GACxC,CAAC,CAACF,kBAAkB,EAAEgC,UAAU,EAAEC,IAAI,iBACrC,IAAA9G,WAAA,CAAAmG,GAAA,EAAClC,mBAAmB;UAACvC,KAAK,EAAE6C,IAAK;UAAC,eAAa,SAAU;UAAAQ,QAAA,eACvD,IAAA/E,WAAA,CAAAmG,GAAA,EAACvG,OAAA,CAAAmH,UAAU;YAACxC,IAAI,EAAEA,IAAK;YAACkC,OAAO,EAAC,WAAW;YAACK,IAAI,EAAEjC,kBAAkB,CAACgC,UAAU,CAACC,IAAK;YAACE,OAAO,EAAEnC,kBAAkB,CAACgC,UAAU,CAACP,MAAO;YAAAvB,QAAA,EACjIF,kBAAkB,CAACgC,UAAU,CAACI;UAAK,CAC1B;QAAC,CACM,CACtB,eAED,IAAAjH,WAAA,CAAAmG,GAAA;UAAKe,SAAS,EAAC;QAAa,CAAE,CAAC,eAE/B,IAAAlH,WAAA,CAAAmG,GAAA,EAACjC,mBAAmB;UAACxC,KAAK,EAAE6C,IAAK;UAAC,eAAa,SAAU;UAAAQ,QAAA,EACtDF,kBAAkB,EAAEsC,WAAW,EAAEC,GAAG,CAAEC,UAAU,iBAC/C,IAAArH,WAAA,CAAAmG,GAAA,EAACvG,OAAA,CAAAyG,UAAU;YAACC,MAAM,EAAEe,UAAU,CAACf,MAAO;YAACG,OAAO,EAAC,WAAW;YAACC,KAAK,EAAC,UAAU;YAACH,wBAAwB;YAAAxB,QAAA,EACjGsC,UAAU,CAACP;UAAI,CACN,CACb;QAAC,CACiB,CAAC;MAAA,CACO,CAChC;IAAA,CACe,CAAC,eAEnB,IAAA9G,WAAA,CAAAgG,IAAA;MAAKgB,OAAO,EAAEA,CAAA,KAAMhC,WAAW,IAAIG,cAAc,CAAC,CAACD,WAAW,CAAE;MAAAH,QAAA,GAC7DA,QAAQ,eAET,IAAA/E,WAAA,CAAAmG,GAAA;QAAKe,SAAS,EAAC;MAAe,CAAE,CAAC;IAAA,CAC9B,CAAC;EAAA,CACQ,CAAC;AAErB,CAAC;AAACzC,OAAA,CAAA6C,SAAA;EApHA1C,eAAe,EAAA2C,UAAA,CAAAhH,OAAA,CAAAmG,KAAA;IAhDfN,IAAI,EAAAmB,UAAA,CAAAhH,OAAA,CAAAiH,MAAA,CAAAC,UAAA;IAKJvB,IAAI,EAAAqB,UAAA,CAAAhH,OAAA,CAAAiH;EAAA;EAgDJ3C,kBAAkB,EAAA0C,UAAA,CAAAhH,OAAA,CAAAmG,KAAA;IAvBlBS,WAAW,EAAAI,UAAA,CAAAhH,OAAA,CAAAmH,OAAA,CAAAH,UAAA,CAAAhH,OAAA,CAAAmG,KAAA;MAlBXI,IAAI,EAAAS,UAAA,CAAAhH,OAAA,CAAAoH,IAAA,CAAAF,UAAA;MAKJnB,MAAM,EAAAiB,UAAA,CAAAhH,OAAA,CAAAqH,IAAA,CAAAH,UAAA;MAKNR,KAAK,EAAAM,UAAA,CAAAhH,OAAA,CAAAiH;IAAA;IAaLX,UAAU,EAAAU,UAAA,CAAAhH,OAAA,CAAAmG,KAAA;MAvBVI,IAAI,EAAAS,UAAA,CAAAhH,OAAA,CAAAoH,IAAA,CAAAF,UAAA;MAKJnB,MAAM,EAAAiB,UAAA,CAAAhH,OAAA,CAAAqH,IAAA,CAAAH,UAAA;MAKNR,KAAK,EAAAM,UAAA,CAAAhH,OAAA,CAAAiH;IAAA;EAAA;EAoCL1C,WAAW,EAAAyC,UAAA,CAAAhH,OAAA,CAAAoH,IAAA,CAAAF,UAAA;EAKX1C,QAAQ,EAAAwC,UAAA,CAAAhH,OAAA,CAAAoH,IAAA,CAAAF,UAAA;EAWRzC,WAAW,EAAAuC,UAAA,CAAAhH,OAAA,CAAAsH,IAAA,CAAAJ,UAAA;EAMXxC,gBAAgB,EAAAsC,UAAA,CAAAhH,OAAA,CAAAsH;AAAA;AAAA,IAAAC,QAAA,GAAAxG,OAAA,CAAAf,OAAA,GAsFHkE,OAAO","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"Popover.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_","_Button","_icons","_styles","_types","_jsxRuntime","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","PopoverContainer","exports","styled","div","props","$size","Size","Small","Large","COLORS","generateToken","componentType","defaultVariant","theme","BOXSHADOWS","BOXSHADOW_CENTERED","Z_INDEXES","popover","$position","Position","Bottom","Top","Left","Right","$showArrowPointer","renderArrowStyles","PopoverTopSectionContainer","PopoverMiddleSectionContainer","scrollBarStyling","PopoverBottomSectionContainer","TextContainer","renderMargins","$note","NoteContainer","ComponentXSStyling","ComponentTextStyle","Regular","ComponentXXSStyling","ComponentSStyling","LabelContainer","ComponentMStyling","Bold","ComponentLStyling","CloseButtonContainer","TextButtonContainer","IconButtonContainer","PopoverWrapper","$showOnClick","$showPopover","isNotePresent","size","position","Popover","_ref","topSectionProps","bottomSectionProps","mainContent","children","showOnClick","showArrowPointer","showPopover","setShowPopover","useState","useTheme","popoverRef","useRef","wrapperRef","useEffect","checkIfClickedOutside","current","contains","target","document","addEventListener","removeEventListener","handleWrapperClick","stopPropagation","jsxs","ref","note","jsx","text","IconButton","action","useTransparentBackground","iconColor","variant","shape","SystemIcons","Close","textButton","icon","TextButton","onClick","label","className","iconButtons","map","iconButton","propTypes","_propTypes","string","isRequired","arrayOf","node","func","bool","_default"],"sources":["../../src/Popover/Popover.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled, { useTheme } from 'styled-components';\r\nimport { COLORS, ComponentTextStyle, ComponentXSStyling } from '..';\r\nimport { TextButton, IconButton } from '../Button';\r\nimport { SystemIcons } from '../icons';\r\nimport { BOXSHADOWS, ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentXXSStyling, scrollBarStyling, Z_INDEXES } from '../styles';\r\nimport { Position, Size } from '../types';\r\n\r\nexport const PopoverContainer = styled.div<{ $size?: Size; $position: Position; $showArrowPointer: boolean }>`\r\n //height: ${(props) => (props.$size === Size.Small ? '240px' : props.$size === Size.Large ? '480px' : '360px')};\r\n ${(props) => props.$size && `min-width: ${props.$size === Size.Small ? '320px' : props.$size === Size.Large ? '640px' : '480px'};`}\r\n width: ${(props) => !props.$size ? 'fit-content' : 'auto'};\r\n border-radius: 4px;\r\n background: ${props => COLORS.generateToken({ componentType: 'bg-surface', defaultVariant: 'high' }, props.theme)};\r\n cursor: default;\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\r\n\r\n position: absolute; \r\n visibility: hidden;\r\n opacity: 0;\r\n z-index: ${Z_INDEXES.popover};\r\n\r\n ${(props) => (props.$position == Position.Bottom ? 'right: 50%; top: calc(100% + 16px); transform: translateX(50%);' : '')}\r\n ${(props) => (props.$position == Position.Top ? 'right: 50%; bottom: calc(100% + 16px); transform: translateX(50%);' : '')}\r\n\r\n ${(props) => (props.$position == Position.Left ? 'bottom: 50%; right: calc(100% + 16px); transform: translateY(50%);' : '')}\r\n ${(props) => (props.$position == Position.Right ? 'bottom: 50%; left: calc(100% + 16px); transform: translateY(50%);' : '')}\r\n\r\n &::after {\r\n ${(props) => (props.$showArrowPointer ? renderArrowStyles(props.$position) : '')}\r\n }\r\n`;\r\n\r\nexport const PopoverTopSectionContainer = styled.div<{ $size?: Size }>`\r\n ${(props) => props.$size && `height: ${props.$size === Size.Small ? '56px' : props.$size === Size.Large ? '72px' : '64px'};`}\r\n display: flex;\r\n`;\r\n\r\nexport const PopoverMiddleSectionContainer = styled.div<{ $size?: Size }>`\r\n margin: 8px;\r\n ${(props) => props.$size && `height: ${props.$size === Size.Small ? '104px' : props.$size === Size.Large ? '304px' : '208px'};`}\r\n ${(props) => props.$size && `padding: ${props.$size === Size.Small ? '0 8px' : props.$size === Size.Large ? '0 16px' : '0 12px'};`}\r\n ${(props) => !props.$size && `padding: 8px;`}\r\n ${(props) => props.$size && 'overflow-y: auto;'}\r\n ${(props) => props.$size && scrollBarStyling(Size.Small)}\r\n`;\r\n\r\nexport const PopoverBottomSectionContainer = styled.div<{ $size?: Size }>`\r\n ${(props) => props.$size && `height: ${props.$size === Size.Small ? '64px' : props.$size === Size.Large ? '88px' : '72px'};`}\r\n display: flex;\r\n\r\n .bottom-flex {\r\n flex: 1;\r\n }\r\n`;\r\n\r\nconst TextContainer = styled.div<{ $note: boolean; $size?: Size }>`\r\n display: flex;\r\n flex-direction: column;\r\n color: ${props => COLORS.generateToken({ componentType: 'text', defaultVariant: 'default' }, props.theme)};\r\n ${(props) => props.$size && `margin: ${renderMargins(props.$note, props.$size)};`}\r\n ${(props) => !props.$size && `margin: 8px;`}\r\n flex-grow: 1;\r\n`;\r\n\r\nconst NoteContainer = styled.div<{ $size?: Size }>`\r\n ${(props) =>\r\n !props.$size\r\n ? ComponentXSStyling(ComponentTextStyle.Regular, COLORS.generateToken({ componentType: 'text', defaultVariant: 'subtle' }, props.theme))\r\n : props.$size === Size.Small\r\n ? ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.generateToken({ componentType: 'text', defaultVariant: 'subtle' }, props.theme))\r\n : props.$size === Size.Large\r\n ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.generateToken({ componentType: 'text', defaultVariant: 'subtle' }, props.theme))\r\n : ComponentXSStyling(ComponentTextStyle.Regular, COLORS.generateToken({ componentType: 'text', defaultVariant: 'subtle' }, props.theme))}\r\n`;\r\n\r\nconst LabelContainer = styled.div<{ $size?: Size }>`\r\n ${(props) =>\r\n !props.$size\r\n ? ComponentMStyling(ComponentTextStyle.Bold, null)\r\n : props.$size === Size.Small\r\n ? ComponentSStyling(ComponentTextStyle.Bold, null)\r\n : props.$size === Size.Large\r\n ? ComponentLStyling(ComponentTextStyle.Bold, null)\r\n : ComponentMStyling(ComponentTextStyle.Bold, null)}\r\n`;\r\n\r\nconst CloseButtonContainer = styled.div<{ $size?: Size }>`\r\n ${(props) => props.$size && `margin: ${props.$size === Size.Small ? '4px 16px 4px 0' : props.$size === Size.Large ? '12px 24px 12px 0' : '8px 20px 8px 0'};`}\r\n ${(props) => !props.$size && `margin: 8px;`}\r\n`;\r\n\r\nconst TextButtonContainer = styled.div<{ $size?: Size }>`\r\n ${(props) => props.$size && `margin: ${props.$size === Size.Small ? '8px 0 8px 16px' : props.$size === Size.Large ? '16px 0 16px 24px' : '12px 0 12px 20px'};`}\r\n ${(props) => !props.$size && `margin: 8px;`}\r\n`;\r\n\r\nconst IconButtonContainer = styled.div<{ $size?: Size }>`\r\n ${(props) => props.$size && `margin: ${props.$size === Size.Small ? '8px 16px 8px 0' : props.$size === Size.Large ? '16px 24px 16px 0' : '12px 20px 12px 0'};`}\r\n ${(props) => !props.$size && `margin: 8px;`}\r\n display: flex;\r\n`;\r\n\r\nexport const PopoverWrapper = styled.div<{ $position: Position; $showOnClick: boolean; $showPopover: boolean }>`\r\n position: relative;\r\n\r\n .pointer-space {\r\n height: ${(props) => (props.$position === Position.Top || props.$position === Position.Bottom ? '16px' : '100%')};\r\n width: ${(props) => (props.$position === Position.Left || props.$position === Position.Right ? '16px' : '100%')};\r\n position: absolute;\r\n\r\n ${(props) => (props.$position === Position.Left ? 'right:100%; bottom: 0%' : '')};\r\n ${(props) => (props.$position === Position.Right ? 'left:100%; bottom: 0%' : '')};\r\n\r\n ${(props) => (props.$position === Position.Top ? 'bottom: 100%' : '')};\r\n ${(props) => (props.$position === Position.Bottom ? 'top: 100%' : '')};\r\n }\r\n\r\n ${(props) =>\r\n props.$showOnClick\r\n ? `${PopoverContainer} {\r\n visibility: ${props.$showPopover ? 'visible' : 'hidden'};\r\n opacity: ${props.$showPopover ? '1' : '0'};\r\n }\r\n cursor: pointer;`\r\n : `&:hover {\r\n ${PopoverContainer} {\r\n visibility: visible;\r\n opacity: 1;\r\n }\r\n }`}\r\n`;\r\n\r\nconst renderMargins = (isNotePresent: boolean, size?: Size): string => {\r\n if (!size) {\r\n return isNotePresent ? '8px' : '12px 8px';\r\n }\r\n if (isNotePresent) {\r\n return size === Size.Small ? '10px 16px' : size === Size.Large ? '14px 24px' : '12px 20px';\r\n } else {\r\n return size === Size.Small ? '18px 16px' : size === Size.Large ? '24px' : '20px';\r\n }\r\n};\r\n\r\nconst renderArrowStyles = (position: Position) => {\r\n if (position === Position.Bottom) {\r\n return `height: 0px;\r\n width: 0px;\r\n border-top: 16px solid transparent;\r\n border-right: 12px solid transparent;\r\n border-bottom: 16px solid rgb(255,255,255);\r\n border-left: 12px solid transparent;\r\n content: \"\";\r\n position: absolute;\r\n right: calc(50% - 12px);\r\n bottom: calc(100% - 1px);`;\r\n }\r\n\r\n if (position === Position.Top) {\r\n return `height: 0px;\r\n width: 0px;\r\n border-top: 16px solid rgb(255,255,255);\r\n border-right: 12px solid transparent;\r\n border-bottom: 16px solid transparent;\r\n border-left: 12px solid transparent;\r\n content: \"\";\r\n position: absolute;\r\n right: calc(50% - 12px);\r\n top: calc(100% - 1px);`;\r\n }\r\n\r\n if (position === Position.Left) {\r\n return `height: 0px;\r\n width: 0px;\r\n border-top: 12px solid transparent;\r\n border-right: 16px solid transparent;\r\n border-bottom: 12px solid transparent;\r\n border-left: 16px solid rgb(255,255,255);\r\n content: \"\";\r\n position: absolute;\r\n left: calc(100% - 1px);\r\n bottom: calc(50% - 12px);`;\r\n }\r\n\r\n if (position === Position.Right) {\r\n return `height: 0px;\r\n width: 0px;\r\n border-top: 12px solid transparent;\r\n border-right: 16px solid rgb(255,255,255);\r\n border-bottom: 12px solid transparent;\r\n border-left: 16px solid transparent;\r\n content: \"\";\r\n position: absolute;\r\n right: calc(100% - 1px);\r\n bottom: calc(50% - 12px);`;\r\n }\r\n};\r\n\r\nexport interface PopoverTopSectionProps {\r\n /**\r\n * Required. The main text to be displayed in the top section of the popover.\r\n */\r\n text: string;\r\n\r\n /**\r\n * Optional. A note to be displayed below the main text in the top section of the popover.\r\n */\r\n note?: string;\r\n};\r\n\r\nexport interface PopoverActionButtonProps {\r\n /**\r\n * Required. The icon to be displayed on the button.\r\n */\r\n icon: React.ReactNode;\r\n\r\n /**\r\n * Required. The handler function to be called when the button is clicked.\r\n */\r\n action: () => void;\r\n\r\n /**\r\n * Optional. The label for the button. If provided, the button will display this text.\r\n */\r\n label?: string;\r\n};\r\n\r\nexport interface PopoverBottomSectionProps {\r\n /**\r\n * Optional. An array of PopoverActionButtonProps objects.\r\n * Each object represents an icon button to be displayed in the bottom section of the popover.\r\n */\r\n iconButtons?: PopoverActionButtonProps[];\r\n\r\n /**\r\n * Optional. A PopoverActionButtonProps object representing a text button to be displayed in the bottom section of the popover.\r\n */\r\n textButton?: PopoverActionButtonProps;\r\n};\r\n\r\nexport interface PopoverProps {\r\n /**\r\n * Optional. The size of the popover. It can be 'Small', 'Medium', or 'Large'.\r\n * Defaults to 'Medium' if not specified.\r\n */\r\n size?: Size.Small | Size.Medium | Size.Large;\r\n\r\n /**\r\n * Optional. Properties for the top section of the popover.\r\n */\r\n topSectionProps?: PopoverTopSectionProps;\r\n\r\n /**\r\n * Optional. Properties for the bottom section of the popover.\r\n */\r\n bottomSectionProps?: PopoverBottomSectionProps;\r\n\r\n /**\r\n * Required. The main content to be displayed in the popover.\r\n */\r\n mainContent: React.ReactNode;\r\n\r\n /**\r\n * Required. The children to be rendered inside the popover.\r\n */\r\n children: React.ReactNode;\r\n\r\n /**\r\n * Required. The position of the popover relative to the target element.\r\n * It can be 'Top', 'Bottom', 'Right', or 'Left'.\r\n */\r\n position: Position.Top | Position.Bottom | Position.Right | Position.Left;\r\n\r\n /**\r\n * Required. A boolean indicating whether the popover should be shown when the target element is clicked. Defaults to 'false', meaning that popover will be shown on mouse hover.\r\n */\r\n showOnClick: boolean;\r\n\r\n /**\r\n * Optional. A boolean indicating whether an arrow pointer should be shown on the popover.\r\n * Defaults to 'false' if not specified.\r\n */\r\n showArrowPointer?: boolean;\r\n};\r\n\r\nconst Popover: React.FunctionComponent<PopoverProps> = ({\r\n size,\r\n topSectionProps,\r\n bottomSectionProps,\r\n mainContent,\r\n children,\r\n position,\r\n showOnClick = false,\r\n showArrowPointer = false,\r\n}) => {\r\n const [showPopover, setShowPopover] = React.useState(false);\r\n const theme = useTheme();\r\n const popoverRef = React.useRef<any>(null);\r\n const wrapperRef = React.useRef<any>(null);\r\n\r\n React.useEffect(() => {\r\n const checkIfClickedOutside = (e: { target: any }) => {\r\n if (showPopover && popoverRef.current && !popoverRef.current.contains(e.target) && wrapperRef.current && !wrapperRef.current.contains(e.target)) {\r\n setShowPopover(false);\r\n }\r\n };\r\n\r\n document.addEventListener('mousedown', checkIfClickedOutside);\r\n\r\n return () => {\r\n document.removeEventListener('mousedown', checkIfClickedOutside);\r\n };\r\n }, [showPopover]);\r\n\r\n const handleWrapperClick = (e: React.MouseEvent) => {\r\n if (showOnClick) {\r\n e.stopPropagation();\r\n setShowPopover(!showPopover);\r\n }\r\n };\r\n\r\n return (\r\n <PopoverWrapper $position={position} $showOnClick={showOnClick} $showPopover={showPopover}>\r\n <PopoverContainer $size={size} $position={position} ref={popoverRef} $showArrowPointer={showArrowPointer}>\r\n {!!topSectionProps && (\r\n <PopoverTopSectionContainer $size={size}>\r\n <TextContainer $note={!!topSectionProps?.note} $size={size}>\r\n {topSectionProps?.note && <NoteContainer $size={size}>{topSectionProps.note}</NoteContainer>}\r\n <LabelContainer $size={size}>{topSectionProps?.text}</LabelContainer>\r\n </TextContainer>\r\n\r\n {showOnClick && (\r\n <CloseButtonContainer $size={size} data-testid={'closeBtn'}>\r\n <IconButton action={() => setShowPopover(false)} useTransparentBackground \r\n iconColor={COLORS.generateToken({ componentType: 'icon', defaultVariant: 'subtle' }, theme)} variant=\"secondary\" shape=\"circular\">\r\n <SystemIcons.Close />\r\n </IconButton>\r\n </CloseButtonContainer>\r\n )}\r\n </PopoverTopSectionContainer>\r\n )}\r\n\r\n <PopoverMiddleSectionContainer $size={size}>{mainContent}</PopoverMiddleSectionContainer>\r\n\r\n {!!bottomSectionProps && (\r\n <PopoverBottomSectionContainer $size={size}>\r\n {!!bottomSectionProps?.textButton?.icon && (\r\n <TextButtonContainer $size={size} data-testid={'textBtn'}>\r\n <TextButton size={size} variant=\"secondary\" icon={bottomSectionProps.textButton.icon} onClick={bottomSectionProps.textButton.action}>\r\n {bottomSectionProps.textButton.label}\r\n </TextButton>\r\n </TextButtonContainer>\r\n )}\r\n\r\n <div className=\"bottom-flex\" />\r\n\r\n <IconButtonContainer $size={size} data-testid={'iconBtn'}>\r\n {bottomSectionProps?.iconButtons?.map((iconButton) => (\r\n <IconButton action={iconButton.action} variant=\"secondary\" shape=\"circular\" useTransparentBackground>\r\n {iconButton.icon}\r\n </IconButton>\r\n ))}\r\n </IconButtonContainer>\r\n </PopoverBottomSectionContainer>\r\n )}\r\n </PopoverContainer>\r\n\r\n <div ref={wrapperRef} onClick={handleWrapperClick}>\r\n {children}\r\n\r\n <div className=\"pointer-space\" />\r\n </div>\r\n </PopoverWrapper>\r\n );\r\n};\r\n\r\nexport default Popover;\r\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -1,18 +1,18 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { Position, Size } from '../types';
|
|
3
3
|
export declare const PopoverContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
4
|
-
$size
|
|
4
|
+
$size?: Size;
|
|
5
5
|
$position: Position;
|
|
6
6
|
$showArrowPointer: boolean;
|
|
7
7
|
}>> & string;
|
|
8
8
|
export declare const PopoverTopSectionContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
9
|
-
$size
|
|
9
|
+
$size?: Size;
|
|
10
10
|
}>> & string;
|
|
11
11
|
export declare const PopoverMiddleSectionContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
12
|
-
$size
|
|
12
|
+
$size?: Size;
|
|
13
13
|
}>> & string;
|
|
14
14
|
export declare const PopoverBottomSectionContainer: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
15
|
-
$size
|
|
15
|
+
$size?: Size;
|
|
16
16
|
}>> & string;
|
|
17
17
|
export declare const PopoverWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {
|
|
18
18
|
$position: Position;
|
package/dist/Popover/Popover.js
CHANGED
|
@@ -9,7 +9,8 @@ import { Position, Size } from '../types';
|
|
|
9
9
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
10
10
|
export const PopoverContainer = styled.div`
|
|
11
11
|
//height: ${props => props.$size === Size.Small ? '240px' : props.$size === Size.Large ? '480px' : '360px'};
|
|
12
|
-
min-width: ${props
|
|
12
|
+
${props => props.$size && `min-width: ${props.$size === Size.Small ? '320px' : props.$size === Size.Large ? '640px' : '480px'};`}
|
|
13
|
+
width: ${props => !props.$size ? 'fit-content' : 'auto'};
|
|
13
14
|
border-radius: 4px;
|
|
14
15
|
background: ${props => COLORS.generateToken({
|
|
15
16
|
componentType: 'bg-surface',
|
|
@@ -31,20 +32,22 @@ export const PopoverContainer = styled.div`
|
|
|
31
32
|
|
|
32
33
|
&::after {
|
|
33
34
|
${props => props.$showArrowPointer ? renderArrowStyles(props.$position) : ''}
|
|
35
|
+
}
|
|
34
36
|
`;
|
|
35
37
|
export const PopoverTopSectionContainer = styled.div`
|
|
36
|
-
|
|
38
|
+
${props => props.$size && `height: ${props.$size === Size.Small ? '56px' : props.$size === Size.Large ? '72px' : '64px'};`}
|
|
37
39
|
display: flex;
|
|
38
40
|
`;
|
|
39
41
|
export const PopoverMiddleSectionContainer = styled.div`
|
|
40
42
|
margin: 8px;
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
${
|
|
43
|
+
${props => props.$size && `height: ${props.$size === Size.Small ? '104px' : props.$size === Size.Large ? '304px' : '208px'};`}
|
|
44
|
+
${props => props.$size && `padding: ${props.$size === Size.Small ? '0 8px' : props.$size === Size.Large ? '0 16px' : '0 12px'};`}
|
|
45
|
+
${props => !props.$size && `padding: 8px;`}
|
|
46
|
+
${props => props.$size && 'overflow-y: auto;'}
|
|
47
|
+
${props => props.$size && scrollBarStyling(Size.Small)}
|
|
45
48
|
`;
|
|
46
49
|
export const PopoverBottomSectionContainer = styled.div`
|
|
47
|
-
|
|
50
|
+
${props => props.$size && `height: ${props.$size === Size.Small ? '64px' : props.$size === Size.Large ? '88px' : '72px'};`}
|
|
48
51
|
display: flex;
|
|
49
52
|
|
|
50
53
|
.bottom-flex {
|
|
@@ -58,11 +61,15 @@ const TextContainer = styled.div`
|
|
|
58
61
|
componentType: 'text',
|
|
59
62
|
defaultVariant: 'default'
|
|
60
63
|
}, props.theme)};
|
|
61
|
-
|
|
64
|
+
${props => props.$size && `margin: ${renderMargins(props.$note, props.$size)};`}
|
|
65
|
+
${props => !props.$size && `margin: 8px;`}
|
|
62
66
|
flex-grow: 1;
|
|
63
67
|
`;
|
|
64
68
|
const NoteContainer = styled.div`
|
|
65
|
-
${props => props.$size
|
|
69
|
+
${props => !props.$size ? ComponentXSStyling(ComponentTextStyle.Regular, COLORS.generateToken({
|
|
70
|
+
componentType: 'text',
|
|
71
|
+
defaultVariant: 'subtle'
|
|
72
|
+
}, props.theme)) : props.$size === Size.Small ? ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.generateToken({
|
|
66
73
|
componentType: 'text',
|
|
67
74
|
defaultVariant: 'subtle'
|
|
68
75
|
}, props.theme)) : props.$size === Size.Large ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.generateToken({
|
|
@@ -74,16 +81,19 @@ const NoteContainer = styled.div`
|
|
|
74
81
|
}, props.theme))}
|
|
75
82
|
`;
|
|
76
83
|
const LabelContainer = styled.div`
|
|
77
|
-
${props => props.$size === Size.Small ? ComponentSStyling(ComponentTextStyle.Bold, null) : props.$size === Size.Large ? ComponentLStyling(ComponentTextStyle.Bold, null) : ComponentMStyling(ComponentTextStyle.Bold, null)}
|
|
84
|
+
${props => !props.$size ? ComponentMStyling(ComponentTextStyle.Bold, null) : props.$size === Size.Small ? ComponentSStyling(ComponentTextStyle.Bold, null) : props.$size === Size.Large ? ComponentLStyling(ComponentTextStyle.Bold, null) : ComponentMStyling(ComponentTextStyle.Bold, null)}
|
|
78
85
|
`;
|
|
79
86
|
const CloseButtonContainer = styled.div`
|
|
80
|
-
|
|
87
|
+
${props => props.$size && `margin: ${props.$size === Size.Small ? '4px 16px 4px 0' : props.$size === Size.Large ? '12px 24px 12px 0' : '8px 20px 8px 0'};`}
|
|
88
|
+
${props => !props.$size && `margin: 8px;`}
|
|
81
89
|
`;
|
|
82
90
|
const TextButtonContainer = styled.div`
|
|
83
|
-
|
|
91
|
+
${props => props.$size && `margin: ${props.$size === Size.Small ? '8px 0 8px 16px' : props.$size === Size.Large ? '16px 0 16px 24px' : '12px 0 12px 20px'};`}
|
|
92
|
+
${props => !props.$size && `margin: 8px;`}
|
|
84
93
|
`;
|
|
85
94
|
const IconButtonContainer = styled.div`
|
|
86
|
-
|
|
95
|
+
${props => props.$size && `margin: ${props.$size === Size.Small ? '8px 16px 8px 0' : props.$size === Size.Large ? '16px 24px 16px 0' : '12px 20px 12px 0'};`}
|
|
96
|
+
${props => !props.$size && `margin: 8px;`}
|
|
87
97
|
display: flex;
|
|
88
98
|
`;
|
|
89
99
|
export const PopoverWrapper = styled.div`
|
|
@@ -113,6 +123,9 @@ export const PopoverWrapper = styled.div`
|
|
|
113
123
|
}`}
|
|
114
124
|
`;
|
|
115
125
|
const renderMargins = (isNotePresent, size) => {
|
|
126
|
+
if (!size) {
|
|
127
|
+
return isNotePresent ? '8px' : '12px 8px';
|
|
128
|
+
}
|
|
116
129
|
if (isNotePresent) {
|
|
117
130
|
return size === Size.Small ? '10px 16px' : size === Size.Large ? '14px 24px' : '12px 20px';
|
|
118
131
|
} else {
|
|
@@ -175,7 +188,7 @@ const renderArrowStyles = position => {
|
|
|
175
188
|
;
|
|
176
189
|
const Popover = _ref => {
|
|
177
190
|
let {
|
|
178
|
-
size
|
|
191
|
+
size,
|
|
179
192
|
topSectionProps,
|
|
180
193
|
bottomSectionProps,
|
|
181
194
|
mainContent,
|
|
@@ -187,9 +200,10 @@ const Popover = _ref => {
|
|
|
187
200
|
const [showPopover, setShowPopover] = React.useState(false);
|
|
188
201
|
const theme = useTheme();
|
|
189
202
|
const popoverRef = React.useRef(null);
|
|
203
|
+
const wrapperRef = React.useRef(null);
|
|
190
204
|
React.useEffect(() => {
|
|
191
205
|
const checkIfClickedOutside = e => {
|
|
192
|
-
if (showPopover && popoverRef.current && !popoverRef.current.contains(e.target)) {
|
|
206
|
+
if (showPopover && popoverRef.current && !popoverRef.current.contains(e.target) && wrapperRef.current && !wrapperRef.current.contains(e.target)) {
|
|
193
207
|
setShowPopover(false);
|
|
194
208
|
}
|
|
195
209
|
};
|
|
@@ -198,6 +212,12 @@ const Popover = _ref => {
|
|
|
198
212
|
document.removeEventListener('mousedown', checkIfClickedOutside);
|
|
199
213
|
};
|
|
200
214
|
}, [showPopover]);
|
|
215
|
+
const handleWrapperClick = e => {
|
|
216
|
+
if (showOnClick) {
|
|
217
|
+
e.stopPropagation();
|
|
218
|
+
setShowPopover(!showPopover);
|
|
219
|
+
}
|
|
220
|
+
};
|
|
201
221
|
return /*#__PURE__*/_jsxs(PopoverWrapper, {
|
|
202
222
|
$position: position,
|
|
203
223
|
$showOnClick: showOnClick,
|
|
@@ -264,7 +284,8 @@ const Popover = _ref => {
|
|
|
264
284
|
})]
|
|
265
285
|
})]
|
|
266
286
|
}), /*#__PURE__*/_jsxs("div", {
|
|
267
|
-
|
|
287
|
+
ref: wrapperRef,
|
|
288
|
+
onClick: handleWrapperClick,
|
|
268
289
|
children: [children, /*#__PURE__*/_jsx("div", {
|
|
269
290
|
className: "pointer-space"
|
|
270
291
|
})]
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Popover.js","names":["React","styled","useTheme","COLORS","ComponentTextStyle","ComponentXSStyling","TextButton","IconButton","SystemIcons","BOXSHADOWS","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentXXSStyling","scrollBarStyling","Z_INDEXES","Position","Size","jsx","_jsx","jsxs","_jsxs","PopoverContainer","div","props","$size","Small","Large","generateToken","componentType","defaultVariant","theme","BOXSHADOW_CENTERED","popover","$position","Bottom","Top","Left","Right","$showArrowPointer","renderArrowStyles","PopoverTopSectionContainer","PopoverMiddleSectionContainer","PopoverBottomSectionContainer","TextContainer","renderMargins","$note","NoteContainer","Regular","LabelContainer","Bold","CloseButtonContainer","TextButtonContainer","IconButtonContainer","PopoverWrapper","$showOnClick","$showPopover","isNotePresent","size","position","Popover","_ref","Medium","topSectionProps","bottomSectionProps","mainContent","children","showOnClick","showArrowPointer","showPopover","setShowPopover","useState","popoverRef","useRef","useEffect","checkIfClickedOutside","e","current","contains","target","document","addEventListener","removeEventListener","ref","note","text","action","useTransparentBackground","iconColor","variant","shape","Close","textButton","icon","onClick","label","className","iconButtons","map","iconButton","propTypes","_pt","string","isRequired","arrayOf","node","func","bool"],"sources":["../../src/Popover/Popover.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled, { useTheme } from 'styled-components';\r\nimport { COLORS, ComponentTextStyle, ComponentXSStyling } from '..';\r\nimport { TextButton, IconButton } from '../Button';\r\nimport { SystemIcons } from '../icons';\r\nimport { BOXSHADOWS, ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentXXSStyling, scrollBarStyling, Z_INDEXES } from '../styles';\r\nimport { Position, Size } from '../types';\r\n\r\nexport const PopoverContainer = styled.div<{ $size: Size; $position: Position; $showArrowPointer: boolean }>`\r\n //height: ${(props) => (props.$size === Size.Small ? '240px' : props.$size === Size.Large ? '480px' : '360px')};\r\n min-width: ${(props) => (props.$size === Size.Small ? '320px' : props.$size === Size.Large ? '640px' : '480px')};\r\n border-radius: 4px;\r\n background: ${props => COLORS.generateToken({ componentType: 'bg-surface', defaultVariant: 'high' }, props.theme)};\r\n cursor: default;\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\r\n\r\n position: absolute; \r\n visibility: hidden;\r\n opacity: 0;\r\n z-index: ${Z_INDEXES.popover};\r\n\r\n ${(props) => (props.$position == Position.Bottom ? 'right: 50%; top: calc(100% + 16px); transform: translateX(50%);' : '')}\r\n ${(props) => (props.$position == Position.Top ? 'right: 50%; bottom: calc(100% + 16px); transform: translateX(50%);' : '')}\r\n\r\n ${(props) => (props.$position == Position.Left ? 'bottom: 50%; right: calc(100% + 16px); transform: translateY(50%);' : '')}\r\n ${(props) => (props.$position == Position.Right ? 'bottom: 50%; left: calc(100% + 16px); transform: translateY(50%);' : '')}\r\n\r\n &::after {\r\n ${(props) => (props.$showArrowPointer ? renderArrowStyles(props.$position) : '')}\r\n`;\r\n\r\nexport const PopoverTopSectionContainer = styled.div<{ $size: Size }>`\r\n height: ${(props) => (props.$size === Size.Small ? '56px' : props.$size === Size.Large ? '72px' : '64px')};\r\n display: flex;\r\n`;\r\n\r\nexport const PopoverMiddleSectionContainer = styled.div<{ $size: Size }>`\r\n margin: 8px;\r\n height: ${(props) => (props.$size === Size.Small ? '104px' : props.$size === Size.Large ? '304px' : '208px')};\r\n padding: ${(props) => (props.$size === Size.Small ? '0 8px' : props.$size === Size.Large ? '0 16px' : '0 12px')};\r\n overflow-y: auto;\r\n ${scrollBarStyling(Size.Small)}\r\n`;\r\n\r\nexport const PopoverBottomSectionContainer = styled.div<{ $size: Size }>`\r\n height: ${(props) => (props.$size === Size.Small ? '64px' : props.$size === Size.Large ? '88px' : '72px')}; \r\n display: flex;\r\n\r\n .bottom-flex {\r\n flex: 1;\r\n }\r\n`;\r\n\r\nconst TextContainer = styled.div<{ $note: boolean; $size: Size }>`\r\n display: flex;\r\n flex-direction: column;\r\n color: ${props => COLORS.generateToken({ componentType: 'text', defaultVariant: 'default' }, props.theme)};\r\n margin: ${(props) => renderMargins(props.$note, props.$size)};\r\n flex-grow: 1;\r\n`;\r\n\r\nconst NoteContainer = styled.div<{ $size: Size }>`\r\n ${(props) =>\r\n props.$size === Size.Small\r\n ? ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.generateToken({ componentType: 'text', defaultVariant: 'subtle' }, props.theme))\r\n : props.$size === Size.Large\r\n ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.generateToken({ componentType: 'text', defaultVariant: 'subtle' }, props.theme))\r\n : ComponentXSStyling(ComponentTextStyle.Regular, COLORS.generateToken({ componentType: 'text', defaultVariant: 'subtle' }, props.theme))}\r\n`;\r\n\r\nconst LabelContainer = styled.div<{ $size: Size }>`\r\n ${(props) =>\r\n props.$size === Size.Small\r\n ? ComponentSStyling(ComponentTextStyle.Bold, null)\r\n : props.$size === Size.Large\r\n ? ComponentLStyling(ComponentTextStyle.Bold, null)\r\n : ComponentMStyling(ComponentTextStyle.Bold, null)}\r\n`;\r\n\r\nconst CloseButtonContainer = styled.div<{ $size: Size }>`\r\n margin: ${(props) => (props.$size === Size.Small ? '4px 16px 4px 0' : props.$size === Size.Large ? '12px 24px 12px 0' : '8px 20px 8px 0')};\r\n`;\r\n\r\nconst TextButtonContainer = styled.div<{ $size: Size }>`\r\n margin: ${(props) => (props.$size === Size.Small ? '8px 0 8px 16px' : props.$size === Size.Large ? '16px 0 16px 24px' : '12px 0 12px 20px')};\r\n`;\r\n\r\nconst IconButtonContainer = styled.div<{ $size: Size }>`\r\n margin: ${(props) => (props.$size === Size.Small ? '8px 16px 8px 0' : props.$size === Size.Large ? '16px 24px 16px 0' : '12px 20px 12px 0')};\r\n display: flex;\r\n`;\r\n\r\nexport const PopoverWrapper = styled.div<{ $position: Position; $showOnClick: boolean; $showPopover: boolean }>`\r\n position: relative;\r\n\r\n .pointer-space {\r\n height: ${(props) => (props.$position === Position.Top || props.$position === Position.Bottom ? '16px' : '100%')};\r\n width: ${(props) => (props.$position === Position.Left || props.$position === Position.Right ? '16px' : '100%')};\r\n position: absolute;\r\n\r\n ${(props) => (props.$position === Position.Left ? 'right:100%; bottom: 0%' : '')};\r\n ${(props) => (props.$position === Position.Right ? 'left:100%; bottom: 0%' : '')};\r\n\r\n ${(props) => (props.$position === Position.Top ? 'bottom: 100%' : '')};\r\n ${(props) => (props.$position === Position.Bottom ? 'top: 100%' : '')};\r\n }\r\n\r\n ${(props) =>\r\n props.$showOnClick\r\n ? `${PopoverContainer} {\r\n visibility: ${props.$showPopover ? 'visible' : 'hidden'};\r\n opacity: ${props.$showPopover ? '1' : '0'};\r\n }\r\n cursor: pointer;`\r\n : `&:hover {\r\n ${PopoverContainer} {\r\n visibility: visible;\r\n opacity: 1;\r\n }\r\n }`}\r\n`;\r\n\r\nconst renderMargins = (isNotePresent: boolean, size: Size): string => {\r\n if (isNotePresent) {\r\n return size === Size.Small ? '10px 16px' : size === Size.Large ? '14px 24px' : '12px 20px';\r\n } else {\r\n return size === Size.Small ? '18px 16px' : size === Size.Large ? '24px' : '20px';\r\n }\r\n};\r\n\r\nconst renderArrowStyles = (position: Position) => {\r\n if (position === Position.Bottom) {\r\n return `height: 0px;\r\n width: 0px;\r\n border-top: 16px solid transparent;\r\n border-right: 12px solid transparent;\r\n border-bottom: 16px solid rgb(255,255,255);\r\n border-left: 12px solid transparent;\r\n content: \"\";\r\n position: absolute;\r\n right: calc(50% - 12px);\r\n bottom: calc(100% - 1px);`;\r\n }\r\n\r\n if (position === Position.Top) {\r\n return `height: 0px;\r\n width: 0px;\r\n border-top: 16px solid rgb(255,255,255);\r\n border-right: 12px solid transparent;\r\n border-bottom: 16px solid transparent;\r\n border-left: 12px solid transparent;\r\n content: \"\";\r\n position: absolute;\r\n right: calc(50% - 12px);\r\n top: calc(100% - 1px);`;\r\n }\r\n\r\n if (position === Position.Left) {\r\n return `height: 0px;\r\n width: 0px;\r\n border-top: 12px solid transparent;\r\n border-right: 16px solid transparent;\r\n border-bottom: 12px solid transparent;\r\n border-left: 16px solid rgb(255,255,255);\r\n content: \"\";\r\n position: absolute;\r\n left: calc(100% - 1px);\r\n bottom: calc(50% - 12px);`;\r\n }\r\n\r\n if (position === Position.Right) {\r\n return `height: 0px;\r\n width: 0px;\r\n border-top: 12px solid transparent;\r\n border-right: 16px solid rgb(255,255,255);\r\n border-bottom: 12px solid transparent;\r\n border-left: 16px solid transparent;\r\n content: \"\";\r\n position: absolute;\r\n right: calc(100% - 1px);\r\n bottom: calc(50% - 12px);`;\r\n }\r\n};\r\n\r\nexport interface PopoverTopSectionProps {\r\n /**\r\n * Required. The main text to be displayed in the top section of the popover.\r\n */\r\n text: string;\r\n\r\n /**\r\n * Optional. A note to be displayed below the main text in the top section of the popover.\r\n */\r\n note?: string;\r\n};\r\n\r\nexport interface PopoverActionButtonProps {\r\n /**\r\n * Required. The icon to be displayed on the button.\r\n */\r\n icon: React.ReactNode;\r\n\r\n /**\r\n * Required. The handler function to be called when the button is clicked.\r\n */\r\n action: () => void;\r\n\r\n /**\r\n * Optional. The label for the button. If provided, the button will display this text.\r\n */\r\n label?: string;\r\n};\r\n\r\nexport interface PopoverBottomSectionProps {\r\n /**\r\n * Optional. An array of PopoverActionButtonProps objects.\r\n * Each object represents an icon button to be displayed in the bottom section of the popover.\r\n */\r\n iconButtons?: PopoverActionButtonProps[];\r\n\r\n /**\r\n * Optional. A PopoverActionButtonProps object representing a text button to be displayed in the bottom section of the popover.\r\n */\r\n textButton?: PopoverActionButtonProps;\r\n};\r\n\r\nexport interface PopoverProps {\r\n /**\r\n * Optional. The size of the popover. It can be 'Small', 'Medium', or 'Large'.\r\n * Defaults to 'Medium' if not specified.\r\n */\r\n size?: Size.Small | Size.Medium | Size.Large;\r\n\r\n /**\r\n * Optional. Properties for the top section of the popover.\r\n */\r\n topSectionProps?: PopoverTopSectionProps;\r\n\r\n /**\r\n * Optional. Properties for the bottom section of the popover.\r\n */\r\n bottomSectionProps?: PopoverBottomSectionProps;\r\n\r\n /**\r\n * Required. The main content to be displayed in the popover.\r\n */\r\n mainContent: React.ReactNode;\r\n\r\n /**\r\n * Required. The children to be rendered inside the popover.\r\n */\r\n children: React.ReactNode;\r\n\r\n /**\r\n * Required. The position of the popover relative to the target element.\r\n * It can be 'Top', 'Bottom', 'Right', or 'Left'.\r\n */\r\n position: Position.Top | Position.Bottom | Position.Right | Position.Left;\r\n\r\n /**\r\n * Required. A boolean indicating whether the popover should be shown when the target element is clicked. Defaults to 'false', meaning that popover will be shown on mouse hover.\r\n */\r\n showOnClick: boolean;\r\n\r\n /**\r\n * Optional. A boolean indicating whether an arrow pointer should be shown on the popover.\r\n * Defaults to 'false' if not specified.\r\n */\r\n showArrowPointer?: boolean;\r\n};\r\n\r\nconst Popover: React.FunctionComponent<PopoverProps> = ({\r\n size = Size.Medium,\r\n topSectionProps,\r\n bottomSectionProps,\r\n mainContent,\r\n children,\r\n position,\r\n showOnClick = false,\r\n showArrowPointer = false,\r\n}) => {\r\n const [showPopover, setShowPopover] = React.useState(false);\r\n const theme = useTheme();\r\n const popoverRef = React.useRef<any>(null);\r\n\r\n React.useEffect(() => {\r\n const checkIfClickedOutside = (e: { target: any }) => {\r\n if (showPopover && popoverRef.current && !popoverRef.current.contains(e.target)) {\r\n setShowPopover(false);\r\n }\r\n };\r\n\r\n document.addEventListener('mousedown', checkIfClickedOutside);\r\n\r\n return () => {\r\n document.removeEventListener('mousedown', checkIfClickedOutside);\r\n };\r\n }, [showPopover]);\r\n\r\n return (\r\n <PopoverWrapper $position={position} $showOnClick={showOnClick} $showPopover={showPopover}>\r\n <PopoverContainer $size={size} $position={position} ref={popoverRef} $showArrowPointer={showArrowPointer}>\r\n {!!topSectionProps && (\r\n <PopoverTopSectionContainer $size={size}>\r\n <TextContainer $note={!!topSectionProps?.note} $size={size}>\r\n {topSectionProps?.note && <NoteContainer $size={size}>{topSectionProps.note}</NoteContainer>}\r\n <LabelContainer $size={size}>{topSectionProps?.text}</LabelContainer>\r\n </TextContainer>\r\n\r\n {showOnClick && (\r\n <CloseButtonContainer $size={size} data-testid={'closeBtn'}>\r\n <IconButton action={() => setShowPopover(false)} useTransparentBackground \r\n iconColor={COLORS.generateToken({ componentType: 'icon', defaultVariant: 'subtle' }, theme)} variant=\"secondary\" shape=\"circular\">\r\n <SystemIcons.Close />\r\n </IconButton>\r\n </CloseButtonContainer>\r\n )}\r\n </PopoverTopSectionContainer>\r\n )}\r\n\r\n <PopoverMiddleSectionContainer $size={size}>{mainContent}</PopoverMiddleSectionContainer>\r\n\r\n {!!bottomSectionProps && (\r\n <PopoverBottomSectionContainer $size={size}>\r\n {!!bottomSectionProps?.textButton?.icon && (\r\n <TextButtonContainer $size={size} data-testid={'textBtn'}>\r\n <TextButton size={size} variant=\"secondary\" icon={bottomSectionProps.textButton.icon} onClick={bottomSectionProps.textButton.action}>\r\n {bottomSectionProps.textButton.label}\r\n </TextButton>\r\n </TextButtonContainer>\r\n )}\r\n\r\n <div className=\"bottom-flex\" />\r\n\r\n <IconButtonContainer $size={size} data-testid={'iconBtn'}>\r\n {bottomSectionProps?.iconButtons?.map((iconButton) => (\r\n <IconButton action={iconButton.action} variant=\"secondary\" shape=\"circular\" useTransparentBackground>\r\n {iconButton.icon}\r\n </IconButton>\r\n ))}\r\n </IconButtonContainer>\r\n </PopoverBottomSectionContainer>\r\n )}\r\n </PopoverContainer>\r\n\r\n <div onClick={() => showOnClick && setShowPopover(!showPopover)}>\r\n {children}\r\n\r\n <div className=\"pointer-space\" />\r\n </div>\r\n </PopoverWrapper>\r\n );\r\n};\r\n\r\nexport default Popover;\r\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"file":"Popover.js","names":["React","styled","useTheme","COLORS","ComponentTextStyle","ComponentXSStyling","TextButton","IconButton","SystemIcons","BOXSHADOWS","ComponentLStyling","ComponentMStyling","ComponentSStyling","ComponentXXSStyling","scrollBarStyling","Z_INDEXES","Position","Size","jsx","_jsx","jsxs","_jsxs","PopoverContainer","div","props","$size","Small","Large","generateToken","componentType","defaultVariant","theme","BOXSHADOW_CENTERED","popover","$position","Bottom","Top","Left","Right","$showArrowPointer","renderArrowStyles","PopoverTopSectionContainer","PopoverMiddleSectionContainer","PopoverBottomSectionContainer","TextContainer","renderMargins","$note","NoteContainer","Regular","LabelContainer","Bold","CloseButtonContainer","TextButtonContainer","IconButtonContainer","PopoverWrapper","$showOnClick","$showPopover","isNotePresent","size","position","Popover","_ref","topSectionProps","bottomSectionProps","mainContent","children","showOnClick","showArrowPointer","showPopover","setShowPopover","useState","popoverRef","useRef","wrapperRef","useEffect","checkIfClickedOutside","e","current","contains","target","document","addEventListener","removeEventListener","handleWrapperClick","stopPropagation","ref","note","text","action","useTransparentBackground","iconColor","variant","shape","Close","textButton","icon","onClick","label","className","iconButtons","map","iconButton","propTypes","_pt","string","isRequired","arrayOf","node","func","bool"],"sources":["../../src/Popover/Popover.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled, { useTheme } from 'styled-components';\r\nimport { COLORS, ComponentTextStyle, ComponentXSStyling } from '..';\r\nimport { TextButton, IconButton } from '../Button';\r\nimport { SystemIcons } from '../icons';\r\nimport { BOXSHADOWS, ComponentLStyling, ComponentMStyling, ComponentSStyling, ComponentXXSStyling, scrollBarStyling, Z_INDEXES } from '../styles';\r\nimport { Position, Size } from '../types';\r\n\r\nexport const PopoverContainer = styled.div<{ $size?: Size; $position: Position; $showArrowPointer: boolean }>`\r\n //height: ${(props) => (props.$size === Size.Small ? '240px' : props.$size === Size.Large ? '480px' : '360px')};\r\n ${(props) => props.$size && `min-width: ${props.$size === Size.Small ? '320px' : props.$size === Size.Large ? '640px' : '480px'};`}\r\n width: ${(props) => !props.$size ? 'fit-content' : 'auto'};\r\n border-radius: 4px;\r\n background: ${props => COLORS.generateToken({ componentType: 'bg-surface', defaultVariant: 'high' }, props.theme)};\r\n cursor: default;\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_CENTERED};\r\n\r\n position: absolute; \r\n visibility: hidden;\r\n opacity: 0;\r\n z-index: ${Z_INDEXES.popover};\r\n\r\n ${(props) => (props.$position == Position.Bottom ? 'right: 50%; top: calc(100% + 16px); transform: translateX(50%);' : '')}\r\n ${(props) => (props.$position == Position.Top ? 'right: 50%; bottom: calc(100% + 16px); transform: translateX(50%);' : '')}\r\n\r\n ${(props) => (props.$position == Position.Left ? 'bottom: 50%; right: calc(100% + 16px); transform: translateY(50%);' : '')}\r\n ${(props) => (props.$position == Position.Right ? 'bottom: 50%; left: calc(100% + 16px); transform: translateY(50%);' : '')}\r\n\r\n &::after {\r\n ${(props) => (props.$showArrowPointer ? renderArrowStyles(props.$position) : '')}\r\n }\r\n`;\r\n\r\nexport const PopoverTopSectionContainer = styled.div<{ $size?: Size }>`\r\n ${(props) => props.$size && `height: ${props.$size === Size.Small ? '56px' : props.$size === Size.Large ? '72px' : '64px'};`}\r\n display: flex;\r\n`;\r\n\r\nexport const PopoverMiddleSectionContainer = styled.div<{ $size?: Size }>`\r\n margin: 8px;\r\n ${(props) => props.$size && `height: ${props.$size === Size.Small ? '104px' : props.$size === Size.Large ? '304px' : '208px'};`}\r\n ${(props) => props.$size && `padding: ${props.$size === Size.Small ? '0 8px' : props.$size === Size.Large ? '0 16px' : '0 12px'};`}\r\n ${(props) => !props.$size && `padding: 8px;`}\r\n ${(props) => props.$size && 'overflow-y: auto;'}\r\n ${(props) => props.$size && scrollBarStyling(Size.Small)}\r\n`;\r\n\r\nexport const PopoverBottomSectionContainer = styled.div<{ $size?: Size }>`\r\n ${(props) => props.$size && `height: ${props.$size === Size.Small ? '64px' : props.$size === Size.Large ? '88px' : '72px'};`}\r\n display: flex;\r\n\r\n .bottom-flex {\r\n flex: 1;\r\n }\r\n`;\r\n\r\nconst TextContainer = styled.div<{ $note: boolean; $size?: Size }>`\r\n display: flex;\r\n flex-direction: column;\r\n color: ${props => COLORS.generateToken({ componentType: 'text', defaultVariant: 'default' }, props.theme)};\r\n ${(props) => props.$size && `margin: ${renderMargins(props.$note, props.$size)};`}\r\n ${(props) => !props.$size && `margin: 8px;`}\r\n flex-grow: 1;\r\n`;\r\n\r\nconst NoteContainer = styled.div<{ $size?: Size }>`\r\n ${(props) =>\r\n !props.$size\r\n ? ComponentXSStyling(ComponentTextStyle.Regular, COLORS.generateToken({ componentType: 'text', defaultVariant: 'subtle' }, props.theme))\r\n : props.$size === Size.Small\r\n ? ComponentXXSStyling(ComponentTextStyle.Regular, COLORS.generateToken({ componentType: 'text', defaultVariant: 'subtle' }, props.theme))\r\n : props.$size === Size.Large\r\n ? ComponentSStyling(ComponentTextStyle.Regular, COLORS.generateToken({ componentType: 'text', defaultVariant: 'subtle' }, props.theme))\r\n : ComponentXSStyling(ComponentTextStyle.Regular, COLORS.generateToken({ componentType: 'text', defaultVariant: 'subtle' }, props.theme))}\r\n`;\r\n\r\nconst LabelContainer = styled.div<{ $size?: Size }>`\r\n ${(props) =>\r\n !props.$size\r\n ? ComponentMStyling(ComponentTextStyle.Bold, null)\r\n : props.$size === Size.Small\r\n ? ComponentSStyling(ComponentTextStyle.Bold, null)\r\n : props.$size === Size.Large\r\n ? ComponentLStyling(ComponentTextStyle.Bold, null)\r\n : ComponentMStyling(ComponentTextStyle.Bold, null)}\r\n`;\r\n\r\nconst CloseButtonContainer = styled.div<{ $size?: Size }>`\r\n ${(props) => props.$size && `margin: ${props.$size === Size.Small ? '4px 16px 4px 0' : props.$size === Size.Large ? '12px 24px 12px 0' : '8px 20px 8px 0'};`}\r\n ${(props) => !props.$size && `margin: 8px;`}\r\n`;\r\n\r\nconst TextButtonContainer = styled.div<{ $size?: Size }>`\r\n ${(props) => props.$size && `margin: ${props.$size === Size.Small ? '8px 0 8px 16px' : props.$size === Size.Large ? '16px 0 16px 24px' : '12px 0 12px 20px'};`}\r\n ${(props) => !props.$size && `margin: 8px;`}\r\n`;\r\n\r\nconst IconButtonContainer = styled.div<{ $size?: Size }>`\r\n ${(props) => props.$size && `margin: ${props.$size === Size.Small ? '8px 16px 8px 0' : props.$size === Size.Large ? '16px 24px 16px 0' : '12px 20px 12px 0'};`}\r\n ${(props) => !props.$size && `margin: 8px;`}\r\n display: flex;\r\n`;\r\n\r\nexport const PopoverWrapper = styled.div<{ $position: Position; $showOnClick: boolean; $showPopover: boolean }>`\r\n position: relative;\r\n\r\n .pointer-space {\r\n height: ${(props) => (props.$position === Position.Top || props.$position === Position.Bottom ? '16px' : '100%')};\r\n width: ${(props) => (props.$position === Position.Left || props.$position === Position.Right ? '16px' : '100%')};\r\n position: absolute;\r\n\r\n ${(props) => (props.$position === Position.Left ? 'right:100%; bottom: 0%' : '')};\r\n ${(props) => (props.$position === Position.Right ? 'left:100%; bottom: 0%' : '')};\r\n\r\n ${(props) => (props.$position === Position.Top ? 'bottom: 100%' : '')};\r\n ${(props) => (props.$position === Position.Bottom ? 'top: 100%' : '')};\r\n }\r\n\r\n ${(props) =>\r\n props.$showOnClick\r\n ? `${PopoverContainer} {\r\n visibility: ${props.$showPopover ? 'visible' : 'hidden'};\r\n opacity: ${props.$showPopover ? '1' : '0'};\r\n }\r\n cursor: pointer;`\r\n : `&:hover {\r\n ${PopoverContainer} {\r\n visibility: visible;\r\n opacity: 1;\r\n }\r\n }`}\r\n`;\r\n\r\nconst renderMargins = (isNotePresent: boolean, size?: Size): string => {\r\n if (!size) {\r\n return isNotePresent ? '8px' : '12px 8px';\r\n }\r\n if (isNotePresent) {\r\n return size === Size.Small ? '10px 16px' : size === Size.Large ? '14px 24px' : '12px 20px';\r\n } else {\r\n return size === Size.Small ? '18px 16px' : size === Size.Large ? '24px' : '20px';\r\n }\r\n};\r\n\r\nconst renderArrowStyles = (position: Position) => {\r\n if (position === Position.Bottom) {\r\n return `height: 0px;\r\n width: 0px;\r\n border-top: 16px solid transparent;\r\n border-right: 12px solid transparent;\r\n border-bottom: 16px solid rgb(255,255,255);\r\n border-left: 12px solid transparent;\r\n content: \"\";\r\n position: absolute;\r\n right: calc(50% - 12px);\r\n bottom: calc(100% - 1px);`;\r\n }\r\n\r\n if (position === Position.Top) {\r\n return `height: 0px;\r\n width: 0px;\r\n border-top: 16px solid rgb(255,255,255);\r\n border-right: 12px solid transparent;\r\n border-bottom: 16px solid transparent;\r\n border-left: 12px solid transparent;\r\n content: \"\";\r\n position: absolute;\r\n right: calc(50% - 12px);\r\n top: calc(100% - 1px);`;\r\n }\r\n\r\n if (position === Position.Left) {\r\n return `height: 0px;\r\n width: 0px;\r\n border-top: 12px solid transparent;\r\n border-right: 16px solid transparent;\r\n border-bottom: 12px solid transparent;\r\n border-left: 16px solid rgb(255,255,255);\r\n content: \"\";\r\n position: absolute;\r\n left: calc(100% - 1px);\r\n bottom: calc(50% - 12px);`;\r\n }\r\n\r\n if (position === Position.Right) {\r\n return `height: 0px;\r\n width: 0px;\r\n border-top: 12px solid transparent;\r\n border-right: 16px solid rgb(255,255,255);\r\n border-bottom: 12px solid transparent;\r\n border-left: 16px solid transparent;\r\n content: \"\";\r\n position: absolute;\r\n right: calc(100% - 1px);\r\n bottom: calc(50% - 12px);`;\r\n }\r\n};\r\n\r\nexport interface PopoverTopSectionProps {\r\n /**\r\n * Required. The main text to be displayed in the top section of the popover.\r\n */\r\n text: string;\r\n\r\n /**\r\n * Optional. A note to be displayed below the main text in the top section of the popover.\r\n */\r\n note?: string;\r\n};\r\n\r\nexport interface PopoverActionButtonProps {\r\n /**\r\n * Required. The icon to be displayed on the button.\r\n */\r\n icon: React.ReactNode;\r\n\r\n /**\r\n * Required. The handler function to be called when the button is clicked.\r\n */\r\n action: () => void;\r\n\r\n /**\r\n * Optional. The label for the button. If provided, the button will display this text.\r\n */\r\n label?: string;\r\n};\r\n\r\nexport interface PopoverBottomSectionProps {\r\n /**\r\n * Optional. An array of PopoverActionButtonProps objects.\r\n * Each object represents an icon button to be displayed in the bottom section of the popover.\r\n */\r\n iconButtons?: PopoverActionButtonProps[];\r\n\r\n /**\r\n * Optional. A PopoverActionButtonProps object representing a text button to be displayed in the bottom section of the popover.\r\n */\r\n textButton?: PopoverActionButtonProps;\r\n};\r\n\r\nexport interface PopoverProps {\r\n /**\r\n * Optional. The size of the popover. It can be 'Small', 'Medium', or 'Large'.\r\n * Defaults to 'Medium' if not specified.\r\n */\r\n size?: Size.Small | Size.Medium | Size.Large;\r\n\r\n /**\r\n * Optional. Properties for the top section of the popover.\r\n */\r\n topSectionProps?: PopoverTopSectionProps;\r\n\r\n /**\r\n * Optional. Properties for the bottom section of the popover.\r\n */\r\n bottomSectionProps?: PopoverBottomSectionProps;\r\n\r\n /**\r\n * Required. The main content to be displayed in the popover.\r\n */\r\n mainContent: React.ReactNode;\r\n\r\n /**\r\n * Required. The children to be rendered inside the popover.\r\n */\r\n children: React.ReactNode;\r\n\r\n /**\r\n * Required. The position of the popover relative to the target element.\r\n * It can be 'Top', 'Bottom', 'Right', or 'Left'.\r\n */\r\n position: Position.Top | Position.Bottom | Position.Right | Position.Left;\r\n\r\n /**\r\n * Required. A boolean indicating whether the popover should be shown when the target element is clicked. Defaults to 'false', meaning that popover will be shown on mouse hover.\r\n */\r\n showOnClick: boolean;\r\n\r\n /**\r\n * Optional. A boolean indicating whether an arrow pointer should be shown on the popover.\r\n * Defaults to 'false' if not specified.\r\n */\r\n showArrowPointer?: boolean;\r\n};\r\n\r\nconst Popover: React.FunctionComponent<PopoverProps> = ({\r\n size,\r\n topSectionProps,\r\n bottomSectionProps,\r\n mainContent,\r\n children,\r\n position,\r\n showOnClick = false,\r\n showArrowPointer = false,\r\n}) => {\r\n const [showPopover, setShowPopover] = React.useState(false);\r\n const theme = useTheme();\r\n const popoverRef = React.useRef<any>(null);\r\n const wrapperRef = React.useRef<any>(null);\r\n\r\n React.useEffect(() => {\r\n const checkIfClickedOutside = (e: { target: any }) => {\r\n if (showPopover && popoverRef.current && !popoverRef.current.contains(e.target) && wrapperRef.current && !wrapperRef.current.contains(e.target)) {\r\n setShowPopover(false);\r\n }\r\n };\r\n\r\n document.addEventListener('mousedown', checkIfClickedOutside);\r\n\r\n return () => {\r\n document.removeEventListener('mousedown', checkIfClickedOutside);\r\n };\r\n }, [showPopover]);\r\n\r\n const handleWrapperClick = (e: React.MouseEvent) => {\r\n if (showOnClick) {\r\n e.stopPropagation();\r\n setShowPopover(!showPopover);\r\n }\r\n };\r\n\r\n return (\r\n <PopoverWrapper $position={position} $showOnClick={showOnClick} $showPopover={showPopover}>\r\n <PopoverContainer $size={size} $position={position} ref={popoverRef} $showArrowPointer={showArrowPointer}>\r\n {!!topSectionProps && (\r\n <PopoverTopSectionContainer $size={size}>\r\n <TextContainer $note={!!topSectionProps?.note} $size={size}>\r\n {topSectionProps?.note && <NoteContainer $size={size}>{topSectionProps.note}</NoteContainer>}\r\n <LabelContainer $size={size}>{topSectionProps?.text}</LabelContainer>\r\n </TextContainer>\r\n\r\n {showOnClick && (\r\n <CloseButtonContainer $size={size} data-testid={'closeBtn'}>\r\n <IconButton action={() => setShowPopover(false)} useTransparentBackground \r\n iconColor={COLORS.generateToken({ componentType: 'icon', defaultVariant: 'subtle' }, theme)} variant=\"secondary\" shape=\"circular\">\r\n <SystemIcons.Close />\r\n </IconButton>\r\n </CloseButtonContainer>\r\n )}\r\n </PopoverTopSectionContainer>\r\n )}\r\n\r\n <PopoverMiddleSectionContainer $size={size}>{mainContent}</PopoverMiddleSectionContainer>\r\n\r\n {!!bottomSectionProps && (\r\n <PopoverBottomSectionContainer $size={size}>\r\n {!!bottomSectionProps?.textButton?.icon && (\r\n <TextButtonContainer $size={size} data-testid={'textBtn'}>\r\n <TextButton size={size} variant=\"secondary\" icon={bottomSectionProps.textButton.icon} onClick={bottomSectionProps.textButton.action}>\r\n {bottomSectionProps.textButton.label}\r\n </TextButton>\r\n </TextButtonContainer>\r\n )}\r\n\r\n <div className=\"bottom-flex\" />\r\n\r\n <IconButtonContainer $size={size} data-testid={'iconBtn'}>\r\n {bottomSectionProps?.iconButtons?.map((iconButton) => (\r\n <IconButton action={iconButton.action} variant=\"secondary\" shape=\"circular\" useTransparentBackground>\r\n {iconButton.icon}\r\n </IconButton>\r\n ))}\r\n </IconButtonContainer>\r\n </PopoverBottomSectionContainer>\r\n )}\r\n </PopoverContainer>\r\n\r\n <div ref={wrapperRef} onClick={handleWrapperClick}>\r\n {children}\r\n\r\n <div className=\"pointer-space\" />\r\n </div>\r\n </PopoverWrapper>\r\n );\r\n};\r\n\r\nexport default Popover;\r\n"],"mappings":"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","ignoreList":[]}
|