npm - @laerdal/life-react-components - Versions diffs - 6.1.2-dev.1 → 6.1.3-dev.1.full - Mend

@laerdal/life-react-components 6.1.2-dev.1 → 6.1.3-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.

Files changed (11) hide show

package/dist/Card/VerticalCard/VerticalCard.cjs +3 -2
package/dist/Card/VerticalCard/VerticalCard.cjs.map +1 -1
package/dist/Card/VerticalCard/VerticalCard.d.ts +2 -2
package/dist/Card/VerticalCard/VerticalCard.js +3 -2
package/dist/Card/VerticalCard/VerticalCard.js.map +1 -1
package/dist/Card/VerticalCard/__tests__/VerticalCard.test.tsx +16 -0
package/dist/Popover/Popover.cjs +1 -0
package/dist/Popover/Popover.cjs.map +1 -1
package/dist/Popover/Popover.js +1 -0
package/dist/Popover/Popover.js.map +1 -1
package/package.json +152 -148

package/dist/Card/VerticalCard/VerticalCard.cjs CHANGED Viewed

@@ -138,7 +138,7 @@ const VerticalCard = _ref => {
   const handleCardClick = e => {
     e.preventDefault();
     if (!disabled && onCardClicked) {
-      onCardClicked();
+      onCardClicked(e);
     }
   };
   return /*#__PURE__*/(0, _jsxRuntime.jsx)(VerticalCardContainerStyles, _objectSpread(_objectSpread({
@@ -147,7 +147,7 @@ const VerticalCard = _ref => {
     className: cls,
     "aria-labelledby": `${autoId}-title`,
     tabIndex: !!onCardClicked && !disabled ? 0 : -1,
-    onKeyDown: e => e.key === 'Enter' && !disabled && onCardClicked && onCardClicked(),
+    onKeyDown: e => e.key === 'Enter' && !disabled && onCardClicked && onCardClicked(e),
     "data-testid": 'card-wrapper'
   }, rest), {}, {
     children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(VerticalCardTopLevelContainerStyles, {
@@ -158,6 +158,7 @@ const VerticalCard = _ref => {
         href: '#',
         "data-testid": 'card-link',
         onClick: handleCardClick,
+        onAuxClick: handleCardClick,
         "aria-labelledby": `${autoId}-title`,
         tabIndex: -1
       }), topSectionProps && /*#__PURE__*/(0, _jsxRuntime.jsx)(_VerticalCardTopSection.default, _objectSpread(_objectSpread({

package/dist/Card/VerticalCard/VerticalCard.cjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"VerticalCard.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_VerticalCardTopSection","_VerticalCardMiddleSection","_VerticalCardBottomSection","_index","_jsxRuntime","_excluded","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","VerticalCardTopLevelContainerStyles","exports","styled","div","props","COLORS","generateToken","componentType","defaultVariant","theme","BOXSHADOWS","BOXSHADOW_L1","VerticalCardLink","focusStyles","VerticalCardContainerStyles","state","BOXSHADOW_L3","BOXSHADOW_L2","VerticalCard","_ref","onCardClicked","topSectionProps","middleSectionProps","bottomSectionProps","disabled","variant","className","id","maxWidth","rest","_objectWithoutProperties2","actionsRefs","setActionsRefs","useState","checkBoxRef","useRef","containerRef","autoId","useId","useActionWithin","cls","handleCardClick","preventDefault","jsx","ref","role","tabIndex","onKeyDown","key","children","jsxs","style","href","onClick","componentId","instance","propTypes","_propTypes","func","bool","oneOfType","number","string","oneOf","_default"],"sources":["../../../src/Card/VerticalCard/VerticalCard.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport VerticalCardTopSection, {VerticalCardTopSectionProps} from './VerticalCardTopSection';\r\nimport VerticalCardMiddleSection, {VerticalCardMiddleSectionProps} from './VerticalCardMiddleSection';\r\nimport VerticalCardBottomSection, {VerticalCardBottomSectionProps} from './VerticalCardBottomSection';\r\nimport {BOXSHADOWS, COLORS, defaultOnMouseDownHandler, focusStyles, useActionWithin} from '../../index';\r\n\r\nexport const VerticalCardTopLevelContainerStyles = styled.div`\r\n background-color: ${props => COLORS.generateToken({componentType:'bg-surface', defaultVariant:'default'}, props.theme)};\r\n min-width: 240px;\r\n overflow: hidden;\r\n\r\n border-radius: 8px;\r\n\r\n background-clip: padding-box;\r\n box-sizing: border-box;\r\n display: flex;\r\n flex-direction: column;\r\n position: relative;\r\n\r\n .elevated & {\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L1};\r\n }\r\n\r\n .outline & {\r\n border: 1px solid ${props => COLORS.generateToken({componentType:'border', defaultVariant: 'subtle'}, props.theme)};\r\n }\r\n`;\r\n\r\n// Full-card link that covers the entire card area\r\nexport const VerticalCardLink = styled.a`\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n z-index: 100;\r\n text-decoration: none;\r\n color: inherit;\r\n pointer-events: auto;\r\n cursor: pointer;\r\n \r\n &:focus {\r\n outline: none;\r\n }\r\n \r\n &:focus-visible {\r\n ${focusStyles}\r\n }\r\n`;\r\n\r\nexport const VerticalCardContainerStyles = styled.div`\r\n &.interactive:not(.disabled) {\r\n &:focus {\r\n ${focusStyles}\r\n }\r\n\r\n &:not(.action-within) {\r\n ${VerticalCardTopLevelContainerStyles} {\r\n &:hover {\r\n background-color: ${props => COLORS.generateToken({componentType:'bg-surface', state:'hover'}, props.theme)};\r\n }\r\n\r\n &:active, &.active-state {\r\n background-color: ${props => COLORS.generateToken({componentType:'bg-surface', state:'active'}, props.theme)};\r\n }\r\n }\r\n }\r\n\r\n &.elevated:not(.action-within) {\r\n ${VerticalCardTopLevelContainerStyles} {\r\n &:hover {\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L3};\r\n }\r\n\r\n &:active, &.active-state {\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.disabled {\r\n cursor: not-allowed;\r\n ${VerticalCardTopLevelContainerStyles}{\r\n border: 1px solid ${props => COLORS.generateToken({componentType:'border', state:'disabled'}, props.theme)};\r\n }\r\n }\r\n`;\r\n\r\n\r\nexport interface VerticalCardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'tabIndex' \| 'onMouseDown' \| 'onKeyDown' \| 'onClick'> {\r\n /** Action to be executed when Card is clicked. /\r\n onCardClicked?: () => void;\r\n /* If disabled then users can not click on the card, also styles are greyed out./\r\n disabled?: boolean;\r\n /* Maximum width of the card. /\r\n maxWidth?: number \| string;\r\n /* Properties of Card top section. /\r\n topSectionProps?: VerticalCardTopSectionProps;\r\n /* Properties of Card middle section. /\r\n middleSectionProps?: VerticalCardMiddleSectionProps;\r\n /* Properties of Card bottom section. /\r\n bottomSectionProps?: VerticalCardBottomSectionProps;\r\n /* Card container style variant. /\r\n variant?: 'outline' \| 'elevated';\r\n}\r\n\r\nconst VerticalCard: React.FunctionComponent<VerticalCardProps> = ({\r\n onCardClicked,\r\n topSectionProps,\r\n middleSectionProps,\r\n bottomSectionProps,\r\n disabled,\r\n variant = 'elevated',\r\n className,\r\n id,\r\n maxWidth = 560,\r\n ...rest\r\n }: VerticalCardProps) => {\r\n\r\n\r\n const [actionsRefs, setActionsRefs] = React.useState<React.RefObject<HTMLElement \| null>[]>([]);\r\n const checkBoxRef = React.useRef<HTMLDivElement>(null);\r\n const containerRef = React.useRef<HTMLDivElement>(null);\r\n const autoId = React.useId();\r\n\r\n useActionWithin(containerRef, [...actionsRefs, checkBoxRef]);\r\n\r\n const cls = `${!!onCardClicked ? 'interactive' : ''} ${disabled ? 'disabled' : ''} ${variant} ${className \|\| ''}`;\r\n\r\n const handleCardClick = (e: React.MouseEvent) => {\r\n e.preventDefault();\r\n if (!disabled && onCardClicked) {\r\n onCardClicked();\r\n }\r\n };\r\n\r\n return (\r\n <VerticalCardContainerStyles ref={containerRef}\r\n role=\"group\"\r\n className={cls}\r\n aria-labelledby={`${autoId}-title`}\r\n tabIndex={!!onCardClicked && !disabled ? 0 : -1}\r\n onKeyDown={e => e.key === 'Enter' && !disabled && onCardClicked && onCardClicked()}\r\n data-testid={'card-wrapper'}\r\n {...rest}>\r\n <VerticalCardTopLevelContainerStyles style={{maxWidth: maxWidth}}>\r\n {/ Full-card link for accessibility */}\r\n {onCardClicked && !disabled && (\r\n <VerticalCardLink\r\n href={'#'}\r\n data-testid={'card-link'}\r\n onClick={handleCardClick}\r\n aria-labelledby={`${autoId}-title`}\r\n tabIndex={-1}\r\n />\r\n )}\r\n \r\n {\r\n topSectionProps &&\r\n <VerticalCardTopSection ref={checkBoxRef}\r\n {...topSectionProps} disabled={disabled}/>\r\n }\r\n {\r\n middleSectionProps &&\r\n <VerticalCardMiddleSection {...middleSectionProps} componentId={autoId} disabled={disabled}/>\r\n }\r\n {\r\n bottomSectionProps &&\r\n <VerticalCardBottomSection ref={instance => {\r\n setActionsRefs(instance ?? []);\r\n }}\r\n {...bottomSectionProps} disabled={disabled}/>\r\n }\r\n </VerticalCardTopLevelContainerStyles>\r\n </VerticalCardContainerStyles>\r\n );\r\n};\r\n\r\nexport default VerticalCard;\r\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"VerticalCard.cjs","names":["React","_interopRequireWildcard","require","_styledComponents","_interopRequireDefault","_VerticalCardTopSection","_VerticalCardMiddleSection","_VerticalCardBottomSection","_index","_jsxRuntime","_excluded","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","VerticalCardTopLevelContainerStyles","exports","styled","div","props","COLORS","generateToken","componentType","defaultVariant","theme","BOXSHADOWS","BOXSHADOW_L1","VerticalCardLink","focusStyles","VerticalCardContainerStyles","state","BOXSHADOW_L3","BOXSHADOW_L2","VerticalCard","_ref","onCardClicked","topSectionProps","middleSectionProps","bottomSectionProps","disabled","variant","className","id","maxWidth","rest","_objectWithoutProperties2","actionsRefs","setActionsRefs","useState","checkBoxRef","useRef","containerRef","autoId","useId","useActionWithin","cls","handleCardClick","preventDefault","jsx","ref","role","tabIndex","onKeyDown","key","children","jsxs","style","href","onClick","onAuxClick","componentId","instance","propTypes","_propTypes","func","bool","oneOfType","number","string","oneOf","_default"],"sources":["../../../src/Card/VerticalCard/VerticalCard.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport VerticalCardTopSection, {VerticalCardTopSectionProps} from './VerticalCardTopSection';\r\nimport VerticalCardMiddleSection, {VerticalCardMiddleSectionProps} from './VerticalCardMiddleSection';\r\nimport VerticalCardBottomSection, {VerticalCardBottomSectionProps} from './VerticalCardBottomSection';\r\nimport {BOXSHADOWS, COLORS, defaultOnMouseDownHandler, focusStyles, useActionWithin} from '../../index';\r\n\r\nexport const VerticalCardTopLevelContainerStyles = styled.div`\r\n background-color: ${props => COLORS.generateToken({componentType:'bg-surface', defaultVariant:'default'}, props.theme)};\r\n min-width: 240px;\r\n overflow: hidden;\r\n\r\n border-radius: 8px;\r\n\r\n background-clip: padding-box;\r\n box-sizing: border-box;\r\n display: flex;\r\n flex-direction: column;\r\n position: relative;\r\n\r\n .elevated & {\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L1};\r\n }\r\n\r\n .outline & {\r\n border: 1px solid ${props => COLORS.generateToken({componentType:'border', defaultVariant: 'subtle'}, props.theme)};\r\n }\r\n`;\r\n\r\n// Full-card link that covers the entire card area\r\nexport const VerticalCardLink = styled.a`\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n z-index: 100;\r\n text-decoration: none;\r\n color: inherit;\r\n pointer-events: auto;\r\n cursor: pointer;\r\n \r\n &:focus {\r\n outline: none;\r\n }\r\n \r\n &:focus-visible {\r\n ${focusStyles}\r\n }\r\n`;\r\n\r\nexport const VerticalCardContainerStyles = styled.div`\r\n &.interactive:not(.disabled) {\r\n &:focus {\r\n ${focusStyles}\r\n }\r\n\r\n &:not(.action-within) {\r\n ${VerticalCardTopLevelContainerStyles} {\r\n &:hover {\r\n background-color: ${props => COLORS.generateToken({componentType:'bg-surface', state:'hover'}, props.theme)};\r\n }\r\n\r\n &:active, &.active-state {\r\n background-color: ${props => COLORS.generateToken({componentType:'bg-surface', state:'active'}, props.theme)};\r\n }\r\n }\r\n }\r\n\r\n &.elevated:not(.action-within) {\r\n ${VerticalCardTopLevelContainerStyles} {\r\n &:hover {\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L3};\r\n }\r\n\r\n &:active, &.active-state {\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.disabled {\r\n cursor: not-allowed;\r\n ${VerticalCardTopLevelContainerStyles}{\r\n border: 1px solid ${props => COLORS.generateToken({componentType:'border', state:'disabled'}, props.theme)};\r\n }\r\n }\r\n`;\r\n\r\n\r\nexport interface VerticalCardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'tabIndex' \| 'onMouseDown' \| 'onKeyDown' \| 'onClick'> {\r\n /** Action to be executed when Card is clicked. The event is passed to provide click details (e.g., which mouse button was used). /\r\n onCardClicked?: (e: React.MouseEvent \| React.KeyboardEvent) => void;\r\n /* If disabled then users can not click on the card, also styles are greyed out./\r\n disabled?: boolean;\r\n /* Maximum width of the card. /\r\n maxWidth?: number \| string;\r\n /* Properties of Card top section. /\r\n topSectionProps?: VerticalCardTopSectionProps;\r\n /* Properties of Card middle section. /\r\n middleSectionProps?: VerticalCardMiddleSectionProps;\r\n /* Properties of Card bottom section. /\r\n bottomSectionProps?: VerticalCardBottomSectionProps;\r\n /* Card container style variant. /\r\n variant?: 'outline' \| 'elevated';\r\n}\r\n\r\nconst VerticalCard: React.FunctionComponent<VerticalCardProps> = ({\r\n onCardClicked,\r\n topSectionProps,\r\n middleSectionProps,\r\n bottomSectionProps,\r\n disabled,\r\n variant = 'elevated',\r\n className,\r\n id,\r\n maxWidth = 560,\r\n ...rest\r\n }: VerticalCardProps) => {\r\n\r\n\r\n const [actionsRefs, setActionsRefs] = React.useState<React.RefObject<HTMLElement \| null>[]>([]);\r\n const checkBoxRef = React.useRef<HTMLDivElement>(null);\r\n const containerRef = React.useRef<HTMLDivElement>(null);\r\n const autoId = React.useId();\r\n\r\n useActionWithin(containerRef, [...actionsRefs, checkBoxRef]);\r\n\r\n const cls = `${!!onCardClicked ? 'interactive' : ''} ${disabled ? 'disabled' : ''} ${variant} ${className \|\| ''}`;\r\n\r\n const handleCardClick = (e: React.MouseEvent) => {\r\n e.preventDefault();\r\n if (!disabled && onCardClicked) {\r\n onCardClicked(e);\r\n }\r\n };\r\n\r\n return (\r\n <VerticalCardContainerStyles ref={containerRef}\r\n role=\"group\"\r\n className={cls}\r\n aria-labelledby={`${autoId}-title`}\r\n tabIndex={!!onCardClicked && !disabled ? 0 : -1}\r\n onKeyDown={e => e.key === 'Enter' && !disabled && onCardClicked && onCardClicked(e)}\r\n data-testid={'card-wrapper'}\r\n {...rest}>\r\n <VerticalCardTopLevelContainerStyles style={{maxWidth: maxWidth}}>\r\n {/ Full-card link for accessibility */}\r\n {onCardClicked && !disabled && (\r\n <VerticalCardLink\r\n href={'#'}\r\n data-testid={'card-link'}\r\n onClick={handleCardClick}\r\n onAuxClick={handleCardClick}\r\n aria-labelledby={`${autoId}-title`}\r\n tabIndex={-1}\r\n />\r\n )}\r\n \r\n {\r\n topSectionProps &&\r\n <VerticalCardTopSection ref={checkBoxRef}\r\n {...topSectionProps} disabled={disabled}/>\r\n }\r\n {\r\n middleSectionProps &&\r\n <VerticalCardMiddleSection {...middleSectionProps} componentId={autoId} disabled={disabled}/>\r\n }\r\n {\r\n bottomSectionProps &&\r\n <VerticalCardBottomSection ref={instance => {\r\n setActionsRefs(instance ?? []);\r\n }}\r\n {...bottomSectionProps} disabled={disabled}/>\r\n }\r\n </VerticalCardTopLevelContainerStyles>\r\n </VerticalCardContainerStyles>\r\n );\r\n};\r\n\r\nexport default VerticalCard;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/Card/VerticalCard/VerticalCard.d.ts CHANGED Viewed

@@ -6,8 +6,8 @@ export declare const VerticalCardTopLevelContainerStyles: import("styled-compone
 export declare const VerticalCardLink: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.AnchorHTMLAttributes<HTMLAnchorElement>, HTMLAnchorElement>, never>> & string;
 export declare const VerticalCardContainerStyles: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export interface VerticalCardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'tabIndex' | 'onMouseDown' | 'onKeyDown' | 'onClick'> {
-    /** Action to be executed when Card is clicked. */
-    onCardClicked?: () => void;
+    /** Action to be executed when Card is clicked. The event is passed to provide click details (e.g., which mouse button was used). */
+    onCardClicked?: (e: React.MouseEvent | React.KeyboardEvent) => void;
     /** If disabled then users can not click on the card, also styles are greyed out.*/
     disabled?: boolean;
     /** Maximum width of the card. */

package/dist/Card/VerticalCard/VerticalCard.js CHANGED Viewed

@@ -129,7 +129,7 @@ const VerticalCard = _ref => {
   const handleCardClick = e => {
     e.preventDefault();
     if (!disabled && onCardClicked) {
-      onCardClicked();
+      onCardClicked(e);
     }
   };
   return /*#__PURE__*/_jsx(VerticalCardContainerStyles, _objectSpread(_objectSpread({
@@ -138,7 +138,7 @@ const VerticalCard = _ref => {
     className: cls,
     "aria-labelledby": `${autoId}-title`,
     tabIndex: !!onCardClicked && !disabled ? 0 : -1,
-    onKeyDown: e => e.key === 'Enter' && !disabled && onCardClicked && onCardClicked(),
+    onKeyDown: e => e.key === 'Enter' && !disabled && onCardClicked && onCardClicked(e),
     "data-testid": 'card-wrapper'
   }, rest), {}, {
     children: /*#__PURE__*/_jsxs(VerticalCardTopLevelContainerStyles, {
@@ -149,6 +149,7 @@ const VerticalCard = _ref => {
         href: '#',
         "data-testid": 'card-link',
         onClick: handleCardClick,
+        onAuxClick: handleCardClick,
         "aria-labelledby": `${autoId}-title`,
         tabIndex: -1
       }), topSectionProps && /*#__PURE__*/_jsx(VerticalCardTopSection, _objectSpread(_objectSpread({

package/dist/Card/VerticalCard/VerticalCard.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"VerticalCard.js","names":["React","styled","VerticalCardTopSection","VerticalCardMiddleSection","VerticalCardBottomSection","BOXSHADOWS","COLORS","focusStyles","useActionWithin","jsx","_jsx","jsxs","_jsxs","VerticalCardTopLevelContainerStyles","div","props","generateToken","componentType","defaultVariant","theme","BOXSHADOW_L1","VerticalCardLink","a","VerticalCardContainerStyles","state","BOXSHADOW_L3","BOXSHADOW_L2","VerticalCard","_ref","onCardClicked","topSectionProps","middleSectionProps","bottomSectionProps","disabled","variant","className","id","maxWidth","rest","_objectWithoutProperties","_excluded","actionsRefs","setActionsRefs","useState","checkBoxRef","useRef","containerRef","autoId","useId","cls","handleCardClick","e","preventDefault","_objectSpread","ref","role","tabIndex","onKeyDown","key","children","style","href","onClick","componentId","instance","propTypes","_pt","func","bool","oneOfType","number","string","oneOf"],"sources":["../../../src/Card/VerticalCard/VerticalCard.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport VerticalCardTopSection, {VerticalCardTopSectionProps} from './VerticalCardTopSection';\r\nimport VerticalCardMiddleSection, {VerticalCardMiddleSectionProps} from './VerticalCardMiddleSection';\r\nimport VerticalCardBottomSection, {VerticalCardBottomSectionProps} from './VerticalCardBottomSection';\r\nimport {BOXSHADOWS, COLORS, defaultOnMouseDownHandler, focusStyles, useActionWithin} from '../../index';\r\n\r\nexport const VerticalCardTopLevelContainerStyles = styled.div`\r\n background-color: ${props => COLORS.generateToken({componentType:'bg-surface', defaultVariant:'default'}, props.theme)};\r\n min-width: 240px;\r\n overflow: hidden;\r\n\r\n border-radius: 8px;\r\n\r\n background-clip: padding-box;\r\n box-sizing: border-box;\r\n display: flex;\r\n flex-direction: column;\r\n position: relative;\r\n\r\n .elevated & {\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L1};\r\n }\r\n\r\n .outline & {\r\n border: 1px solid ${props => COLORS.generateToken({componentType:'border', defaultVariant: 'subtle'}, props.theme)};\r\n }\r\n`;\r\n\r\n// Full-card link that covers the entire card area\r\nexport const VerticalCardLink = styled.a`\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n z-index: 100;\r\n text-decoration: none;\r\n color: inherit;\r\n pointer-events: auto;\r\n cursor: pointer;\r\n \r\n &:focus {\r\n outline: none;\r\n }\r\n \r\n &:focus-visible {\r\n ${focusStyles}\r\n }\r\n`;\r\n\r\nexport const VerticalCardContainerStyles = styled.div`\r\n &.interactive:not(.disabled) {\r\n &:focus {\r\n ${focusStyles}\r\n }\r\n\r\n &:not(.action-within) {\r\n ${VerticalCardTopLevelContainerStyles} {\r\n &:hover {\r\n background-color: ${props => COLORS.generateToken({componentType:'bg-surface', state:'hover'}, props.theme)};\r\n }\r\n\r\n &:active, &.active-state {\r\n background-color: ${props => COLORS.generateToken({componentType:'bg-surface', state:'active'}, props.theme)};\r\n }\r\n }\r\n }\r\n\r\n &.elevated:not(.action-within) {\r\n ${VerticalCardTopLevelContainerStyles} {\r\n &:hover {\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L3};\r\n }\r\n\r\n &:active, &.active-state {\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.disabled {\r\n cursor: not-allowed;\r\n ${VerticalCardTopLevelContainerStyles}{\r\n border: 1px solid ${props => COLORS.generateToken({componentType:'border', state:'disabled'}, props.theme)};\r\n }\r\n }\r\n`;\r\n\r\n\r\nexport interface VerticalCardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'tabIndex' \| 'onMouseDown' \| 'onKeyDown' \| 'onClick'> {\r\n /** Action to be executed when Card is clicked. /\r\n onCardClicked?: () => void;\r\n /* If disabled then users can not click on the card, also styles are greyed out./\r\n disabled?: boolean;\r\n /* Maximum width of the card. /\r\n maxWidth?: number \| string;\r\n /* Properties of Card top section. /\r\n topSectionProps?: VerticalCardTopSectionProps;\r\n /* Properties of Card middle section. /\r\n middleSectionProps?: VerticalCardMiddleSectionProps;\r\n /* Properties of Card bottom section. /\r\n bottomSectionProps?: VerticalCardBottomSectionProps;\r\n /* Card container style variant. /\r\n variant?: 'outline' \| 'elevated';\r\n}\r\n\r\nconst VerticalCard: React.FunctionComponent<VerticalCardProps> = ({\r\n onCardClicked,\r\n topSectionProps,\r\n middleSectionProps,\r\n bottomSectionProps,\r\n disabled,\r\n variant = 'elevated',\r\n className,\r\n id,\r\n maxWidth = 560,\r\n ...rest\r\n }: VerticalCardProps) => {\r\n\r\n\r\n const [actionsRefs, setActionsRefs] = React.useState<React.RefObject<HTMLElement \| null>[]>([]);\r\n const checkBoxRef = React.useRef<HTMLDivElement>(null);\r\n const containerRef = React.useRef<HTMLDivElement>(null);\r\n const autoId = React.useId();\r\n\r\n useActionWithin(containerRef, [...actionsRefs, checkBoxRef]);\r\n\r\n const cls = `${!!onCardClicked ? 'interactive' : ''} ${disabled ? 'disabled' : ''} ${variant} ${className \|\| ''}`;\r\n\r\n const handleCardClick = (e: React.MouseEvent) => {\r\n e.preventDefault();\r\n if (!disabled && onCardClicked) {\r\n onCardClicked();\r\n }\r\n };\r\n\r\n return (\r\n <VerticalCardContainerStyles ref={containerRef}\r\n role=\"group\"\r\n className={cls}\r\n aria-labelledby={`${autoId}-title`}\r\n tabIndex={!!onCardClicked && !disabled ? 0 : -1}\r\n onKeyDown={e => e.key === 'Enter' && !disabled && onCardClicked && onCardClicked()}\r\n data-testid={'card-wrapper'}\r\n {...rest}>\r\n <VerticalCardTopLevelContainerStyles style={{maxWidth: maxWidth}}>\r\n {/ Full-card link for accessibility */}\r\n {onCardClicked && !disabled && (\r\n <VerticalCardLink\r\n href={'#'}\r\n data-testid={'card-link'}\r\n onClick={handleCardClick}\r\n aria-labelledby={`${autoId}-title`}\r\n tabIndex={-1}\r\n />\r\n )}\r\n \r\n {\r\n topSectionProps &&\r\n <VerticalCardTopSection ref={checkBoxRef}\r\n {...topSectionProps} disabled={disabled}/>\r\n }\r\n {\r\n middleSectionProps &&\r\n <VerticalCardMiddleSection {...middleSectionProps} componentId={autoId} disabled={disabled}/>\r\n }\r\n {\r\n bottomSectionProps &&\r\n <VerticalCardBottomSection ref={instance => {\r\n setActionsRefs(instance ?? []);\r\n }}\r\n {...bottomSectionProps} disabled={disabled}/>\r\n }\r\n </VerticalCardTopLevelContainerStyles>\r\n </VerticalCardContainerStyles>\r\n );\r\n};\r\n\r\nexport default VerticalCard;\r\n"],"mappings":"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","ignoreList":[]}
1	+ {"version":3,"file":"VerticalCard.js","names":["React","styled","VerticalCardTopSection","VerticalCardMiddleSection","VerticalCardBottomSection","BOXSHADOWS","COLORS","focusStyles","useActionWithin","jsx","_jsx","jsxs","_jsxs","VerticalCardTopLevelContainerStyles","div","props","generateToken","componentType","defaultVariant","theme","BOXSHADOW_L1","VerticalCardLink","a","VerticalCardContainerStyles","state","BOXSHADOW_L3","BOXSHADOW_L2","VerticalCard","_ref","onCardClicked","topSectionProps","middleSectionProps","bottomSectionProps","disabled","variant","className","id","maxWidth","rest","_objectWithoutProperties","_excluded","actionsRefs","setActionsRefs","useState","checkBoxRef","useRef","containerRef","autoId","useId","cls","handleCardClick","e","preventDefault","_objectSpread","ref","role","tabIndex","onKeyDown","key","children","style","href","onClick","onAuxClick","componentId","instance","propTypes","_pt","func","bool","oneOfType","number","string","oneOf"],"sources":["../../../src/Card/VerticalCard/VerticalCard.tsx"],"sourcesContent":["import * as React from 'react';\r\nimport styled from 'styled-components';\r\nimport VerticalCardTopSection, {VerticalCardTopSectionProps} from './VerticalCardTopSection';\r\nimport VerticalCardMiddleSection, {VerticalCardMiddleSectionProps} from './VerticalCardMiddleSection';\r\nimport VerticalCardBottomSection, {VerticalCardBottomSectionProps} from './VerticalCardBottomSection';\r\nimport {BOXSHADOWS, COLORS, defaultOnMouseDownHandler, focusStyles, useActionWithin} from '../../index';\r\n\r\nexport const VerticalCardTopLevelContainerStyles = styled.div`\r\n background-color: ${props => COLORS.generateToken({componentType:'bg-surface', defaultVariant:'default'}, props.theme)};\r\n min-width: 240px;\r\n overflow: hidden;\r\n\r\n border-radius: 8px;\r\n\r\n background-clip: padding-box;\r\n box-sizing: border-box;\r\n display: flex;\r\n flex-direction: column;\r\n position: relative;\r\n\r\n .elevated & {\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L1};\r\n }\r\n\r\n .outline & {\r\n border: 1px solid ${props => COLORS.generateToken({componentType:'border', defaultVariant: 'subtle'}, props.theme)};\r\n }\r\n`;\r\n\r\n// Full-card link that covers the entire card area\r\nexport const VerticalCardLink = styled.a`\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n z-index: 100;\r\n text-decoration: none;\r\n color: inherit;\r\n pointer-events: auto;\r\n cursor: pointer;\r\n \r\n &:focus {\r\n outline: none;\r\n }\r\n \r\n &:focus-visible {\r\n ${focusStyles}\r\n }\r\n`;\r\n\r\nexport const VerticalCardContainerStyles = styled.div`\r\n &.interactive:not(.disabled) {\r\n &:focus {\r\n ${focusStyles}\r\n }\r\n\r\n &:not(.action-within) {\r\n ${VerticalCardTopLevelContainerStyles} {\r\n &:hover {\r\n background-color: ${props => COLORS.generateToken({componentType:'bg-surface', state:'hover'}, props.theme)};\r\n }\r\n\r\n &:active, &.active-state {\r\n background-color: ${props => COLORS.generateToken({componentType:'bg-surface', state:'active'}, props.theme)};\r\n }\r\n }\r\n }\r\n\r\n &.elevated:not(.action-within) {\r\n ${VerticalCardTopLevelContainerStyles} {\r\n &:hover {\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L3};\r\n }\r\n\r\n &:active, &.active-state {\r\n box-shadow: ${BOXSHADOWS.BOXSHADOW_L2};\r\n }\r\n }\r\n }\r\n }\r\n\r\n &.disabled {\r\n cursor: not-allowed;\r\n ${VerticalCardTopLevelContainerStyles}{\r\n border: 1px solid ${props => COLORS.generateToken({componentType:'border', state:'disabled'}, props.theme)};\r\n }\r\n }\r\n`;\r\n\r\n\r\nexport interface VerticalCardProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'tabIndex' \| 'onMouseDown' \| 'onKeyDown' \| 'onClick'> {\r\n /** Action to be executed when Card is clicked. The event is passed to provide click details (e.g., which mouse button was used). /\r\n onCardClicked?: (e: React.MouseEvent \| React.KeyboardEvent) => void;\r\n /* If disabled then users can not click on the card, also styles are greyed out./\r\n disabled?: boolean;\r\n /* Maximum width of the card. /\r\n maxWidth?: number \| string;\r\n /* Properties of Card top section. /\r\n topSectionProps?: VerticalCardTopSectionProps;\r\n /* Properties of Card middle section. /\r\n middleSectionProps?: VerticalCardMiddleSectionProps;\r\n /* Properties of Card bottom section. /\r\n bottomSectionProps?: VerticalCardBottomSectionProps;\r\n /* Card container style variant. /\r\n variant?: 'outline' \| 'elevated';\r\n}\r\n\r\nconst VerticalCard: React.FunctionComponent<VerticalCardProps> = ({\r\n onCardClicked,\r\n topSectionProps,\r\n middleSectionProps,\r\n bottomSectionProps,\r\n disabled,\r\n variant = 'elevated',\r\n className,\r\n id,\r\n maxWidth = 560,\r\n ...rest\r\n }: VerticalCardProps) => {\r\n\r\n\r\n const [actionsRefs, setActionsRefs] = React.useState<React.RefObject<HTMLElement \| null>[]>([]);\r\n const checkBoxRef = React.useRef<HTMLDivElement>(null);\r\n const containerRef = React.useRef<HTMLDivElement>(null);\r\n const autoId = React.useId();\r\n\r\n useActionWithin(containerRef, [...actionsRefs, checkBoxRef]);\r\n\r\n const cls = `${!!onCardClicked ? 'interactive' : ''} ${disabled ? 'disabled' : ''} ${variant} ${className \|\| ''}`;\r\n\r\n const handleCardClick = (e: React.MouseEvent) => {\r\n e.preventDefault();\r\n if (!disabled && onCardClicked) {\r\n onCardClicked(e);\r\n }\r\n };\r\n\r\n return (\r\n <VerticalCardContainerStyles ref={containerRef}\r\n role=\"group\"\r\n className={cls}\r\n aria-labelledby={`${autoId}-title`}\r\n tabIndex={!!onCardClicked && !disabled ? 0 : -1}\r\n onKeyDown={e => e.key === 'Enter' && !disabled && onCardClicked && onCardClicked(e)}\r\n data-testid={'card-wrapper'}\r\n {...rest}>\r\n <VerticalCardTopLevelContainerStyles style={{maxWidth: maxWidth}}>\r\n {/ Full-card link for accessibility */}\r\n {onCardClicked && !disabled && (\r\n <VerticalCardLink\r\n href={'#'}\r\n data-testid={'card-link'}\r\n onClick={handleCardClick}\r\n onAuxClick={handleCardClick}\r\n aria-labelledby={`${autoId}-title`}\r\n tabIndex={-1}\r\n />\r\n )}\r\n \r\n {\r\n topSectionProps &&\r\n <VerticalCardTopSection ref={checkBoxRef}\r\n {...topSectionProps} disabled={disabled}/>\r\n }\r\n {\r\n middleSectionProps &&\r\n <VerticalCardMiddleSection {...middleSectionProps} componentId={autoId} disabled={disabled}/>\r\n }\r\n {\r\n bottomSectionProps &&\r\n <VerticalCardBottomSection ref={instance => {\r\n setActionsRefs(instance ?? []);\r\n }}\r\n {...bottomSectionProps} disabled={disabled}/>\r\n }\r\n </VerticalCardTopLevelContainerStyles>\r\n </VerticalCardContainerStyles>\r\n );\r\n};\r\n\r\nexport default VerticalCard;\r\n"],"mappings":"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","ignoreList":[]}

package/dist/Card/VerticalCard/__tests__/VerticalCard.test.tsx CHANGED Viewed

@@ -39,6 +39,21 @@ describe('<VerticalCard />',()=>{
         fireEvent.click(getByTestId('card-link'));
         expect(cardClicked).toHaveBeenCalled();
+        expect(cardClicked.mock.calls[0][0]).toBeDefined();
+    });
+    it('fires card clicked event on middle mouse click and prevents default', async () => {
+        const cardClicked = jest.fn();
+        const{getByTestId} = render(
+            <VerticalCard bottomSectionProps={{disabled:false}} disabled={false} onCardClicked={cardClicked}/>
+        );
+        const link = getByTestId('card-link');
+        const auxClickEvent = new MouseEvent('auxclick', { bubbles: true, button: 1 });
+        const preventDefaultSpy = jest.spyOn(auxClickEvent, 'preventDefault');
+        link.dispatchEvent(auxClickEvent);
+        expect(cardClicked).toHaveBeenCalled();
+        expect(preventDefaultSpy).toHaveBeenCalled();
     });
     it('fires card clicked event on keyDown', async () => {
@@ -49,6 +64,7 @@ describe('<VerticalCard />',()=>{
         fireEvent.keyDown(getByTestId('card-wrapper'), {key: 'Enter', code: 'Enter', charCode: 13});
         expect(cardClicked).toHaveBeenCalled();
+        expect(cardClicked.mock.calls[0][0]).toBeDefined();
     });
     it('renders tag in top section', async () => {

package/dist/Popover/Popover.cjs CHANGED Viewed

@@ -41,6 +41,7 @@ const PopoverContainer = exports.PopoverContainer = _styledComponents.default.di
   &::after {
     ${props => props.$showArrowPointer ? renderArrowStyles(props.$position) : ''}
+  }
 `;
 const PopoverTopSectionContainer = exports.PopoverTopSectionContainer = _styledComponents.default.div`
   ${props => props.$size && `height: ${props.$size === _types.Size.Small ? '56px' : props.$size === _types.Size.Large ? '72px' : '64px'};`}

package/dist/Popover/Popover.cjs.map CHANGED Viewed

	@@ -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","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\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":";;;;;;;;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,GAAsE;AAC7G,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,IAAKJ,KAAK,IAAKA,KAAK,CAACC,KAAK,IAAI,cAAcD,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACC,KAAK,GAAG,OAAO,GAAGH,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACE,KAAK,GAAG,OAAO,GAAG,OAAO,GAAG;AACpI,WAAYJ,KAAK,IAAK,CAACA,KAAK,CAACC,KAAK,GAAG,aAAa,GAAG,MAAM;AAC3D;AACA,gBAAgBD,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,GAAqB;AACtE,IAAKC,KAAK,IAAKA,KAAK,CAACC,KAAK,IAAI,WAAWD,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACC,KAAK,GAAG,MAAM,GAAGH,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACE,KAAK,GAAG,MAAM,GAAG,MAAM,GAAG;AAC9H;AACA,CAAC;AAEM,MAAMmB,6BAA6B,GAAA1B,OAAA,CAAA0B,6BAAA,GAAGzB,yBAAM,CAACC,GAAqB;AACzE;AACA,IAAKC,KAAK,IAAKA,KAAK,CAACC,KAAK,IAAI,WAAWD,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACC,KAAK,GAAG,OAAO,GAAGH,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACE,KAAK,GAAG,OAAO,GAAG,OAAO,GAAG;AACjI,IAAKJ,KAAK,IAAKA,KAAK,CAACC,KAAK,IAAI,YAAYD,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACC,KAAK,GAAG,OAAO,GAAGH,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACE,KAAK,GAAG,QAAQ,GAAG,QAAQ,GAAG;AACpI,IAAKJ,KAAK,IAAK,CAACA,KAAK,CAACC,KAAK,IAAI,eAAe;AAC9C,IAAKD,KAAK,IAAKA,KAAK,CAACC,KAAK,IAAI,mBAAmB;AACjD,IAAKD,KAAK,IAAKA,KAAK,CAACC,KAAK,IAAI,IAAAuB,wBAAgB,EAACtB,WAAI,CAACC,KAAK,CAAC;AAC1D,CAAC;AAEM,MAAMsB,6BAA6B,GAAA5B,OAAA,CAAA4B,6BAAA,GAAG3B,yBAAM,CAACC,GAAqB;AACzE,IAAKC,KAAK,IAAKA,KAAK,CAACC,KAAK,IAAI,WAAWD,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACC,KAAK,GAAG,MAAM,GAAGH,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACE,KAAK,GAAG,MAAM,GAAG,MAAM,GAAG;AAC9H;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,MAAMsB,aAAa,GAAG5B,yBAAM,CAACC,GAAqC;AAClE;AACA;AACA,WAAWC,KAAK,IAAIK,QAAM,CAACC,aAAa,CAAC;EAAEC,aAAa,EAAE,MAAM;EAAEC,cAAc,EAAE;AAAU,CAAC,EAAER,KAAK,CAACS,KAAK,CAAC;AAC3G,IAAKT,KAAK,IAAKA,KAAK,CAACC,KAAK,IAAI,WAAW0B,aAAa,CAAC3B,KAAK,CAAC4B,KAAK,EAAE5B,KAAK,CAACC,KAAK,CAAC,GAAG;AACnF,IAAKD,KAAK,IAAK,CAACA,KAAK,CAACC,KAAK,IAAI,cAAc;AAC7C;AACA,CAAC;AAED,MAAM4B,aAAa,GAAG/B,yBAAM,CAACC,GAAqB;AAClD,IAAKC,KAAK,IACN,CAACA,KAAK,CAACC,KAAK,GACR,IAAA6B,oBAAkB,EAACC,oBAAkB,CAACC,OAAO,EAAE3B,QAAM,CAACC,aAAa,CAAC;EAAEC,aAAa,EAAE,MAAM;EAAEC,cAAc,EAAE;AAAS,CAAC,EAAER,KAAK,CAACS,KAAK,CAAC,CAAC,GACtIT,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACC,KAAK,GAC1B,IAAA8B,2BAAmB,EAACF,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,IAAA8B,yBAAiB,EAACH,oBAAkB,CAACC,OAAO,EAAE3B,QAAM,CAACC,aAAa,CAAC;EAAEC,aAAa,EAAE,MAAM;EAAEC,cAAc,EAAE;AAAS,CAAC,EAAER,KAAK,CAACS,KAAK,CAAC,CAAC,GACrI,IAAAqB,oBAAkB,EAACC,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,GAAqB;AACnD,IAAKC,KAAK,IACN,CAACA,KAAK,CAACC,KAAK,GACR,IAAAmC,yBAAiB,EAACL,oBAAkB,CAACM,IAAI,EAAE,IAAI,CAAC,GAChDrC,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACC,KAAK,GAC1B,IAAA+B,yBAAiB,EAACH,oBAAkB,CAACM,IAAI,EAAE,IAAI,CAAC,GAChDrC,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACE,KAAK,GAC1B,IAAAkC,yBAAiB,EAACP,oBAAkB,CAACM,IAAI,EAAE,IAAI,CAAC,GAChD,IAAAD,yBAAiB,EAACL,oBAAkB,CAACM,IAAI,EAAE,IAAI,CAAC;AACxD,CAAC;AAED,MAAME,oBAAoB,GAAGzC,yBAAM,CAACC,GAAqB;AACzD,IAAKC,KAAK,IAAKA,KAAK,CAACC,KAAK,IAAI,WAAWD,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACC,KAAK,GAAG,gBAAgB,GAAGH,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACE,KAAK,GAAG,kBAAkB,GAAG,gBAAgB,GAAG;AAC9J,IAAKJ,KAAK,IAAK,CAACA,KAAK,CAACC,KAAK,IAAI,cAAc;AAC7C,CAAC;AAED,MAAMuC,mBAAmB,GAAG1C,yBAAM,CAACC,GAAqB;AACxD,IAAKC,KAAK,IAAKA,KAAK,CAACC,KAAK,IAAI,WAAWD,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACC,KAAK,GAAG,gBAAgB,GAAGH,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACE,KAAK,GAAG,kBAAkB,GAAG,kBAAkB,GAAG;AAChK,IAAKJ,KAAK,IAAK,CAACA,KAAK,CAACC,KAAK,IAAI,cAAc;AAC7C,CAAC;AAED,MAAMwC,mBAAmB,GAAG3C,yBAAM,CAACC,GAAqB;AACxD,IAAKC,KAAK,IAAKA,KAAK,CAACC,KAAK,IAAI,WAAWD,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACC,KAAK,GAAG,gBAAgB,GAAGH,KAAK,CAACC,KAAK,KAAKC,WAAI,CAACE,KAAK,GAAG,kBAAkB,GAAG,kBAAkB,GAAG;AAChK,IAAKJ,KAAK,IAAK,CAACA,KAAK,CAACC,KAAK,IAAI,cAAc;AAC7C;AACA,CAAC;AAEM,MAAMyC,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,IAAW,KAAa;EACrE,IAAI,CAACA,IAAI,EAAE;IACT,OAAOD,aAAa,GAAG,KAAK,GAAG,UAAU;EAC3C;EACA,IAAIA,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;IACJI,eAAe;IACfC,kBAAkB;IAClBC,WAAW;IACXC,QAAQ;IACRN,QAAQ;IACRO,WAAW,GAAG,KAAK;IACnBC,gBAAgB,GAAG;EACrB,CAAC,GAAAN,IAAA;EACC,MAAM,CAACO,WAAW,EAAEC,cAAc,CAAC,GAAG3F,KAAK,CAAC4F,QAAQ,CAAC,KAAK,CAAC;EAC3D,MAAMjD,KAAK,GAAG,IAAAkD,0BAAQ,EAAC,CAAC;EACxB,MAAMC,UAAU,GAAG9F,KAAK,CAAC+F,MAAM,CAAM,IAAI,CAAC;EAC1C,MAAMC,UAAU,GAAGhG,KAAK,CAAC+F,MAAM,CAAM,IAAI,CAAC;EAE1C/F,KAAK,CAACiG,SAAS,CAAC,MAAM;IACpB,MAAMC,qBAAqB,GAAIvF,CAAkB,IAAK;MACpD,IAAI+E,WAAW,IAAII,UAAU,CAACK,OAAO,IAAI,CAACL,UAAU,CAACK,OAAO,CAACC,QAAQ,CAACzF,CAAC,CAAC0F,MAAM,CAAC,IAAIL,UAAU,CAACG,OAAO,IAAI,CAACH,UAAU,CAACG,OAAO,CAACC,QAAQ,CAACzF,CAAC,CAAC0F,MAAM,CAAC,EAAE;QAC/IV,cAAc,CAAC,KAAK,CAAC;MACvB;IACF,CAAC;IAEDW,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,CAACR,WAAW,CAAC,CAAC;EAEjB,MAAMe,kBAAkB,GAAI9F,CAAmB,IAAK;IAClD,IAAI6E,WAAW,EAAE;MACf7E,CAAC,CAAC+F,eAAe,CAAC,CAAC;MACnBf,cAAc,CAAC,CAACD,WAAW,CAAC;IAC9B;EACF,CAAC;EAED,oBACE,IAAAjF,WAAA,CAAAkG,IAAA,EAAC/B,cAAc;IAAC5B,SAAS,EAAEiC,QAAS;IAACJ,YAAY,EAAEW,WAAY;IAACV,YAAY,EAAEY,WAAY;IAAAH,QAAA,gBACxF,IAAA9E,WAAA,CAAAkG,IAAA,EAAC7E,gBAAgB;MAACK,KAAK,EAAE6C,IAAK;MAAChC,SAAS,EAAEiC,QAAS;MAAC2B,GAAG,EAAEd,UAAW;MAACxC,iBAAiB,EAAEmC,gBAAiB;MAAAF,QAAA,GACtG,CAAC,CAACH,eAAe,iBAChB,IAAA3E,WAAA,CAAAkG,IAAA,EAACnD,0BAA0B;QAACrB,KAAK,EAAE6C,IAAK;QAAAO,QAAA,gBACtC,IAAA9E,WAAA,CAAAkG,IAAA,EAAC/C,aAAa;UAACE,KAAK,EAAE,CAAC,CAACsB,eAAe,EAAEyB,IAAK;UAAC1E,KAAK,EAAE6C,IAAK;UAAAO,QAAA,GACxDH,eAAe,EAAEyB,IAAI,iBAAI,IAAApG,WAAA,CAAAqG,GAAA,EAAC/C,aAAa;YAAC5B,KAAK,EAAE6C,IAAK;YAAAO,QAAA,EAAEH,eAAe,CAACyB;UAAI,CAAgB,CAAC,eAC5F,IAAApG,WAAA,CAAAqG,GAAA,EAACzC,cAAc;YAAClC,KAAK,EAAE6C,IAAK;YAAAO,QAAA,EAAEH,eAAe,EAAE2B;UAAI,CAAiB,CAAC;QAAA,CACxD,CAAC,EAEfvB,WAAW,iBACV,IAAA/E,WAAA,CAAAqG,GAAA,EAACrC,oBAAoB;UAACtC,KAAK,EAAE6C,IAAK;UAAC,eAAa,UAAW;UAAAO,QAAA,eACzD,IAAA9E,WAAA,CAAAqG,GAAA,EAACzG,OAAA,CAAA2G,UAAU;YAACC,MAAM,EAAEA,CAAA,KAAMtB,cAAc,CAAC,KAAK,CAAE;YAACuB,wBAAwB;YACvEC,SAAS,EAAE5E,QAAM,CAACC,aAAa,CAAC;cAAEC,aAAa,EAAE,MAAM;cAAEC,cAAc,EAAE;YAAS,CAAC,EAAEC,KAAK,CAAE;YAACyE,OAAO,EAAC,WAAW;YAACC,KAAK,EAAC,UAAU;YAAA9B,QAAA,eACjI,IAAA9E,WAAA,CAAAqG,GAAA,EAACxG,MAAA,CAAAgH,WAAW,CAACC,KAAK,IAAE;UAAC,CACX;QAAC,CACO,CACvB;MAAA,CACyB,CAC7B,eAED,IAAA9G,WAAA,CAAAqG,GAAA,EAACrD,6BAA6B;QAACtB,KAAK,EAAE6C,IAAK;QAAAO,QAAA,EAAED;MAAW,CAAgC,CAAC,EAExF,CAAC,CAACD,kBAAkB,iBACnB,IAAA5E,WAAA,CAAAkG,IAAA,EAAChD,6BAA6B;QAACxB,KAAK,EAAE6C,IAAK;QAAAO,QAAA,GACxC,CAAC,CAACF,kBAAkB,EAAEmC,UAAU,EAAEC,IAAI,iBACrC,IAAAhH,WAAA,CAAAqG,GAAA,EAACpC,mBAAmB;UAACvC,KAAK,EAAE6C,IAAK;UAAC,eAAa,SAAU;UAAAO,QAAA,eACvD,IAAA9E,WAAA,CAAAqG,GAAA,EAACzG,OAAA,CAAAqH,UAAU;YAAC1C,IAAI,EAAEA,IAAK;YAACoC,OAAO,EAAC,WAAW;YAACK,IAAI,EAAEpC,kBAAkB,CAACmC,UAAU,CAACC,IAAK;YAACE,OAAO,EAAEtC,kBAAkB,CAACmC,UAAU,CAACP,MAAO;YAAA1B,QAAA,EACjIF,kBAAkB,CAACmC,UAAU,CAACI;UAAK,CAC1B;QAAC,CACM,CACtB,eAED,IAAAnH,WAAA,CAAAqG,GAAA;UAAKe,SAAS,EAAC;QAAa,CAAE,CAAC,eAE/B,IAAApH,WAAA,CAAAqG,GAAA,EAACnC,mBAAmB;UAACxC,KAAK,EAAE6C,IAAK;UAAC,eAAa,SAAU;UAAAO,QAAA,EACtDF,kBAAkB,EAAEyC,WAAW,EAAEC,GAAG,CAAEC,UAAU,iBAC/C,IAAAvH,WAAA,CAAAqG,GAAA,EAACzG,OAAA,CAAA2G,UAAU;YAACC,MAAM,EAAEe,UAAU,CAACf,MAAO;YAACG,OAAO,EAAC,WAAW;YAACC,KAAK,EAAC,UAAU;YAACH,wBAAwB;YAAA3B,QAAA,EACjGyC,UAAU,CAACP;UAAI,CACN,CACb;QAAC,CACiB,CAAC;MAAA,CACO,CAChC;IAAA,CACe,CAAC,eAEnB,IAAAhH,WAAA,CAAAkG,IAAA;MAAKC,GAAG,EAAEZ,UAAW;MAAC2B,OAAO,EAAElB,kBAAmB;MAAAlB,QAAA,GAC/CA,QAAQ,eAET,IAAA9E,WAAA,CAAAqG,GAAA;QAAKe,SAAS,EAAC;MAAe,CAAE,CAAC;IAAA,CAC9B,CAAC;EAAA,CACQ,CAAC;AAErB,CAAC;AAAC3C,OAAA,CAAA+C,SAAA;EA5HA7C,eAAe,EAAA8C,UAAA,CAAAlH,OAAA,CAAAqG,KAAA;IAhDfN,IAAI,EAAAmB,UAAA,CAAAlH,OAAA,CAAAmH,MAAA,CAAAC,UAAA;IAKJvB,IAAI,EAAAqB,UAAA,CAAAlH,OAAA,CAAAmH;EAAA;EAgDJ9C,kBAAkB,EAAA6C,UAAA,CAAAlH,OAAA,CAAAqG,KAAA;IAvBlBS,WAAW,EAAAI,UAAA,CAAAlH,OAAA,CAAAqH,OAAA,CAAAH,UAAA,CAAAlH,OAAA,CAAAqG,KAAA;MAlBXI,IAAI,EAAAS,UAAA,CAAAlH,OAAA,CAAAsH,IAAA,CAAAF,UAAA;MAKJnB,MAAM,EAAAiB,UAAA,CAAAlH,OAAA,CAAAuH,IAAA,CAAAH,UAAA;MAKNR,KAAK,EAAAM,UAAA,CAAAlH,OAAA,CAAAmH;IAAA;IAaLX,UAAU,EAAAU,UAAA,CAAAlH,OAAA,CAAAqG,KAAA;MAvBVI,IAAI,EAAAS,UAAA,CAAAlH,OAAA,CAAAsH,IAAA,CAAAF,UAAA;MAKJnB,MAAM,EAAAiB,UAAA,CAAAlH,OAAA,CAAAuH,IAAA,CAAAH,UAAA;MAKNR,KAAK,EAAAM,UAAA,CAAAlH,OAAA,CAAAmH;IAAA;EAAA;EAoCL7C,WAAW,EAAA4C,UAAA,CAAAlH,OAAA,CAAAsH,IAAA,CAAAF,UAAA;EAKX7C,QAAQ,EAAA2C,UAAA,CAAAlH,OAAA,CAAAsH,IAAA,CAAAF,UAAA;EAWR5C,WAAW,EAAA0C,UAAA,CAAAlH,OAAA,CAAAwH,IAAA,CAAAJ,UAAA;EAMX3C,gBAAgB,EAAAyC,UAAA,CAAAlH,OAAA,CAAAwH;AAAA;AAAA,IAAAC,QAAA,GAAA1G,OAAA,CAAAf,OAAA,GA8FHkE,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":[]}

package/dist/Popover/Popover.js CHANGED Viewed

@@ -32,6 +32,7 @@ export const PopoverContainer = styled.div`
   &::after {
     ${props => props.$showArrowPointer ? renderArrowStyles(props.$position) : ''}
+  }
 `;
 export const PopoverTopSectionContainer = styled.div`
   ${props => props.$size && `height: ${props.$size === Size.Small ? '56px' : props.$size === Size.Large ? '72px' : '64px'};`}

package/dist/Popover/Popover.js.map CHANGED Viewed

	@@ -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","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\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	+ {"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":[]}

package/package.json CHANGED Viewed

@@ -1,150 +1,154 @@
 {
-  "name": "@laerdal/life-react-components",
-  "version": "6.1.2-dev.1",
-  "private": false,
-  "author": "Erik Martirosyan <erik.martirosyan@laerdal.com>",
-  "contributors": [],
-  "description": "Laerdal LIFE component library for React.",
-  "keywords": [],
-  "license": "UNLICENSED",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/Laerdal-Medical/dcs-life-react-js"
-  },
-  "main": "dist/index.cjs",
-  "module": "dist/index.js",
-  "types": "dist/index.d.ts",
-  "exports": {
-    ".": {
-      "require": "./dist/index.cjs",
-      "import": "./dist/index.js",
-      "types": "./dist/index.d.ts"
-    }
-  },
-  "sideEffects": false,
-  "files": [
-    "dist"
-  ],
-  "scripts": {
-    "bump": "yarn version --patch",
-    "build": "yarn extract-design-tokens && yarn build:babel:esm && yarn build:babel:cjs && tsc --emitDeclarationOnly --declaration --declarationDir dist && node scripts/copyTS.cjs",
-    "extract-design-tokens": "node scripts/extractDesignTokens.js",
-    "build:babel:esm": "cross-env BABEL_ENV=esm babel --source-maps --extensions \".js,.ts,.tsx\" src --out-dir dist --out-file-extension .js --copy-files",
-    "build:babel:cjs": "cross-env BABEL_ENV=cjs babel --source-maps --extensions \".js,.ts,.tsx\" src --out-dir dist --out-file-extension .cjs --copy-files",
-    "clean": "rimraf dist",
-    "develop": "yarn build:babel:esm --skip-initial-build --watch --verbose",
-    "test": "jest src/",
-    "test:coverage": "jest --collectCoverage src/",
-    "test-watch": "jest --watch",
-    "storybook": "storybook dev -p 6006",
-    "build-storybook": "storybook build"
-  },
-  "eslintConfig": {
-    "extends": [
-      "react-app",
-      "plugin:storybook/recommended"
-    ]
-  },
-  "browserslist": {
-    "production": [
-      ">0.2%",
-      "not dead",
-      "not op_mini all"
-    ],
-    "development": [
-      "last 1 chrome version",
-      "last 1 firefox version",
-      "last 1 safari version"
-    ]
-  },
-  "omlet": {
-    "exports": {
-      ".": "src/index.ts"
-    }
-  },
-  "dependencies": {
-    "@babel/plugin-transform-typescript": "^7.28.0",
-    "@laerdal/figma-svg": "^5.2.2",
-    "@types/node": "^18.0.6",
-    "animated-scroll-to": "^2.3.0",
-    "dayjs": "^1.11.5",
-    "nanoid": "3.3.11",
-    "react": "^19.0.0",
-    "react-datepicker": "^8.4.0",
-    "react-dom": "^19.0.0",
-    "react-inlinesvg": "^4.2.0",
-    "react-modal": "^3.16.0",
-    "react-quill-new": "^3.6.0",
-    "react-resize-detector": "^12.0.0",
-    "rooks": "8.4.0",
-    "styled-components": "^6.1.13",
-    "typescript": "^5.1.2"
-  },
-  "devDependencies": {
-    "@babel/cli": "^7.22.0",
-    "@babel/plugin-proposal-class-properties": "^7.18.6",
-    "@babel/plugin-proposal-decorators": "^7.27.1",
-    "@babel/plugin-proposal-export-default-from": "^7.22.0",
-    "@babel/plugin-proposal-numeric-separator": "^7.18.6",
-    "@babel/plugin-proposal-object-rest-spread": "^7.18.6",
-    "@babel/plugin-transform-runtime": "^7.22.0",
-    "@babel/preset-env": "^7.22.0",
-    "@babel/preset-react": "^7.22.0",
-    "@babel/preset-typescript": "^7.27.0",
-    "@babel/runtime": "^7.22.0",
-    "@chromatic-com/storybook": "1.4.0",
-    "@laerdal-medical/life-design-tokens": "^1.5.1-beta",
-    "@laerdal/life-react-components": "5.1.0",
-    "@laerdal/navigation": "^3.2.0",
-    "@storybook/addon-essentials": "^8.1.3",
-    "@storybook/addon-interactions": "^8.1.3",
-    "@storybook/addon-links": "^8.1.3",
-    "@storybook/addon-onboarding": "^8.1.3",
-    "@storybook/addon-webpack5-compiler-swc": "1.0.2",
-    "@storybook/addons": "^7.6.17",
-    "@storybook/blocks": "^8.1.3",
-    "@storybook/react": "^8.1.3",
-    "@storybook/react-webpack5": "^8.1.3",
-    "@storybook/test": "^8.1.3",
-    "@testing-library/dom": "^10.4.0",
-    "@testing-library/jest-dom": "^6.5.0",
-    "@testing-library/react": "^16.0.1",
-    "@testing-library/user-event": "^14.5.2",
-    "@types/jest": "^29.5.12",
-    "@types/react": "^19.1.2",
-    "@types/react-datepicker": "^4.4.2",
-    "@types/react-dom": "^18.3.0",
-    "@types/react-modal": "^3.13.1",
-    "babel-plugin-inline-react-svg": "^2.0.1",
-    "babel-plugin-typescript-to-proptypes": "^2.0.0",
-    "concurrently": "^5.2.0",
-    "cross-env": "^7.0.3",
-    "css-loader": "^7.1.2",
-    "eslint-plugin-storybook": "^0.8.0",
-    "history": "^5.3.0",
-    "jest": "^29.7.0",
-    "jest-environment-jsdom": "^29.7.0",
-    "jest-styled-components": "^7.2.0",
-    "jest-svg-transformer": "^1.0.0",
-    "react-router": "^6.0.0",
-    "react-share": "^5.1.0",
-    "regenerator-runtime": "^0.13.9",
-    "storybook": "^8.1.3",
-    "storybook-addon-themes": "^6.1.0",
-    "style-loader": "^4.0.0",
-    "ts-jest": "^29.2.5",
-    "webpack": "^5.99.9",
-    "webpack-cli": "^6.0.1",
-    "webpack-dev-server": "^5.2.1"
-  },
-  "peerDependencies": {
-    "@babel/core": "^7.0.0",
-    "react": "^19",
-    "react-dom": "^19"
-  },
-  "resolutions": {
-    "nwsapi": "2.2.9",
-    "date-fns": "2.24.0",
-    "@types/react": "19.1.2"
-  }
+    "name":  "@laerdal/life-react-components",
+    "version":  "6.1.3-dev.1.full",
+    "private":  false,
+    "author":  "Erik Martirosyan \u003cerik.martirosyan@laerdal.com\u003e",
+    "contributors":  [
+                     ],
+    "description":  "Laerdal LIFE component library for React.",
+    "keywords":  [
+                 ],
+    "license":  "UNLICENSED",
+    "repository":  {
+                       "type":  "git",
+                       "url":  "https://github.com/Laerdal-Medical/dcs-life-react-js"
+                   },
+    "main":  "dist/index.cjs",
+    "module":  "dist/index.js",
+    "types":  "dist/index.d.ts",
+    "exports":  {
+                    ".":  {
+                              "require":  "./dist/index.cjs",
+                              "import":  "./dist/index.js",
+                              "types":  "./dist/index.d.ts"
+                          }
+                },
+    "sideEffects":  false,
+    "files":  [
+                  "dist"
+              ],
+    "scripts":  {
+                    "bump":  "yarn version --patch",
+                    "build":  "yarn extract-design-tokens \u0026\u0026 yarn build:babel:esm \u0026\u0026 yarn build:babel:cjs \u0026\u0026 tsc --emitDeclarationOnly --declaration --declarationDir dist \u0026\u0026 node scripts/copyTS.cjs",
+                    "extract-design-tokens":  "node scripts/extractDesignTokens.js",
+                    "build:babel:esm":  "cross-env BABEL_ENV=esm babel --source-maps --extensions \".js,.ts,.tsx\" src --out-dir dist --out-file-extension .js --copy-files",
+                    "build:babel:cjs":  "cross-env BABEL_ENV=cjs babel --source-maps --extensions \".js,.ts,.tsx\" src --out-dir dist --out-file-extension .cjs --copy-files",
+                    "clean":  "rimraf dist",
+                    "develop":  "yarn build:babel:esm --skip-initial-build --watch --verbose",
+                    "test":  "jest src/",
+                    "test:coverage":  "jest --collectCoverage src/",
+                    "test-watch":  "jest --watch",
+                    "storybook":  "storybook dev -p 6006",
+                    "build-storybook":  "storybook build"
+                },
+    "eslintConfig":  {
+                         "extends":  [
+                                         "react-app",
+                                         "plugin:storybook/recommended"
+                                     ]
+                     },
+    "browserslist":  {
+                         "production":  [
+                                            "\u003e0.2%",
+                                            "not dead",
+                                            "not op_mini all"
+                                        ],
+                         "development":  [
+                                             "last 1 chrome version",
+                                             "last 1 firefox version",
+                                             "last 1 safari version"
+                                         ]
+                     },
+    "omlet":  {
+                  "exports":  {
+                                  ".":  "src/index.ts"
+                              }
+              },
+    "dependencies":  {
+                         "@babel/plugin-transform-typescript":  "^7.28.0",
+                         "@laerdal/figma-svg":  "^5.2.2",
+                         "@types/node":  "^18.0.6",
+                         "animated-scroll-to":  "^2.3.0",
+                         "dayjs":  "^1.11.5",
+                         "nanoid":  "3.3.11",
+                         "react":  "^19.0.0",
+                         "react-datepicker":  "^8.4.0",
+                         "react-dom":  "^19.0.0",
+                         "react-inlinesvg":  "^4.2.0",
+                         "react-modal":  "^3.16.0",
+                         "react-quill-new":  "^3.6.0",
+                         "react-resize-detector":  "^12.0.0",
+                         "rooks":  "8.4.0",
+                         "styled-components":  "^6.1.13",
+                         "typescript":  "^5.1.2"
+                     },
+    "devDependencies":  {
+                            "@babel/cli":  "^7.22.0",
+                            "@babel/plugin-proposal-class-properties":  "^7.18.6",
+                            "@babel/plugin-proposal-decorators":  "^7.27.1",
+                            "@babel/plugin-proposal-export-default-from":  "^7.22.0",
+                            "@babel/plugin-proposal-numeric-separator":  "^7.18.6",
+                            "@babel/plugin-proposal-object-rest-spread":  "^7.18.6",
+                            "@babel/plugin-transform-runtime":  "^7.22.0",
+                            "@babel/preset-env":  "^7.22.0",
+                            "@babel/preset-react":  "^7.22.0",
+                            "@babel/preset-typescript":  "^7.27.0",
+                            "@babel/runtime":  "^7.22.0",
+                            "@chromatic-com/storybook":  "1.4.0",
+                            "@laerdal-medical/life-design-tokens":  "^1.5.1-beta",
+                            "@laerdal/life-react-components":  "5.1.0",
+                            "@laerdal/navigation":  "^3.2.0",
+                            "@storybook/addon-essentials":  "^8.1.3",
+                            "@storybook/addon-interactions":  "^8.1.3",
+                            "@storybook/addon-links":  "^8.1.3",
+                            "@storybook/addon-onboarding":  "^8.1.3",
+                            "@storybook/addon-webpack5-compiler-swc":  "1.0.2",
+                            "@storybook/addons":  "^7.6.17",
+                            "@storybook/blocks":  "^8.1.3",
+                            "@storybook/react":  "^8.1.3",
+                            "@storybook/react-webpack5":  "^8.1.3",
+                            "@storybook/test":  "^8.1.3",
+                            "@testing-library/dom":  "^10.4.0",
+                            "@testing-library/jest-dom":  "^6.5.0",
+                            "@testing-library/react":  "^16.0.1",
+                            "@testing-library/user-event":  "^14.5.2",
+                            "@types/jest":  "^29.5.12",
+                            "@types/react":  "^19.1.2",
+                            "@types/react-datepicker":  "^4.4.2",
+                            "@types/react-dom":  "^18.3.0",
+                            "@types/react-modal":  "^3.13.1",
+                            "babel-plugin-inline-react-svg":  "^2.0.1",
+                            "babel-plugin-typescript-to-proptypes":  "^2.0.0",
+                            "concurrently":  "^5.2.0",
+                            "cross-env":  "^7.0.3",
+                            "css-loader":  "^7.1.2",
+                            "eslint-plugin-storybook":  "^0.8.0",
+                            "history":  "^5.3.0",
+                            "jest":  "^29.7.0",
+                            "jest-environment-jsdom":  "^29.7.0",
+                            "jest-styled-components":  "^7.2.0",
+                            "jest-svg-transformer":  "^1.0.0",
+                            "react-router":  "^6.0.0",
+                            "react-share":  "^5.1.0",
+                            "regenerator-runtime":  "^0.13.9",
+                            "storybook":  "^8.1.3",
+                            "storybook-addon-themes":  "^6.1.0",
+                            "style-loader":  "^4.0.0",
+                            "ts-jest":  "^29.2.5",
+                            "webpack":  "^5.99.9",
+                            "webpack-cli":  "^6.0.1",
+                            "webpack-dev-server":  "^5.2.1"
+                        },
+    "peerDependencies":  {
+                             "@babel/core":  "^7.0.0",
+                             "react":  "^19",
+                             "react-dom":  "^19"
+                         },
+    "resolutions":  {
+                        "nwsapi":  "2.2.9",
+                        "date-fns":  "2.24.0",
+                        "@types/react":  "19.1.2"
+                    }
 }