@chayns-components/core 5.0.0-beta.1165 → 5.0.0-beta.1168

package/lib/cjs/components/dropdown-body-wrapper/DropdownBodyWrapper.js

@@ -41,7 +41,8 @@ const DropdownBodyWrapper = ({
     bodyWidth,
     contentHeight,
     container,
-    anchorElement
+    anchorElement,
+    shouldShowDropdown
   });
   const handleClose = (0, _react.useCallback)(() => {
     if (typeof onClose === 'function') {

package/lib/cjs/components/dropdown-body-wrapper/DropdownBodyWrapper.js.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownBodyWrapper.js","names":["_react","_interopRequireWildcard","require","_DropdownBodyWrapper","_reactDom","_dropdown","_DelayedDropdownContent","_interopRequireDefault","_dropdown2","_container","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","DropdownBodyWrapper","direction","DropdownDirection","BOTTOM_RIGHT","children","container","containerProp","shouldShowDropdown","anchorElement","contentHeight","maxHeight","onClose","onMeasure","minBodyWidth","bodyWidth","portal","setPortal","useState","ref","useRef","useContainer","transform","width","coordinates","useDropdown","handleClose","useCallback","handleOutsideClick","event","contains","target","current","useDropdownListener","onOutsideClick","useEffect","createPortal","createElement","shouldShowContent","StyledDropdownBodyWrapperContent","$width","$minWidth","$maxHeight","$direction","StyledDropdownBodyWrapper","displayName","_default","exports"],"sources":["../../../../src/components/dropdown-body-wrapper/DropdownBodyWrapper.tsx"],"sourcesContent":["import React, { FC, ReactNode, ReactPortal, useCallback, useEffect, useRef, useState } from 'react';\nimport {\n    StyledDropdownBodyWrapper,\n    StyledDropdownBodyWrapperContent,\n} from './DropdownBodyWrapper.styles';\nimport { createPortal } from 'react-dom';\nimport { DropdownDirection } from '../../types/dropdown';\nimport DelayedDropdownContent, {\n    DelayedDropdownContentProps,\n} from './delayed-dropdown-content/DelayedDropdownContent';\nimport { useDropdown, useDropdownListener } from '../../hooks/dropdown';\nimport { useContainer } from '../../hooks/container';\n\ninterface DropdownBodyWrapperProps {\n    /**\n     * The anchor element of the dropdown.\n     */\n    anchorElement: Element;\n    /**\n     * The width of the Body.\n     */\n    bodyWidth?: number;\n    /**\n     * The content of the dropdown body.\n     */\n    children: ReactNode;\n    /**\n     * The element where the content should be rendered via React Portal.\n     */\n    container?: Element;\n    /**\n     * The height of the content\n     */\n    contentHeight?: number;\n    /**\n     * The direction of the dropdown.\n     */\n    direction?: DropdownDirection;\n    /**\n     * The max height of the dropdown.\n     */\n    maxHeight?: number;\n    /**\n     * The minimum width of the body.\n     */\n    minBodyWidth?: number;\n    /**\n     * Function to be executed when the body is closed.\n     */\n    onClose?: VoidFunction;\n    /**\n     * Function to be executed when the content is measured.\n     */\n    onMeasure?: DelayedDropdownContentProps['onMeasure'];\n    /**\n     * Whether the dropdown should be visible.\n     */\n    shouldShowDropdown: boolean;\n}\n\nconst DropdownBodyWrapper: FC<DropdownBodyWrapperProps> = ({\n    direction = DropdownDirection.BOTTOM_RIGHT,\n    children,\n    container: containerProp,\n    shouldShowDropdown,\n    anchorElement,\n    contentHeight = 0,\n    maxHeight = 300,\n    onClose,\n    onMeasure,\n    minBodyWidth = 0,\n    bodyWidth,\n}) => {\n    const [portal, setPortal] = useState<ReactPortal>();\n\n    const ref = useRef<HTMLDivElement>(null);\n\n    const container = useContainer({ anchorElement, container: containerProp });\n\n    const { transform, width, coordinates } = useDropdown({\n        direction,\n        bodyWidth,\n        contentHeight,\n        container,\n        anchorElement,\n    });\n\n    const handleClose = useCallback(() => {\n        if (typeof onClose === 'function') {\n            onClose();\n        }\n    }, [onClose]);\n\n    /**\n     * This function closes the body\n     */\n    const handleOutsideClick = useCallback(\n        (event: MouseEvent) => {\n            if (\n                !anchorElement.contains(event.target as Node) &&\n                ref.current &&\n                !ref.current.contains(event.target as Node)\n            ) {\n                handleClose();\n            }\n        },\n        [anchorElement, handleClose],\n    );\n\n    /**\n     * This hook listens for clicks\n     */\n    useDropdownListener({\n        onOutsideClick: handleOutsideClick,\n        onClose: handleClose,\n    });\n\n    useEffect(() => {\n        if (!container) return;\n\n        setPortal(() =>\n            createPortal(\n                <DelayedDropdownContent\n                    shouldShowContent={shouldShowDropdown}\n                    coordinates={coordinates}\n                    transform={transform}\n                >\n                    <StyledDropdownBodyWrapperContent\n                        $width={width}\n                        $minWidth={minBodyWidth}\n                        $maxHeight={maxHeight}\n                        $direction={direction}\n                        ref={ref}\n                    >\n                        {children}\n                    </StyledDropdownBodyWrapperContent>\n                </DelayedDropdownContent>,\n                container,\n            ),\n        );\n    }, [\n        direction,\n        children,\n        container,\n        coordinates,\n        maxHeight,\n        shouldShowDropdown,\n        width,\n        minBodyWidth,\n        transform,\n        onMeasure,\n    ]);\n\n    return <StyledDropdownBodyWrapper>{portal}</StyledDropdownBodyWrapper>;\n};\n\nDropdownBodyWrapper.displayName = 'DropdownBodyWrapper';\n\nexport default DropdownBodyWrapper;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"DropdownBodyWrapper.js","names":["_react","_interopRequireWildcard","require","_DropdownBodyWrapper","_reactDom","_dropdown","_DelayedDropdownContent","_interopRequireDefault","_dropdown2","_container","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","DropdownBodyWrapper","direction","DropdownDirection","BOTTOM_RIGHT","children","container","containerProp","shouldShowDropdown","anchorElement","contentHeight","maxHeight","onClose","onMeasure","minBodyWidth","bodyWidth","portal","setPortal","useState","ref","useRef","useContainer","transform","width","coordinates","useDropdown","handleClose","useCallback","handleOutsideClick","event","contains","target","current","useDropdownListener","onOutsideClick","useEffect","createPortal","createElement","shouldShowContent","StyledDropdownBodyWrapperContent","$width","$minWidth","$maxHeight","$direction","StyledDropdownBodyWrapper","displayName","_default","exports"],"sources":["../../../../src/components/dropdown-body-wrapper/DropdownBodyWrapper.tsx"],"sourcesContent":["import React, { FC, ReactNode, ReactPortal, useCallback, useEffect, useRef, useState } from 'react';\nimport {\n    StyledDropdownBodyWrapper,\n    StyledDropdownBodyWrapperContent,\n} from './DropdownBodyWrapper.styles';\nimport { createPortal } from 'react-dom';\nimport { DropdownDirection } from '../../types/dropdown';\nimport DelayedDropdownContent, {\n    DelayedDropdownContentProps,\n} from './delayed-dropdown-content/DelayedDropdownContent';\nimport { useDropdown, useDropdownListener } from '../../hooks/dropdown';\nimport { useContainer } from '../../hooks/container';\n\ninterface DropdownBodyWrapperProps {\n    /**\n     * The anchor element of the dropdown.\n     */\n    anchorElement: Element;\n    /**\n     * The width of the Body.\n     */\n    bodyWidth?: number;\n    /**\n     * The content of the dropdown body.\n     */\n    children: ReactNode;\n    /**\n     * The element where the content should be rendered via React Portal.\n     */\n    container?: Element;\n    /**\n     * The height of the content\n     */\n    contentHeight?: number;\n    /**\n     * The direction of the dropdown.\n     */\n    direction?: DropdownDirection;\n    /**\n     * The max height of the dropdown.\n     */\n    maxHeight?: number;\n    /**\n     * The minimum width of the body.\n     */\n    minBodyWidth?: number;\n    /**\n     * Function to be executed when the body is closed.\n     */\n    onClose?: VoidFunction;\n    /**\n     * Function to be executed when the content is measured.\n     */\n    onMeasure?: DelayedDropdownContentProps['onMeasure'];\n    /**\n     * Whether the dropdown should be visible.\n     */\n    shouldShowDropdown: boolean;\n}\n\nconst DropdownBodyWrapper: FC<DropdownBodyWrapperProps> = ({\n    direction = DropdownDirection.BOTTOM_RIGHT,\n    children,\n    container: containerProp,\n    shouldShowDropdown,\n    anchorElement,\n    contentHeight = 0,\n    maxHeight = 300,\n    onClose,\n    onMeasure,\n    minBodyWidth = 0,\n    bodyWidth,\n}) => {\n    const [portal, setPortal] = useState<ReactPortal>();\n\n    const ref = useRef<HTMLDivElement>(null);\n\n    const container = useContainer({ anchorElement, container: containerProp });\n\n    const { transform, width, coordinates } = useDropdown({\n        direction,\n        bodyWidth,\n        contentHeight,\n        container,\n        anchorElement,\n        shouldShowDropdown,\n    });\n\n    const handleClose = useCallback(() => {\n        if (typeof onClose === 'function') {\n            onClose();\n        }\n    }, [onClose]);\n\n    /**\n     * This function closes the body\n     */\n    const handleOutsideClick = useCallback(\n        (event: MouseEvent) => {\n            if (\n                !anchorElement.contains(event.target as Node) &&\n                ref.current &&\n                !ref.current.contains(event.target as Node)\n            ) {\n                handleClose();\n            }\n        },\n        [anchorElement, handleClose],\n    );\n\n    /**\n     * This hook listens for clicks\n     */\n    useDropdownListener({\n        onOutsideClick: handleOutsideClick,\n        onClose: handleClose,\n    });\n\n    useEffect(() => {\n        if (!container) return;\n\n        setPortal(() =>\n            createPortal(\n                <DelayedDropdownContent\n                    shouldShowContent={shouldShowDropdown}\n                    coordinates={coordinates}\n                    transform={transform}\n                >\n                    <StyledDropdownBodyWrapperContent\n                        $width={width}\n                        $minWidth={minBodyWidth}\n                        $maxHeight={maxHeight}\n                        $direction={direction}\n                        ref={ref}\n                    >\n                        {children}\n                    </StyledDropdownBodyWrapperContent>\n                </DelayedDropdownContent>,\n                container,\n            ),\n        );\n    }, [\n        direction,\n        children,\n        container,\n        coordinates,\n        maxHeight,\n        shouldShowDropdown,\n        width,\n        minBodyWidth,\n        transform,\n        onMeasure,\n    ]);\n\n    return <StyledDropdownBodyWrapper>{portal}</StyledDropdownBodyWrapper>;\n};\n\nDropdownBodyWrapper.displayName = 'DropdownBodyWrapper';\n\nexport default DropdownBodyWrapper;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/list/list-item/ListItem.js

@@ -14,6 +14,7 @@ var _ListItemBody = _interopRequireDefault(require("./list-item-body/ListItemBod
 var _ListItemHead = _interopRequireDefault(require("./list-item-head/ListItemHead"));
 var _ListItem = require("./ListItem.styles");
 var _Tooltip = _interopRequireDefault(require("../../tooltip/Tooltip"));
+var _reactResizeDetector = require("react-resize-detector");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const ListItem = ({
@@ -61,7 +62,9 @@ const ListItem = ({
   } = (0, _react2.useContext)(_Accordion.AccordionContext);
   const areaProvider = (0, _react2.useContext)(_AreaContextProvider.AreaContext);
   const isInitialRenderRef = (0, _react2.useRef)(true);
-  const listItemRef = (0, _react2.useRef)(null);
+  const {
+    ref: listItemRef
+  } = (0, _reactResizeDetector.useResizeDetector)();
   const uuid = (0, _uuid.useUuid)();
   const isExpandable = children !== undefined;
   const isItemOpen = isOpen ?? openItemUuid === uuid;
@@ -108,18 +111,6 @@ const ListItem = ({
     }
   }, [isDefaultOpen, updateOpenItemUuid, uuid]);
   const isClickable = typeof onClick === 'function' || isExpandable;
-  const handleTitleWidthChange = titleWidth => {
-    if (listItemRef.current) {
-      const {
-        offsetWidth
-      } = listItemRef.current;
-      if (offsetWidth - 18 < titleWidth) {
-        setShouldEnableTooltip(true);
-      } else {
-        setShouldEnableTooltip(false);
-      }
-    }
-  };
   const headContent = (0, _react2.useMemo)(() => /*#__PURE__*/_react2.default.createElement(_ListItemHead.default, {
     hoverItem: hoverItem,
     careOfLocationId: careOfLocationId,
@@ -129,7 +120,6 @@ const ListItem = ({
     images: images,
     isAnyItemExpandable: isAnyItemExpandable,
     isExpandable: isExpandable,
-    onTitleWidthChange: handleTitleWidthChange,
     isOpen: isItemOpen,
     isTitleGreyed: isTitleGreyed,
     leftElements: leftElements,
@@ -143,7 +133,8 @@ const ListItem = ({
     shouldShowRoundImageOrIcon: shouldShowRoundImageOrIcon,
     subtitle: subtitle,
     title: title,
-    titleElement: titleElement
+    titleElement: titleElement,
+    setShouldEnableTooltip: setShouldEnableTooltip
   }), [careOfLocationId, cornerImage, handleHeadClick, hoverItem, icons, imageBackground, images, isAnyItemExpandable, isClickable, isExpandable, isItemOpen, isTitleGreyed, leftElements, onLongPress, rightElements, shouldForceHover, shouldHideImageOrIconBackground, shouldHideIndicator, shouldOpenImageOnClick, shouldShowRoundImageOrIcon, subtitle, title, titleElement]);
   return /*#__PURE__*/_react2.default.createElement(_ListItem.StyledMotionListItem, {
     animate: {
@@ -174,6 +165,9 @@ const ListItem = ({
   }, shouldShowTooltipOnTitleOverflow && shouldEnableTooltip ? /*#__PURE__*/_react2.default.createElement(_Tooltip.default, {
     shouldUseFullWidth: true,
     item: /*#__PURE__*/_react2.default.createElement(_ListItem.StyledListItemTooltip, {
+      style: {
+        cursor: 'default'
+      },
       key: `list-item-tooltip-${uuid}`
     }, title)
   }, headContent) : headContent, /*#__PURE__*/_react2.default.createElement(_react.AnimatePresence, {

package/lib/cjs/components/list/list-item/ListItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItem.js","names":["_react","require","_react2","_interopRequireWildcard","_uuid","_Accordion","_AreaContextProvider","_List","_ListItemBody","_interopRequireDefault","_ListItemHead","_ListItem","_Tooltip","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ListItem","careOfLocationId","children","cornerImage","hoverItem","icons","imageBackground","images","isDefaultOpen","isOpen","isTitleGreyed","leftElements","onClick","onClose","onLongPress","onOpen","rightElements","shouldShowTooltipOnTitleOverflow","shouldForceBackground","shouldForceBottomLine","shouldForceHover","shouldHideBottomLine","shouldOpenImageOnClick","shouldHideImageOrIconBackground","shouldHideIndicator","shouldPreventLayoutAnimation","shouldRenderClosed","shouldShowRoundImageOrIcon","shouldShowSeparatorBelow","subtitle","title","titleElement","incrementExpandableItemCount","isAnyItemExpandable","isWrapped","openItemUuid","updateOpenItemUuid","useContext","ListContext","isParentAccordionWrapped","AccordionContext","areaProvider","AreaContext","isInitialRenderRef","useRef","listItemRef","uuid","useUuid","isExpandable","undefined","isItemOpen","onCloseRef","onOpenRef","shouldEnableTooltip","setShouldEnableTooltip","useState","shouldDisablePadding","useMemo","shouldDisableListItemPadding","useEffect","current","handleHeadClick","useCallback","event","shouldOnlyOpen","isClickable","handleTitleWidthChange","titleWidth","offsetWidth","headContent","createElement","onTitleWidthChange","StyledMotionListItem","animate","height","opacity","className","exit","initial","key","ref","layout","$isClickable","$isInAccordion","$isOpen","$isWrapped","$shouldForceBackground","$shouldForceBottomLine","$shouldHideBottomLine","$shouldHideIndicator","$shouldShowSeparatorBelow","shouldUseFullWidth","item","StyledListItemTooltip","AnimatePresence","id","shouldHideBody","displayName","_default","exports"],"sources":["../../../../../src/components/list/list-item/ListItem.tsx"],"sourcesContent":["import { AnimatePresence } from 'motion/react';\nimport React, {\n    CSSProperties,\n    FC,\n    MouseEventHandler,\n    ReactNode,\n    TouchEventHandler,\n    useCallback,\n    useContext,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport { useUuid } from '../../../hooks/uuid';\nimport type { IListItemRightElements } from '../../../types/list';\nimport { AccordionContext } from '../../accordion/Accordion';\nimport AreaContextProvider, { AreaContext } from '../../area-provider/AreaContextProvider';\nimport { ListContext } from '../List';\nimport ListItemBody from './list-item-body/ListItemBody';\nimport ListItemHead from './list-item-head/ListItemHead';\nimport { StyledListItemTooltip, StyledMotionListItem } from './ListItem.styles';\nimport Tooltip from '../../tooltip/Tooltip';\n\nexport type ListItemElements = [ReactNode, ...ReactNode[]];\n\nexport type ListItemProps = {\n    /**\n     * DEPRECATED: Use `cornerImage` instead.\n     */\n    careOfLocationId?: number;\n    /**\n     * The content of the `ListItem` body. When the `ListItem` has children,\n     * it can be opened and also gets an icon as an indicator automatically.\n     */\n    children?: ReactNode;\n    /**\n     * The image that is displayed in the bottom right corner of the grouped image of list item.\n     */\n    cornerImage?: string;\n    /**\n     * Element that is displayed when hovering over the `ListItem` on the right\n     * side. On mobile devices, this element is not displayed.\n     */\n    hoverItem?: ReactNode;\n    /**\n     * The FontAwesome or tobit icons to render like an image on the left side\n     * of the header. Multiple icons are stacked. See the `Icon` component\n     * documentation for more information.\n     */\n    icons?: string[];\n    /**\n     * The background of the image. This is only used if images are passed.\n     */\n    imageBackground?: CSSProperties['background'];\n    /**\n     * A list of image URLs that are displayed on the left side of the header.\n     * If multiple URLs are passed, the image is assembled from the first three\n     * image URLs as a puzzle.\n     */\n    images?: string[];\n    /**\n     * This can be used to automatically expand the `ListItem` during the first render.\n     */\n    isDefaultOpen?: boolean;\n    /**\n     * This overrides the internal opening state of the item and makes it controlled.\n     */\n    isOpen?: boolean;\n    /**\n     * Whether the ListItem locks disabled but has full functionality.\n     */\n    isTitleGreyed?: boolean;\n    /**\n     * Elements that are displayed on the left side of the header. If multiple\n     * elements are specified, they are displayed one aside the other.\n     */\n    leftElements?: ListItemElements;\n    /**\n     * Function to be executed when the header of the `ListItem` was clicked\n     */\n    onClick?: MouseEventHandler<HTMLDivElement>;\n    /**\n     * Function to be executed when the ListItem is closed.\n     */\n    onClose?: VoidFunction;\n    /**\n     * Function to be executed when the header of the `ListItem` is pressed for\n     * 400 milliseconds.\n     */\n    onLongPress?: TouchEventHandler<HTMLDivElement>;\n    /**\n     * Function to be executed when the ListItem is opened.\n     */\n    onOpen?: VoidFunction;\n    /**\n     * Elements that are displayed on the right side of the header. If multiple\n     * elements are specified, they are displayed one below the other.\n     */\n    rightElements?: IListItemRightElements;\n    /**\n     * This will force the background color of the ListItem to be used even if it is closed and not hovered.\n     */\n    shouldForceBackground?: boolean;\n    /**\n     * Whether the line should be forced, e.g., so that it is also displayed if the item is the last element in the list.\n     */\n    shouldForceBottomLine?: boolean;\n    /**\n     * Whether the hover item should be forced.\n     */\n    shouldForceHover?: boolean;\n    /**\n     * Whether the bottom line should be hidden.\n     */\n    shouldHideBottomLine?: boolean;\n    /**\n     * Whether the background and border of the shape on which the image or icon of the element is displayed should be\n     * hidden.\n     */\n    shouldHideImageOrIconBackground?: boolean;\n    /**\n     * If the `ListItem` is expandable, the indicator is displayed on the left\n     * side of the header. If this property is set to true, the indicator is\n     * hidden.\n     */\n    shouldHideIndicator?: boolean;\n    /**\n     * Whether the image should be opened on click.\n     */\n    shouldOpenImageOnClick?: boolean;\n    /**\n     * Whether the layout animation should be prevented. This is useful when the\n     * `ListItem` is used in a list with a lot of items and the layout animation\n     * is not desired.\n     */\n    shouldPreventLayoutAnimation?: boolean;\n    /**\n     * This will render the ListItem closed on the first render.\n     */\n    shouldRenderClosed?: boolean;\n    /**\n     * Whether the image or icon should be displayed in a round shape. This should always be used for images of persons.\n     */\n    shouldShowRoundImageOrIcon?: boolean;\n    /**\n     * Whether a separator should be displayed below this item. In this case, the border is displayed thicker than normal.\n     */\n    shouldShowSeparatorBelow?: boolean;\n    /**\n     * Whether a Tooltip should be displayed on hover, if the title is cut.\n     */\n    shouldShowTooltipOnTitleOverflow?: boolean;\n    /**\n     * Subtitle of the `ListItem` displayed in the head below the title\n     */\n    subtitle?: ReactNode;\n    /**\n     * Title of the `ListItem` displayed in the head\n     */\n    title: ReactNode;\n    /**\n     * Additional elements to be displayed in the header next to the title.\n     */\n    titleElement?: ReactNode;\n};\n\nconst ListItem: FC<ListItemProps> = ({\n    careOfLocationId,\n    children,\n    cornerImage,\n    hoverItem,\n    icons,\n    imageBackground,\n    images,\n    isDefaultOpen,\n    isOpen,\n    isTitleGreyed,\n    leftElements,\n    onClick,\n    onClose,\n    onLongPress,\n    onOpen,\n    rightElements,\n    shouldShowTooltipOnTitleOverflow = false,\n    shouldForceBackground = false,\n    shouldForceBottomLine = false,\n    shouldForceHover = false,\n    shouldHideBottomLine = false,\n    shouldOpenImageOnClick = false,\n    shouldHideImageOrIconBackground,\n    shouldHideIndicator = false,\n    shouldPreventLayoutAnimation = false,\n    shouldRenderClosed = false,\n    shouldShowRoundImageOrIcon,\n    shouldShowSeparatorBelow = false,\n    subtitle,\n    title,\n    titleElement,\n}) => {\n    const {\n        incrementExpandableItemCount,\n        isAnyItemExpandable,\n        isWrapped,\n        openItemUuid,\n        updateOpenItemUuid,\n    } = useContext(ListContext);\n\n    const { isWrapped: isParentAccordionWrapped } = useContext(AccordionContext);\n\n    const areaProvider = useContext(AreaContext);\n\n    const isInitialRenderRef = useRef(true);\n    const listItemRef = useRef<HTMLDivElement>(null);\n\n    const uuid = useUuid();\n\n    const isExpandable = children !== undefined;\n    const isItemOpen = isOpen ?? openItemUuid === uuid;\n\n    const onCloseRef = useRef(onClose);\n    const onOpenRef = useRef(onOpen);\n\n    const [shouldEnableTooltip, setShouldEnableTooltip] = useState(false);\n\n    const shouldDisablePadding = useMemo(\n        () => areaProvider.shouldDisableListItemPadding ?? false,\n        [areaProvider.shouldDisableListItemPadding],\n    );\n\n    useEffect(() => {\n        onCloseRef.current = onClose;\n        onOpenRef.current = onOpen;\n    }, [isOpen, onClose, onOpen]);\n\n    useEffect(() => {\n        if (isInitialRenderRef.current) {\n            isInitialRenderRef.current = false;\n        } else if (isItemOpen) {\n            if (typeof onOpenRef.current === 'function') {\n                onOpenRef.current();\n            }\n        } else if (typeof onCloseRef.current === 'function') {\n            onCloseRef.current();\n        }\n    }, [isItemOpen]);\n\n    const handleHeadClick = useCallback<MouseEventHandler<HTMLDivElement>>(\n        (event) => {\n            if (isExpandable) {\n                updateOpenItemUuid(uuid);\n            }\n\n            if (typeof onClick === 'function') {\n                onClick(event);\n            }\n        },\n        [isExpandable, onClick, updateOpenItemUuid, uuid],\n    );\n\n    useEffect(() => {\n        if (isExpandable && !shouldHideIndicator) {\n            // The incrementExpandableItemCount function returns an cleanup\n            // function to decrement expandableItemCount if component unmounts\n            return incrementExpandableItemCount();\n        }\n\n        return undefined;\n    }, [incrementExpandableItemCount, isExpandable, shouldHideIndicator]);\n\n    useEffect(() => {\n        if (isDefaultOpen) {\n            updateOpenItemUuid(uuid, { shouldOnlyOpen: true });\n        }\n    }, [isDefaultOpen, updateOpenItemUuid, uuid]);\n\n    const isClickable = typeof onClick === 'function' || isExpandable;\n\n    const handleTitleWidthChange = (titleWidth: number) => {\n        if (listItemRef.current) {\n            const { offsetWidth } = listItemRef.current;\n\n            if (offsetWidth - 18 < titleWidth) {\n                setShouldEnableTooltip(true);\n            } else {\n                setShouldEnableTooltip(false);\n            }\n        }\n    };\n\n    const headContent = useMemo(\n        () => (\n            <ListItemHead\n                hoverItem={hoverItem}\n                careOfLocationId={careOfLocationId}\n                cornerImage={cornerImage}\n                icons={icons}\n                imageBackground={imageBackground}\n                images={images}\n                isAnyItemExpandable={isAnyItemExpandable}\n                isExpandable={isExpandable}\n                onTitleWidthChange={handleTitleWidthChange}\n                isOpen={isItemOpen}\n                isTitleGreyed={isTitleGreyed}\n                leftElements={leftElements}\n                onClick={isClickable ? handleHeadClick : undefined}\n                onLongPress={onLongPress}\n                shouldForceHover={shouldForceHover}\n                rightElements={rightElements}\n                shouldHideImageOrIconBackground={shouldHideImageOrIconBackground}\n                shouldHideIndicator={shouldHideIndicator}\n                shouldOpenImageOnClick={shouldOpenImageOnClick}\n                shouldShowRoundImageOrIcon={shouldShowRoundImageOrIcon}\n                subtitle={subtitle}\n                title={title}\n                titleElement={titleElement}\n            />\n        ),\n        [\n            careOfLocationId,\n            cornerImage,\n            handleHeadClick,\n            hoverItem,\n            icons,\n            imageBackground,\n            images,\n            isAnyItemExpandable,\n            isClickable,\n            isExpandable,\n            isItemOpen,\n            isTitleGreyed,\n            leftElements,\n            onLongPress,\n            rightElements,\n            shouldForceHover,\n            shouldHideImageOrIconBackground,\n            shouldHideIndicator,\n            shouldOpenImageOnClick,\n            shouldShowRoundImageOrIcon,\n            subtitle,\n            title,\n            titleElement,\n        ],\n    );\n\n    return (\n        <StyledMotionListItem\n            animate={{ height: 'auto', opacity: 1 }}\n            className=\"beta-chayns-list-item\"\n            exit={{ height: 0, opacity: 0 }}\n            initial={{ height: 0, opacity: 0 }}\n            key={`list-item-${uuid}`}\n            ref={listItemRef}\n            layout={shouldPreventLayoutAnimation ? undefined : 'position'}\n            $isClickable={isClickable}\n            $isInAccordion={typeof isParentAccordionWrapped === 'boolean' && !shouldDisablePadding}\n            $isOpen={isItemOpen}\n            $isWrapped={isWrapped}\n            $shouldForceBackground={shouldForceBackground}\n            $shouldForceBottomLine={shouldForceBottomLine}\n            $shouldHideBottomLine={shouldHideBottomLine}\n            $shouldHideIndicator={shouldHideIndicator}\n            $shouldShowSeparatorBelow={shouldShowSeparatorBelow}\n        >\n            {shouldShowTooltipOnTitleOverflow && shouldEnableTooltip ? (\n                <Tooltip\n                    shouldUseFullWidth\n                    item={\n                        <StyledListItemTooltip key={`list-item-tooltip-${uuid}`}>\n                            {title}\n                        </StyledListItemTooltip>\n                    }\n                >\n                    {headContent}\n                </Tooltip>\n            ) : (\n                headContent\n            )}\n            <AnimatePresence initial={false}>\n                {isExpandable && (isItemOpen || shouldRenderClosed) && (\n                    <ListItemBody\n                        id={uuid}\n                        key={`listItemBody-${uuid}`}\n                        shouldHideBody={shouldRenderClosed && !isItemOpen}\n                    >\n                        <AreaContextProvider>{children}</AreaContextProvider>\n                    </ListItemBody>\n                )}\n            </AnimatePresence>\n        </StyledMotionListItem>\n    );\n};\n\nListItem.displayName = 'ListItem';\n\nexport default ListItem;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ListItem.js","names":["_react","require","_react2","_interopRequireWildcard","_uuid","_Accordion","_AreaContextProvider","_List","_ListItemBody","_interopRequireDefault","_ListItemHead","_ListItem","_Tooltip","_reactResizeDetector","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ListItem","careOfLocationId","children","cornerImage","hoverItem","icons","imageBackground","images","isDefaultOpen","isOpen","isTitleGreyed","leftElements","onClick","onClose","onLongPress","onOpen","rightElements","shouldShowTooltipOnTitleOverflow","shouldForceBackground","shouldForceBottomLine","shouldForceHover","shouldHideBottomLine","shouldOpenImageOnClick","shouldHideImageOrIconBackground","shouldHideIndicator","shouldPreventLayoutAnimation","shouldRenderClosed","shouldShowRoundImageOrIcon","shouldShowSeparatorBelow","subtitle","title","titleElement","incrementExpandableItemCount","isAnyItemExpandable","isWrapped","openItemUuid","updateOpenItemUuid","useContext","ListContext","isParentAccordionWrapped","AccordionContext","areaProvider","AreaContext","isInitialRenderRef","useRef","ref","listItemRef","useResizeDetector","uuid","useUuid","isExpandable","undefined","isItemOpen","onCloseRef","onOpenRef","shouldEnableTooltip","setShouldEnableTooltip","useState","shouldDisablePadding","useMemo","shouldDisableListItemPadding","useEffect","current","handleHeadClick","useCallback","event","shouldOnlyOpen","isClickable","headContent","createElement","StyledMotionListItem","animate","height","opacity","className","exit","initial","key","layout","$isClickable","$isInAccordion","$isOpen","$isWrapped","$shouldForceBackground","$shouldForceBottomLine","$shouldHideBottomLine","$shouldHideIndicator","$shouldShowSeparatorBelow","shouldUseFullWidth","item","StyledListItemTooltip","style","cursor","AnimatePresence","id","shouldHideBody","displayName","_default","exports"],"sources":["../../../../../src/components/list/list-item/ListItem.tsx"],"sourcesContent":["import { AnimatePresence } from 'motion/react';\nimport React, {\n    CSSProperties,\n    FC,\n    MouseEventHandler,\n    ReactNode,\n    TouchEventHandler,\n    useCallback,\n    useContext,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport { useUuid } from '../../../hooks/uuid';\nimport type { IListItemRightElements } from '../../../types/list';\nimport { AccordionContext } from '../../accordion/Accordion';\nimport AreaContextProvider, { AreaContext } from '../../area-provider/AreaContextProvider';\nimport { ListContext } from '../List';\nimport ListItemBody from './list-item-body/ListItemBody';\nimport ListItemHead from './list-item-head/ListItemHead';\nimport { StyledListItemTooltip, StyledMotionListItem } from './ListItem.styles';\nimport Tooltip from '../../tooltip/Tooltip';\nimport { useResizeDetector } from 'react-resize-detector';\n\nexport type ListItemElements = [ReactNode, ...ReactNode[]];\n\nexport type ListItemProps = {\n    /**\n     * DEPRECATED: Use `cornerImage` instead.\n     */\n    careOfLocationId?: number;\n    /**\n     * The content of the `ListItem` body. When the `ListItem` has children,\n     * it can be opened and also gets an icon as an indicator automatically.\n     */\n    children?: ReactNode;\n    /**\n     * The image that is displayed in the bottom right corner of the grouped image of list item.\n     */\n    cornerImage?: string;\n    /**\n     * Element that is displayed when hovering over the `ListItem` on the right\n     * side. On mobile devices, this element is not displayed.\n     */\n    hoverItem?: ReactNode;\n    /**\n     * The FontAwesome or tobit icons to render like an image on the left side\n     * of the header. Multiple icons are stacked. See the `Icon` component\n     * documentation for more information.\n     */\n    icons?: string[];\n    /**\n     * The background of the image. This is only used if images are passed.\n     */\n    imageBackground?: CSSProperties['background'];\n    /**\n     * A list of image URLs that are displayed on the left side of the header.\n     * If multiple URLs are passed, the image is assembled from the first three\n     * image URLs as a puzzle.\n     */\n    images?: string[];\n    /**\n     * This can be used to automatically expand the `ListItem` during the first render.\n     */\n    isDefaultOpen?: boolean;\n    /**\n     * This overrides the internal opening state of the item and makes it controlled.\n     */\n    isOpen?: boolean;\n    /**\n     * Whether the ListItem locks disabled but has full functionality.\n     */\n    isTitleGreyed?: boolean;\n    /**\n     * Elements that are displayed on the left side of the header. If multiple\n     * elements are specified, they are displayed one aside the other.\n     */\n    leftElements?: ListItemElements;\n    /**\n     * Function to be executed when the header of the `ListItem` was clicked\n     */\n    onClick?: MouseEventHandler<HTMLDivElement>;\n    /**\n     * Function to be executed when the ListItem is closed.\n     */\n    onClose?: VoidFunction;\n    /**\n     * Function to be executed when the header of the `ListItem` is pressed for\n     * 400 milliseconds.\n     */\n    onLongPress?: TouchEventHandler<HTMLDivElement>;\n    /**\n     * Function to be executed when the ListItem is opened.\n     */\n    onOpen?: VoidFunction;\n    /**\n     * Elements that are displayed on the right side of the header. If multiple\n     * elements are specified, they are displayed one below the other.\n     */\n    rightElements?: IListItemRightElements;\n    /**\n     * This will force the background color of the ListItem to be used even if it is closed and not hovered.\n     */\n    shouldForceBackground?: boolean;\n    /**\n     * Whether the line should be forced, e.g., so that it is also displayed if the item is the last element in the list.\n     */\n    shouldForceBottomLine?: boolean;\n    /**\n     * Whether the hover item should be forced.\n     */\n    shouldForceHover?: boolean;\n    /**\n     * Whether the bottom line should be hidden.\n     */\n    shouldHideBottomLine?: boolean;\n    /**\n     * Whether the background and border of the shape on which the image or icon of the element is displayed should be\n     * hidden.\n     */\n    shouldHideImageOrIconBackground?: boolean;\n    /**\n     * If the `ListItem` is expandable, the indicator is displayed on the left\n     * side of the header. If this property is set to true, the indicator is\n     * hidden.\n     */\n    shouldHideIndicator?: boolean;\n    /**\n     * Whether the image should be opened on click.\n     */\n    shouldOpenImageOnClick?: boolean;\n    /**\n     * Whether the layout animation should be prevented. This is useful when the\n     * `ListItem` is used in a list with a lot of items and the layout animation\n     * is not desired.\n     */\n    shouldPreventLayoutAnimation?: boolean;\n    /**\n     * This will render the ListItem closed on the first render.\n     */\n    shouldRenderClosed?: boolean;\n    /**\n     * Whether the image or icon should be displayed in a round shape. This should always be used for images of persons.\n     */\n    shouldShowRoundImageOrIcon?: boolean;\n    /**\n     * Whether a separator should be displayed below this item. In this case, the border is displayed thicker than normal.\n     */\n    shouldShowSeparatorBelow?: boolean;\n    /**\n     * Whether a Tooltip should be displayed on hover, if the title is cut.\n     */\n    shouldShowTooltipOnTitleOverflow?: boolean;\n    /**\n     * Subtitle of the `ListItem` displayed in the head below the title\n     */\n    subtitle?: ReactNode;\n    /**\n     * Title of the `ListItem` displayed in the head\n     */\n    title: ReactNode;\n    /**\n     * Additional elements to be displayed in the header next to the title.\n     */\n    titleElement?: ReactNode;\n};\n\nconst ListItem: FC<ListItemProps> = ({\n    careOfLocationId,\n    children,\n    cornerImage,\n    hoverItem,\n    icons,\n    imageBackground,\n    images,\n    isDefaultOpen,\n    isOpen,\n    isTitleGreyed,\n    leftElements,\n    onClick,\n    onClose,\n    onLongPress,\n    onOpen,\n    rightElements,\n    shouldShowTooltipOnTitleOverflow = false,\n    shouldForceBackground = false,\n    shouldForceBottomLine = false,\n    shouldForceHover = false,\n    shouldHideBottomLine = false,\n    shouldOpenImageOnClick = false,\n    shouldHideImageOrIconBackground,\n    shouldHideIndicator = false,\n    shouldPreventLayoutAnimation = false,\n    shouldRenderClosed = false,\n    shouldShowRoundImageOrIcon,\n    shouldShowSeparatorBelow = false,\n    subtitle,\n    title,\n    titleElement,\n}) => {\n    const {\n        incrementExpandableItemCount,\n        isAnyItemExpandable,\n        isWrapped,\n        openItemUuid,\n        updateOpenItemUuid,\n    } = useContext(ListContext);\n\n    const { isWrapped: isParentAccordionWrapped } = useContext(AccordionContext);\n\n    const areaProvider = useContext(AreaContext);\n\n    const isInitialRenderRef = useRef(true);\n\n    const { ref: listItemRef } = useResizeDetector();\n\n    const uuid = useUuid();\n\n    const isExpandable = children !== undefined;\n    const isItemOpen = isOpen ?? openItemUuid === uuid;\n\n    const onCloseRef = useRef(onClose);\n    const onOpenRef = useRef(onOpen);\n\n    const [shouldEnableTooltip, setShouldEnableTooltip] = useState(false);\n\n    const shouldDisablePadding = useMemo(\n        () => areaProvider.shouldDisableListItemPadding ?? false,\n        [areaProvider.shouldDisableListItemPadding],\n    );\n\n    useEffect(() => {\n        onCloseRef.current = onClose;\n        onOpenRef.current = onOpen;\n    }, [isOpen, onClose, onOpen]);\n\n    useEffect(() => {\n        if (isInitialRenderRef.current) {\n            isInitialRenderRef.current = false;\n        } else if (isItemOpen) {\n            if (typeof onOpenRef.current === 'function') {\n                onOpenRef.current();\n            }\n        } else if (typeof onCloseRef.current === 'function') {\n            onCloseRef.current();\n        }\n    }, [isItemOpen]);\n\n    const handleHeadClick = useCallback<MouseEventHandler<HTMLDivElement>>(\n        (event) => {\n            if (isExpandable) {\n                updateOpenItemUuid(uuid);\n            }\n\n            if (typeof onClick === 'function') {\n                onClick(event);\n            }\n        },\n        [isExpandable, onClick, updateOpenItemUuid, uuid],\n    );\n\n    useEffect(() => {\n        if (isExpandable && !shouldHideIndicator) {\n            // The incrementExpandableItemCount function returns an cleanup\n            // function to decrement expandableItemCount if component unmounts\n            return incrementExpandableItemCount();\n        }\n\n        return undefined;\n    }, [incrementExpandableItemCount, isExpandable, shouldHideIndicator]);\n\n    useEffect(() => {\n        if (isDefaultOpen) {\n            updateOpenItemUuid(uuid, { shouldOnlyOpen: true });\n        }\n    }, [isDefaultOpen, updateOpenItemUuid, uuid]);\n\n    const isClickable = typeof onClick === 'function' || isExpandable;\n\n    const headContent = useMemo(\n        () => (\n            <ListItemHead\n                hoverItem={hoverItem}\n                careOfLocationId={careOfLocationId}\n                cornerImage={cornerImage}\n                icons={icons}\n                imageBackground={imageBackground}\n                images={images}\n                isAnyItemExpandable={isAnyItemExpandable}\n                isExpandable={isExpandable}\n                isOpen={isItemOpen}\n                isTitleGreyed={isTitleGreyed}\n                leftElements={leftElements}\n                onClick={isClickable ? handleHeadClick : undefined}\n                onLongPress={onLongPress}\n                shouldForceHover={shouldForceHover}\n                rightElements={rightElements}\n                shouldHideImageOrIconBackground={shouldHideImageOrIconBackground}\n                shouldHideIndicator={shouldHideIndicator}\n                shouldOpenImageOnClick={shouldOpenImageOnClick}\n                shouldShowRoundImageOrIcon={shouldShowRoundImageOrIcon}\n                subtitle={subtitle}\n                title={title}\n                titleElement={titleElement}\n                setShouldEnableTooltip={setShouldEnableTooltip}\n            />\n        ),\n        [\n            careOfLocationId,\n            cornerImage,\n            handleHeadClick,\n            hoverItem,\n            icons,\n            imageBackground,\n            images,\n            isAnyItemExpandable,\n            isClickable,\n            isExpandable,\n            isItemOpen,\n            isTitleGreyed,\n            leftElements,\n            onLongPress,\n            rightElements,\n            shouldForceHover,\n            shouldHideImageOrIconBackground,\n            shouldHideIndicator,\n            shouldOpenImageOnClick,\n            shouldShowRoundImageOrIcon,\n            subtitle,\n            title,\n            titleElement,\n        ],\n    );\n\n    return (\n        <StyledMotionListItem\n            animate={{ height: 'auto', opacity: 1 }}\n            className=\"beta-chayns-list-item\"\n            exit={{ height: 0, opacity: 0 }}\n            initial={{ height: 0, opacity: 0 }}\n            key={`list-item-${uuid}`}\n            ref={listItemRef}\n            layout={shouldPreventLayoutAnimation ? undefined : 'position'}\n            $isClickable={isClickable}\n            $isInAccordion={typeof isParentAccordionWrapped === 'boolean' && !shouldDisablePadding}\n            $isOpen={isItemOpen}\n            $isWrapped={isWrapped}\n            $shouldForceBackground={shouldForceBackground}\n            $shouldForceBottomLine={shouldForceBottomLine}\n            $shouldHideBottomLine={shouldHideBottomLine}\n            $shouldHideIndicator={shouldHideIndicator}\n            $shouldShowSeparatorBelow={shouldShowSeparatorBelow}\n        >\n            {shouldShowTooltipOnTitleOverflow && shouldEnableTooltip ? (\n                <Tooltip\n                    shouldUseFullWidth\n                    item={\n                        <StyledListItemTooltip\n                            style={{ cursor: 'default' }}\n                            key={`list-item-tooltip-${uuid}`}\n                        >\n                            {title}\n                        </StyledListItemTooltip>\n                    }\n                >\n                    {headContent}\n                </Tooltip>\n            ) : (\n                headContent\n            )}\n            <AnimatePresence initial={false}>\n                {isExpandable && (isItemOpen || shouldRenderClosed) && (\n                    <ListItemBody\n                        id={uuid}\n                        key={`listItemBody-${uuid}`}\n                        shouldHideBody={shouldRenderClosed && !isItemOpen}\n                    >\n                        <AreaContextProvider>{children}</AreaContextProvider>\n                    </ListItemBody>\n                )}\n            </AnimatePresence>\n        </StyledMotionListItem>\n    );\n};\n\nListItem.displayName = 'ListItem';\n\nexport default ListItem;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/list/list-item/list-item-head/ListItemHead.js

@@ -11,6 +11,7 @@ var _ListItemIcon = _interopRequireDefault(require("./list-item-icon/ListItemIco
 var _ListItemImage = _interopRequireDefault(require("./list-item-image/ListItemImage"));
 var _ListItemRightElements = _interopRequireDefault(require("./list-item-right-elements/ListItemRightElements"));
 var _ListItemHead = require("./ListItemHead.styles");
+var _reactResizeDetector = require("react-resize-detector");
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 const ListItemHead = ({
@@ -31,14 +32,13 @@ const ListItemHead = ({
   shouldHideImageOrIconBackground,
   shouldHideIndicator,
   shouldOpenImageOnClick,
-  onTitleWidthChange,
   shouldShowRoundImageOrIcon,
   subtitle,
   shouldForceHover,
   title,
-  titleElement
+  titleElement,
+  setShouldEnableTooltip
 }) => {
-  const [shouldRenderPseudoElements, setShouldRenderPseudoElements] = (0, _react.useState)(true);
   const [shouldShowHoverItem, setShouldShowHoverItem] = (0, _react.useState)(false);
   const [openTitleWidth, setOpenTitleWidth] = (0, _react.useState)(0);
   const [headHeight, setHeadHeight] = (0, _react.useState)({
@@ -47,56 +47,52 @@ const ListItemHead = ({
   });
   const [, setIsFirstRender] = (0, _react.useState)(false);
   const longPressTimeoutRef = (0, _react.useRef)();
-  const pseudoTitleOpenRef = (0, _react.useRef)(null);
-  const pseudoTitleClosedRef = (0, _react.useRef)(null);
-  const pseudoSubtitleOpenRef = (0, _react.useRef)(null);
-  const pseudoSubtitleClosedRef = (0, _react.useRef)(null);
   const shouldShowSubtitleRow = subtitle || typeof subtitle === 'string';
-  (0, _react.useEffect)(() => {
-    if (pseudoTitleClosedRef.current) {
-      const {
-        width
-      } = pseudoTitleClosedRef.current.getBoundingClientRect();
-      onTitleWidthChange(width);
+  const handleShowTooltipResize = (0, _react.useCallback)(ref => {
+    if (ref.current) {
+      const el = ref.current;
+      setShouldEnableTooltip(el.scrollWidth > el.clientWidth);
     }
-  }, [onTitleWidthChange]);
-  const shouldShowMultilineTitle = (0, _react.useMemo)(() => !subtitle, [subtitle]);
-  (0, _react.useEffect)(() => {
-    window.setTimeout(() => {
-      if (pseudoTitleOpenRef.current && pseudoTitleClosedRef.current) {
-        const {
-          height: closedTitleHeight
-        } = pseudoTitleClosedRef.current.getBoundingClientRect();
-        const {
-          height: openTitleHeight,
-          width: openWidth
-        } = pseudoTitleOpenRef.current.getBoundingClientRect();
-        setOpenTitleWidth(openWidth);
-        let closedHeight = closedTitleHeight + 24;
-        let openHeight = openTitleHeight + 24;
-        if (shouldShowSubtitleRow) {
-          if (pseudoSubtitleOpenRef.current && pseudoSubtitleClosedRef.current) {
-            const {
-              height: closedSubtitleHeight
-            } = pseudoSubtitleClosedRef.current.getBoundingClientRect();
-            const {
-              height: openSubtitleHeight
-            } = pseudoSubtitleOpenRef.current.getBoundingClientRect();
-            closedHeight += closedSubtitleHeight + 4;
-            openHeight += openSubtitleHeight + 4;
-          }
+  }, [setShouldEnableTooltip]);
+  const {
+    ref: titleRef,
+    height: titleHeight,
+    width: titleWidth
+  } = (0, _reactResizeDetector.useResizeDetector)({
+    onResize: () => handleShowTooltipResize(titleRef)
+  });
+  const {
+    ref: ellipsisTitleRef,
+    height: ellipsisTitleHeight
+  } = (0, _reactResizeDetector.useResizeDetector)({
+    onResize: () => handleShowTooltipResize(ellipsisTitleRef)
+  });
+  const {
+    ref: subTitleRef,
+    height: subTitleHeight
+  } = (0, _reactResizeDetector.useResizeDetector)();
+  const {
+    ref: listItemRef
+  } = (0, _reactResizeDetector.useResizeDetector)({
+    onResize: () => {
+      setOpenTitleWidth(titleWidth ?? 0);
+      let closedHeight = (ellipsisTitleHeight ?? 0) + 24;
+      let openHeight = (titleHeight ?? 0) + 24;
+      if (shouldShowSubtitleRow) {
+        if (subTitleHeight) {
+          closedHeight += (ellipsisTitleHeight ?? 0) + 4;
+          openHeight += subTitleHeight + 4;
         }
-        setHeadHeight({
-          closed: closedHeight,
-          open: openHeight
-        });
-        setShouldRenderPseudoElements(false);
       }
-    }, 100);
-  }, [shouldShowSubtitleRow]);
-  (0, _react.useEffect)(() => {
-    if (subtitle || title) setShouldRenderPseudoElements(true);
-  }, [subtitle, title]);
+      setHeadHeight({
+        closed: closedHeight,
+        open: openHeight
+      });
+    },
+    refreshMode: 'debounce',
+    refreshRate: 100
+  });
+  const shouldShowMultilineTitle = (0, _react.useMemo)(() => !subtitle, [subtitle]);
 
   // This is used to trigger a rerender, so the head height can be calculated
   (0, _react.useEffect)(() => {
@@ -104,13 +100,6 @@ const ListItemHead = ({
   }, []);
   const handleMouseEnter = (0, _react.useCallback)(() => setShouldShowHoverItem(true), []);
   const handleMouseLeave = (0, _react.useCallback)(() => setShouldShowHoverItem(false), []);
-  const marginTop = (0, _react.useMemo)(() => {
-    const height = headHeight[isOpen ? 'open' : 'closed'];
-    if (height < 64) {
-      return (64 - height) / 2;
-    }
-    return 0;
-  }, [headHeight, isOpen]);
   const handleTouchStart = (0, _react.useCallback)(event => {
     longPressTimeoutRef.current = window.setTimeout(() => {
       if (typeof onLongPress === 'function') {
@@ -188,28 +177,45 @@ const ListItemHead = ({
   }, isExpandable && !shouldHideIndicator && /*#__PURE__*/_react.default.createElement(_Icon.default, {
     icons: ['fa fa-chevron-right']
   })), leftElements, iconOrImageElement), /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadContent, {
+    ref: listItemRef,
     $isIconOrImageGiven: iconOrImageElement !== undefined,
-    $marginTop: marginTop,
     $isOpen: isOpen
-  }, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitle, null, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitleContent, null, shouldRenderPseudoElements && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitleTextPseudo, {
-    ref: pseudoTitleOpenRef,
-    $isOpen: true,
-    $shouldShowMultilineTitle: false
-  }, title), /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitleTextPseudo, {
-    ref: pseudoTitleClosedRef,
-    $isOpen: false,
-    $shouldShowMultilineTitle: shouldShowMultilineTitle
-  }, title)), /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitleText, {
-    $isOpen: isOpen,
+  }, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitle, null, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitleContent, null, isOpen ? /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitleText, {
+    ref: titleRef,
+    $width: openTitleWidth,
+    $shouldShowMultilineTitle: shouldShowMultilineTitle,
+    initial: {
+      opacity: 0
+    },
+    animate: {
+      opacity: 1
+    },
+    exit: {
+      opacity: 0
+    },
+    transition: {
+      duration: 0.4
+    }
+  }, title) : /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitleText, {
+    $isEllipsis: true,
+    ref: ellipsisTitleRef,
     $width: openTitleWidth,
-    $shouldShowMultilineTitle: shouldShowMultilineTitle
-  }, title), /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitleElement, null, titleElement))), shouldShowSubtitleRow && /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadSubtitle, null, shouldRenderPseudoElements && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadSubtitleTextPseudo, {
-    ref: pseudoSubtitleOpenRef,
-    $isOpen: true
-  }, subtitle), /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadSubtitleTextPseudo, {
-    ref: pseudoSubtitleClosedRef,
-    $isOpen: false
-  }, subtitle)), /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadSubtitleText, {
+    $shouldShowMultilineTitle: shouldShowMultilineTitle,
+    initial: {
+      opacity: 0
+    },
+    animate: {
+      opacity: 1
+    },
+    exit: {
+      opacity: 0
+    },
+    transition: {
+      duration: 0.3
+    }
+  }, title), /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitleElement, null, titleElement))), shouldShowSubtitleRow && /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadSubtitle, {
+    ref: subTitleRef
+  }, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadSubtitleText, {
     $isOpen: isOpen
   }, subtitle))), rightElements && /*#__PURE__*/_react.default.createElement(_ListItemRightElements.default, {
     rightElements: rightElements,

package/lib/cjs/components/list/list-item/list-item-head/ListItemHead.js.map

@@ -1 +1 @@
-{"version":3,"file":"ListItemHead.js","names":["_react","_interopRequireWildcard","require","_accordion","_Icon","_interopRequireDefault","_ListItemIcon","_ListItemImage","_ListItemRightElements","_ListItemHead","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ListItemHead","careOfLocationId","cornerImage","hoverItem","icons","imageBackground","images","isAnyItemExpandable","isExpandable","isOpen","isTitleGreyed","leftElements","onClick","onLongPress","rightElements","shouldHideImageOrIconBackground","shouldHideIndicator","shouldOpenImageOnClick","onTitleWidthChange","shouldShowRoundImageOrIcon","subtitle","shouldForceHover","title","titleElement","shouldRenderPseudoElements","setShouldRenderPseudoElements","useState","shouldShowHoverItem","setShouldShowHoverItem","openTitleWidth","setOpenTitleWidth","headHeight","setHeadHeight","closed","open","setIsFirstRender","longPressTimeoutRef","useRef","pseudoTitleOpenRef","pseudoTitleClosedRef","pseudoSubtitleOpenRef","pseudoSubtitleClosedRef","shouldShowSubtitleRow","useEffect","current","width","getBoundingClientRect","shouldShowMultilineTitle","useMemo","window","setTimeout","height","closedTitleHeight","openTitleHeight","openWidth","closedHeight","openHeight","closedSubtitleHeight","openSubtitleHeight","handleMouseEnter","useCallback","handleMouseLeave","marginTop","handleTouchStart","event","handleTouchEnd","clearTimeout","shouldPreventRightElementClick","bottom","getElementClickEvent","center","top","iconOrImageElement","createElement","shouldHideBackground","shouldShowRoundIcon","shouldShowRoundImage","undefined","StyledListItemHead","animate","opacity","initial","transition","duration","type","className","$isClickable","$isAnyItemExpandable","onMouseEnter","onMouseLeave","onTouchStart","onTouchEnd","StyledListItemHeadLeftWrapper","StyledMotionListItemHeadIndicator","rotate","StyledListItemHeadContent","$isIconOrImageGiven","$marginTop","$isOpen","StyledListItemHeadTitle","StyledListItemHeadTitleContent","Fragment","StyledListItemHeadTitleTextPseudo","ref","$shouldShowMultilineTitle","StyledListItemHeadTitleText","$width","StyledListItemHeadTitleElement","StyledListItemHeadSubtitle","StyledListItemHeadSubtitleTextPseudo","StyledListItemHeadSubtitleText","StyledMotionListItemHeadHoverItemWrapper","marginLeft","StyledMotionListItemHeadHoverItem","displayName","_default","exports"],"sources":["../../../../../../src/components/list/list-item/list-item-head/ListItemHead.tsx"],"sourcesContent":["import React, {\n    CSSProperties,\n    FC,\n    MouseEventHandler,\n    ReactNode,\n    TouchEventHandler,\n    useCallback,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport type { IListItemRightElements } from '../../../../types/list';\nimport { getElementClickEvent } from '../../../../utils/accordion';\nimport Icon from '../../../icon/Icon';\nimport ListItemIcon from './list-item-icon/ListItemIcon';\nimport ListItemImage from './list-item-image/ListItemImage';\nimport ListItemRightElements from './list-item-right-elements/ListItemRightElements';\nimport {\n    StyledListItemHead,\n    StyledListItemHeadContent,\n    StyledListItemHeadLeftWrapper,\n    StyledListItemHeadSubtitle,\n    StyledListItemHeadSubtitleText,\n    StyledListItemHeadSubtitleTextPseudo,\n    StyledListItemHeadTitle,\n    StyledListItemHeadTitleContent,\n    StyledListItemHeadTitleElement,\n    StyledListItemHeadTitleText,\n    StyledListItemHeadTitleTextPseudo,\n    StyledMotionListItemHeadHoverItem,\n    StyledMotionListItemHeadHoverItemWrapper,\n    StyledMotionListItemHeadIndicator,\n} from './ListItemHead.styles';\n\ninterface HeadHeight {\n    closed: number;\n    open: number;\n}\n\ntype ListItemHeadProps = {\n    careOfLocationId?: number;\n    cornerImage?: string;\n    hoverItem?: ReactNode;\n    icons?: string[];\n    imageBackground?: CSSProperties['background'];\n    images?: string[];\n    isAnyItemExpandable: boolean;\n    isExpandable: boolean;\n    isOpen: boolean;\n    isTitleGreyed?: boolean;\n    leftElements?: ReactNode;\n    onClick?: MouseEventHandler<HTMLDivElement>;\n    onLongPress?: TouchEventHandler<HTMLDivElement>;\n    rightElements?: IListItemRightElements;\n    shouldHideImageOrIconBackground?: boolean;\n    shouldHideIndicator?: boolean;\n    shouldOpenImageOnClick: boolean;\n    shouldShowRoundImageOrIcon?: boolean;\n    subtitle?: ReactNode;\n    title: ReactNode;\n    onTitleWidthChange: (width: number) => void;\n    titleElement?: ReactNode;\n    shouldForceHover?: boolean;\n};\n\nconst ListItemHead: FC<ListItemHeadProps> = ({\n    careOfLocationId,\n    cornerImage,\n    hoverItem,\n    icons,\n    imageBackground,\n    images,\n    isAnyItemExpandable,\n    isExpandable,\n    isOpen,\n    isTitleGreyed,\n    leftElements,\n    onClick,\n    onLongPress,\n    rightElements,\n    shouldHideImageOrIconBackground,\n    shouldHideIndicator,\n    shouldOpenImageOnClick,\n    onTitleWidthChange,\n    shouldShowRoundImageOrIcon,\n    subtitle,\n    shouldForceHover,\n    title,\n    titleElement,\n}) => {\n    const [shouldRenderPseudoElements, setShouldRenderPseudoElements] = useState(true);\n    const [shouldShowHoverItem, setShouldShowHoverItem] = useState(false);\n    const [openTitleWidth, setOpenTitleWidth] = useState(0);\n    const [headHeight, setHeadHeight] = useState<HeadHeight>({ closed: 64, open: 64 });\n    const [, setIsFirstRender] = useState(false);\n\n    const longPressTimeoutRef = useRef<number>();\n\n    const pseudoTitleOpenRef = useRef<HTMLDivElement>(null);\n    const pseudoTitleClosedRef = useRef<HTMLDivElement>(null);\n    const pseudoSubtitleOpenRef = useRef<HTMLDivElement>(null);\n    const pseudoSubtitleClosedRef = useRef<HTMLDivElement>(null);\n\n    const shouldShowSubtitleRow = subtitle || typeof subtitle === 'string';\n\n    useEffect(() => {\n        if (pseudoTitleClosedRef.current) {\n            const { width } = pseudoTitleClosedRef.current.getBoundingClientRect();\n\n            onTitleWidthChange(width);\n        }\n    }, [onTitleWidthChange]);\n\n    const shouldShowMultilineTitle = useMemo(() => !subtitle, [subtitle]);\n\n    useEffect(() => {\n        window.setTimeout(() => {\n            if (pseudoTitleOpenRef.current && pseudoTitleClosedRef.current) {\n                const { height: closedTitleHeight } =\n                    pseudoTitleClosedRef.current.getBoundingClientRect();\n                const { height: openTitleHeight, width: openWidth } =\n                    pseudoTitleOpenRef.current.getBoundingClientRect();\n\n                setOpenTitleWidth(openWidth);\n\n                let closedHeight = closedTitleHeight + 24;\n                let openHeight = openTitleHeight + 24;\n\n                if (shouldShowSubtitleRow) {\n                    if (pseudoSubtitleOpenRef.current && pseudoSubtitleClosedRef.current) {\n                        const { height: closedSubtitleHeight } =\n                            pseudoSubtitleClosedRef.current.getBoundingClientRect();\n                        const { height: openSubtitleHeight } =\n                            pseudoSubtitleOpenRef.current.getBoundingClientRect();\n\n                        closedHeight += closedSubtitleHeight + 4;\n                        openHeight += openSubtitleHeight + 4;\n                    }\n                }\n\n                setHeadHeight({ closed: closedHeight, open: openHeight });\n\n                setShouldRenderPseudoElements(false);\n            }\n        }, 100);\n    }, [shouldShowSubtitleRow]);\n\n    useEffect(() => {\n        if (subtitle || title) setShouldRenderPseudoElements(true);\n    }, [subtitle, title]);\n\n    // This is used to trigger a rerender, so the head height can be calculated\n    useEffect(() => {\n        setIsFirstRender(true);\n    }, []);\n\n    const handleMouseEnter = useCallback(() => setShouldShowHoverItem(true), []);\n\n    const handleMouseLeave = useCallback(() => setShouldShowHoverItem(false), []);\n\n    const marginTop = useMemo(() => {\n        const height = headHeight[isOpen ? 'open' : 'closed'];\n\n        if (height < 64) {\n            return (64 - height) / 2;\n        }\n\n        return 0;\n    }, [headHeight, isOpen]);\n\n    const handleTouchStart = useCallback<TouchEventHandler<HTMLDivElement>>(\n        (event) => {\n            longPressTimeoutRef.current = window.setTimeout(() => {\n                if (typeof onLongPress === 'function') {\n                    onLongPress(event);\n                }\n            }, 400);\n        },\n        [onLongPress],\n    );\n\n    const handleTouchEnd = useCallback(() => {\n        clearTimeout(longPressTimeoutRef.current);\n    }, []);\n\n    const shouldPreventRightElementClick = useMemo(() => {\n        if (!rightElements) return false;\n\n        if (\n            typeof rightElements === 'object' &&\n            ('bottom' in rightElements || 'center' in rightElements || 'top' in rightElements)\n        ) {\n            if (rightElements.bottom && getElementClickEvent(rightElements.bottom)) {\n                return true;\n            }\n\n            if (rightElements.center && getElementClickEvent(rightElements.center)) {\n                return true;\n            }\n\n            if (rightElements.top && getElementClickEvent(rightElements.top)) {\n                return true;\n            }\n        } else {\n            return getElementClickEvent(rightElements as ReactNode);\n        }\n\n        return false;\n    }, [rightElements]);\n\n    const iconOrImageElement = useMemo(() => {\n        if (icons) {\n            return (\n                <ListItemIcon\n                    icons={icons}\n                    shouldHideBackground={!!shouldHideImageOrIconBackground}\n                    shouldShowRoundIcon={!!shouldShowRoundImageOrIcon}\n                />\n            );\n        }\n\n        if (images) {\n            return (\n                <ListItemImage\n                    imageBackground={imageBackground}\n                    careOfLocationId={careOfLocationId}\n                    cornerImage={cornerImage}\n                    images={images}\n                    shouldOpenImageOnClick={shouldOpenImageOnClick}\n                    shouldHideBackground={!!shouldHideImageOrIconBackground}\n                    shouldShowRoundImage={!!shouldShowRoundImageOrIcon}\n                />\n            );\n        }\n\n        return undefined;\n    }, [\n        careOfLocationId,\n        cornerImage,\n        icons,\n        imageBackground,\n        images,\n        shouldHideImageOrIconBackground,\n        shouldOpenImageOnClick,\n        shouldShowRoundImageOrIcon,\n    ]);\n\n    return (\n        <StyledListItemHead\n            animate={{\n                height: isOpen ? headHeight.open : headHeight.closed,\n                opacity: isTitleGreyed ? 0.5 : 1,\n            }}\n            initial={false}\n            transition={{ duration: 0.2, type: 'tween' }}\n            className=\"beta-chayns-list-item-head\"\n            $isClickable={typeof onClick === 'function' || isExpandable}\n            $isAnyItemExpandable={isAnyItemExpandable}\n            onClick={onClick}\n            onMouseEnter={handleMouseEnter}\n            onMouseLeave={handleMouseLeave}\n            onTouchStart={typeof onLongPress === 'function' ? handleTouchStart : undefined}\n            onTouchEnd={typeof onLongPress === 'function' ? handleTouchEnd : undefined}\n        >\n            <StyledListItemHeadLeftWrapper>\n                {isAnyItemExpandable && (\n                    <StyledMotionListItemHeadIndicator\n                        animate={{ rotate: isOpen ? 90 : 0 }}\n                        initial={false}\n                        transition={{ type: 'tween' }}\n                    >\n                        {isExpandable && !shouldHideIndicator && (\n                            <Icon icons={['fa fa-chevron-right']} />\n                        )}\n                    </StyledMotionListItemHeadIndicator>\n                )}\n                {leftElements}\n                {iconOrImageElement}\n            </StyledListItemHeadLeftWrapper>\n            <StyledListItemHeadContent\n                $isIconOrImageGiven={iconOrImageElement !== undefined}\n                $marginTop={marginTop}\n                $isOpen={isOpen}\n            >\n                <StyledListItemHeadTitle>\n                    <StyledListItemHeadTitleContent>\n                        {shouldRenderPseudoElements && (\n                            <>\n                                <StyledListItemHeadTitleTextPseudo\n                                    ref={pseudoTitleOpenRef}\n                                    $isOpen\n                                    $shouldShowMultilineTitle={false}\n                                >\n                                    {title}\n                                </StyledListItemHeadTitleTextPseudo>\n                                <StyledListItemHeadTitleTextPseudo\n                                    ref={pseudoTitleClosedRef}\n                                    $isOpen={false}\n                                    $shouldShowMultilineTitle={shouldShowMultilineTitle}\n                                >\n                                    {title}\n                                </StyledListItemHeadTitleTextPseudo>\n                            </>\n                        )}\n                        <StyledListItemHeadTitleText\n                            $isOpen={isOpen}\n                            $width={openTitleWidth}\n                            $shouldShowMultilineTitle={shouldShowMultilineTitle}\n                        >\n                            {title}\n                        </StyledListItemHeadTitleText>\n                        <StyledListItemHeadTitleElement>\n                            {titleElement}\n                        </StyledListItemHeadTitleElement>\n                    </StyledListItemHeadTitleContent>\n                </StyledListItemHeadTitle>\n                {shouldShowSubtitleRow && (\n                    <StyledListItemHeadSubtitle>\n                        {shouldRenderPseudoElements && (\n                            <>\n                                <StyledListItemHeadSubtitleTextPseudo\n                                    ref={pseudoSubtitleOpenRef}\n                                    $isOpen\n                                >\n                                    {subtitle}\n                                </StyledListItemHeadSubtitleTextPseudo>\n                                <StyledListItemHeadSubtitleTextPseudo\n                                    ref={pseudoSubtitleClosedRef}\n                                    $isOpen={false}\n                                >\n                                    {subtitle}\n                                </StyledListItemHeadSubtitleTextPseudo>\n                            </>\n                        )}\n                        <StyledListItemHeadSubtitleText $isOpen={isOpen}>\n                            {subtitle}\n                        </StyledListItemHeadSubtitleText>\n                    </StyledListItemHeadSubtitle>\n                )}\n            </StyledListItemHeadContent>\n            {rightElements && (\n                <ListItemRightElements\n                    rightElements={rightElements}\n                    shouldPreventRightElementClick={shouldPreventRightElementClick}\n                />\n            )}\n            {hoverItem && (\n                <StyledMotionListItemHeadHoverItemWrapper\n                    className=\"beta-chayns-list-item-hover-item\"\n                    animate={{\n                        marginLeft: shouldForceHover || shouldShowHoverItem ? 8 : 0,\n                        opacity: shouldForceHover || shouldShowHoverItem ? 1 : 0,\n                        width: shouldForceHover || shouldShowHoverItem ? 'auto' : 0,\n                    }}\n                    initial={false}\n                    transition={{ duration: 0.15, type: 'tween' }}\n                >\n                    <StyledMotionListItemHeadHoverItem>\n                        {hoverItem}\n                    </StyledMotionListItemHeadHoverItem>\n                </StyledMotionListItemHeadHoverItemWrapper>\n            )}\n        </StyledListItemHead>\n    );\n};\n\nListItemHead.displayName = 'ListItemHead';\n\nexport default ListItemHead;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ListItemHead.js","names":["_react","_interopRequireWildcard","require","_accordion","_Icon","_interopRequireDefault","_ListItemIcon","_ListItemImage","_ListItemRightElements","_ListItemHead","_reactResizeDetector","e","__esModule","default","t","WeakMap","r","n","o","i","f","__proto__","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","ListItemHead","careOfLocationId","cornerImage","hoverItem","icons","imageBackground","images","isAnyItemExpandable","isExpandable","isOpen","isTitleGreyed","leftElements","onClick","onLongPress","rightElements","shouldHideImageOrIconBackground","shouldHideIndicator","shouldOpenImageOnClick","shouldShowRoundImageOrIcon","subtitle","shouldForceHover","title","titleElement","setShouldEnableTooltip","shouldShowHoverItem","setShouldShowHoverItem","useState","openTitleWidth","setOpenTitleWidth","headHeight","setHeadHeight","closed","open","setIsFirstRender","longPressTimeoutRef","useRef","shouldShowSubtitleRow","handleShowTooltipResize","useCallback","ref","current","el","scrollWidth","clientWidth","titleRef","height","titleHeight","width","titleWidth","useResizeDetector","onResize","ellipsisTitleRef","ellipsisTitleHeight","subTitleRef","subTitleHeight","listItemRef","closedHeight","openHeight","refreshMode","refreshRate","shouldShowMultilineTitle","useMemo","useEffect","handleMouseEnter","handleMouseLeave","handleTouchStart","event","window","setTimeout","handleTouchEnd","clearTimeout","shouldPreventRightElementClick","bottom","getElementClickEvent","center","top","iconOrImageElement","createElement","shouldHideBackground","shouldShowRoundIcon","shouldShowRoundImage","undefined","StyledListItemHead","animate","opacity","initial","transition","duration","type","className","$isClickable","$isAnyItemExpandable","onMouseEnter","onMouseLeave","onTouchStart","onTouchEnd","StyledListItemHeadLeftWrapper","StyledMotionListItemHeadIndicator","rotate","StyledListItemHeadContent","$isIconOrImageGiven","$isOpen","StyledListItemHeadTitle","StyledListItemHeadTitleContent","StyledListItemHeadTitleText","$width","$shouldShowMultilineTitle","exit","$isEllipsis","StyledListItemHeadTitleElement","StyledListItemHeadSubtitle","StyledListItemHeadSubtitleText","StyledMotionListItemHeadHoverItemWrapper","marginLeft","StyledMotionListItemHeadHoverItem","displayName","_default","exports"],"sources":["../../../../../../src/components/list/list-item/list-item-head/ListItemHead.tsx"],"sourcesContent":["import React, {\n    CSSProperties,\n    FC,\n    MouseEventHandler,\n    ReactNode,\n    TouchEventHandler,\n    useCallback,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport type { IListItemRightElements } from '../../../../types/list';\nimport { getElementClickEvent } from '../../../../utils/accordion';\nimport Icon from '../../../icon/Icon';\nimport ListItemIcon from './list-item-icon/ListItemIcon';\nimport ListItemImage from './list-item-image/ListItemImage';\nimport ListItemRightElements from './list-item-right-elements/ListItemRightElements';\nimport {\n    StyledListItemHead,\n    StyledListItemHeadContent,\n    StyledListItemHeadLeftWrapper,\n    StyledListItemHeadSubtitle,\n    StyledListItemHeadSubtitleText,\n    StyledListItemHeadTitle,\n    StyledListItemHeadTitleContent,\n    StyledListItemHeadTitleElement,\n    StyledListItemHeadTitleText,\n    StyledMotionListItemHeadHoverItem,\n    StyledMotionListItemHeadHoverItemWrapper,\n    StyledMotionListItemHeadIndicator,\n} from './ListItemHead.styles';\nimport { useResizeDetector } from 'react-resize-detector';\nimport { OnRefChangeType } from 'react-resize-detector/build/types';\n\ninterface HeadHeight {\n    closed: number;\n    open: number;\n}\n\ntype ListItemHeadProps = {\n    careOfLocationId?: number;\n    cornerImage?: string;\n    hoverItem?: ReactNode;\n    icons?: string[];\n    imageBackground?: CSSProperties['background'];\n    images?: string[];\n    isAnyItemExpandable: boolean;\n    isExpandable: boolean;\n    isOpen: boolean;\n    isTitleGreyed?: boolean;\n    leftElements?: ReactNode;\n    onClick?: MouseEventHandler<HTMLDivElement>;\n    onLongPress?: TouchEventHandler<HTMLDivElement>;\n    rightElements?: IListItemRightElements;\n    shouldHideImageOrIconBackground?: boolean;\n    shouldHideIndicator?: boolean;\n    shouldOpenImageOnClick: boolean;\n    shouldShowRoundImageOrIcon?: boolean;\n    subtitle?: ReactNode;\n    title: ReactNode;\n    titleElement?: ReactNode;\n    shouldForceHover?: boolean;\n    setShouldEnableTooltip: (value: boolean) => void;\n};\n\nconst ListItemHead: FC<ListItemHeadProps> = ({\n    careOfLocationId,\n    cornerImage,\n    hoverItem,\n    icons,\n    imageBackground,\n    images,\n    isAnyItemExpandable,\n    isExpandable,\n    isOpen,\n    isTitleGreyed,\n    leftElements,\n    onClick,\n    onLongPress,\n    rightElements,\n    shouldHideImageOrIconBackground,\n    shouldHideIndicator,\n    shouldOpenImageOnClick,\n    shouldShowRoundImageOrIcon,\n    subtitle,\n    shouldForceHover,\n    title,\n    titleElement,\n    setShouldEnableTooltip,\n}) => {\n    const [shouldShowHoverItem, setShouldShowHoverItem] = useState(false);\n    const [openTitleWidth, setOpenTitleWidth] = useState(0);\n    const [headHeight, setHeadHeight] = useState<HeadHeight>({ closed: 64, open: 64 });\n    const [, setIsFirstRender] = useState(false);\n\n    const longPressTimeoutRef = useRef<number>();\n\n    const shouldShowSubtitleRow = subtitle || typeof subtitle === 'string';\n\n    const handleShowTooltipResize = useCallback(\n        (ref: OnRefChangeType<HTMLDivElement>) => {\n            if (ref.current) {\n                const el = ref.current;\n                setShouldEnableTooltip(el.scrollWidth > el.clientWidth);\n            }\n        },\n        [setShouldEnableTooltip],\n    );\n\n    const {\n        ref: titleRef,\n        height: titleHeight,\n        width: titleWidth,\n    } = useResizeDetector<HTMLDivElement>({\n        onResize: () => handleShowTooltipResize(titleRef),\n    });\n\n    const { ref: ellipsisTitleRef, height: ellipsisTitleHeight } =\n        useResizeDetector<HTMLDivElement>({\n            onResize: () => handleShowTooltipResize(ellipsisTitleRef),\n        });\n\n    const { ref: subTitleRef, height: subTitleHeight } = useResizeDetector();\n\n    const { ref: listItemRef } = useResizeDetector({\n        onResize: () => {\n            setOpenTitleWidth(titleWidth ?? 0);\n\n            let closedHeight = (ellipsisTitleHeight ?? 0) + 24;\n            let openHeight = (titleHeight ?? 0) + 24;\n\n            if (shouldShowSubtitleRow) {\n                if (subTitleHeight) {\n                    closedHeight += (ellipsisTitleHeight ?? 0) + 4;\n                    openHeight += subTitleHeight + 4;\n                }\n            }\n\n            setHeadHeight({ closed: closedHeight, open: openHeight });\n        },\n        refreshMode: 'debounce',\n        refreshRate: 100,\n    });\n\n    const shouldShowMultilineTitle = useMemo(() => !subtitle, [subtitle]);\n\n    // This is used to trigger a rerender, so the head height can be calculated\n    useEffect(() => {\n        setIsFirstRender(true);\n    }, []);\n\n    const handleMouseEnter = useCallback(() => setShouldShowHoverItem(true), []);\n\n    const handleMouseLeave = useCallback(() => setShouldShowHoverItem(false), []);\n\n    const handleTouchStart = useCallback<TouchEventHandler<HTMLDivElement>>(\n        (event) => {\n            longPressTimeoutRef.current = window.setTimeout(() => {\n                if (typeof onLongPress === 'function') {\n                    onLongPress(event);\n                }\n            }, 400);\n        },\n        [onLongPress],\n    );\n\n    const handleTouchEnd = useCallback(() => {\n        clearTimeout(longPressTimeoutRef.current);\n    }, []);\n\n    const shouldPreventRightElementClick = useMemo(() => {\n        if (!rightElements) return false;\n\n        if (\n            typeof rightElements === 'object' &&\n            ('bottom' in rightElements || 'center' in rightElements || 'top' in rightElements)\n        ) {\n            if (rightElements.bottom && getElementClickEvent(rightElements.bottom)) {\n                return true;\n            }\n\n            if (rightElements.center && getElementClickEvent(rightElements.center)) {\n                return true;\n            }\n\n            if (rightElements.top && getElementClickEvent(rightElements.top)) {\n                return true;\n            }\n        } else {\n            return getElementClickEvent(rightElements as ReactNode);\n        }\n\n        return false;\n    }, [rightElements]);\n\n    const iconOrImageElement = useMemo(() => {\n        if (icons) {\n            return (\n                <ListItemIcon\n                    icons={icons}\n                    shouldHideBackground={!!shouldHideImageOrIconBackground}\n                    shouldShowRoundIcon={!!shouldShowRoundImageOrIcon}\n                />\n            );\n        }\n\n        if (images) {\n            return (\n                <ListItemImage\n                    imageBackground={imageBackground}\n                    careOfLocationId={careOfLocationId}\n                    cornerImage={cornerImage}\n                    images={images}\n                    shouldOpenImageOnClick={shouldOpenImageOnClick}\n                    shouldHideBackground={!!shouldHideImageOrIconBackground}\n                    shouldShowRoundImage={!!shouldShowRoundImageOrIcon}\n                />\n            );\n        }\n\n        return undefined;\n    }, [\n        careOfLocationId,\n        cornerImage,\n        icons,\n        imageBackground,\n        images,\n        shouldHideImageOrIconBackground,\n        shouldOpenImageOnClick,\n        shouldShowRoundImageOrIcon,\n    ]);\n\n    return (\n        <StyledListItemHead\n            animate={{\n                height: isOpen ? headHeight.open : headHeight.closed,\n                opacity: isTitleGreyed ? 0.5 : 1,\n            }}\n            initial={false}\n            transition={{ duration: 0.2, type: 'tween' }}\n            className=\"beta-chayns-list-item-head\"\n            $isClickable={typeof onClick === 'function' || isExpandable}\n            $isAnyItemExpandable={isAnyItemExpandable}\n            onClick={onClick}\n            onMouseEnter={handleMouseEnter}\n            onMouseLeave={handleMouseLeave}\n            onTouchStart={typeof onLongPress === 'function' ? handleTouchStart : undefined}\n            onTouchEnd={typeof onLongPress === 'function' ? handleTouchEnd : undefined}\n        >\n            <StyledListItemHeadLeftWrapper>\n                {isAnyItemExpandable && (\n                    <StyledMotionListItemHeadIndicator\n                        animate={{ rotate: isOpen ? 90 : 0 }}\n                        initial={false}\n                        transition={{ type: 'tween' }}\n                    >\n                        {isExpandable && !shouldHideIndicator && (\n                            <Icon icons={['fa fa-chevron-right']} />\n                        )}\n                    </StyledMotionListItemHeadIndicator>\n                )}\n                {leftElements}\n                {iconOrImageElement}\n            </StyledListItemHeadLeftWrapper>\n            <StyledListItemHeadContent\n                ref={listItemRef}\n                $isIconOrImageGiven={iconOrImageElement !== undefined}\n                $isOpen={isOpen}\n            >\n                <StyledListItemHeadTitle>\n                    <StyledListItemHeadTitleContent>\n                        {isOpen ? (\n                            <StyledListItemHeadTitleText\n                                ref={titleRef}\n                                $width={openTitleWidth}\n                                $shouldShowMultilineTitle={shouldShowMultilineTitle}\n                                initial={{ opacity: 0 }}\n                                animate={{ opacity: 1 }}\n                                exit={{ opacity: 0 }}\n                                transition={{ duration: 0.4 }}\n                            >\n                                {title}\n                            </StyledListItemHeadTitleText>\n                        ) : (\n                            <StyledListItemHeadTitleText\n                                $isEllipsis\n                                ref={ellipsisTitleRef}\n                                $width={openTitleWidth}\n                                $shouldShowMultilineTitle={shouldShowMultilineTitle}\n                                initial={{ opacity: 0 }}\n                                animate={{ opacity: 1 }}\n                                exit={{ opacity: 0 }}\n                                transition={{ duration: 0.3 }}\n                            >\n                                {title}\n                            </StyledListItemHeadTitleText>\n                        )}\n                        <StyledListItemHeadTitleElement>\n                            {titleElement}\n                        </StyledListItemHeadTitleElement>\n                    </StyledListItemHeadTitleContent>\n                </StyledListItemHeadTitle>\n                {shouldShowSubtitleRow && (\n                    <StyledListItemHeadSubtitle ref={subTitleRef}>\n                        <StyledListItemHeadSubtitleText $isOpen={isOpen}>\n                            {subtitle}\n                        </StyledListItemHeadSubtitleText>\n                    </StyledListItemHeadSubtitle>\n                )}\n            </StyledListItemHeadContent>\n            {rightElements && (\n                <ListItemRightElements\n                    rightElements={rightElements}\n                    shouldPreventRightElementClick={shouldPreventRightElementClick}\n                />\n            )}\n            {hoverItem && (\n                <StyledMotionListItemHeadHoverItemWrapper\n                    className=\"beta-chayns-list-item-hover-item\"\n                    animate={{\n                        marginLeft: shouldForceHover || shouldShowHoverItem ? 8 : 0,\n                        opacity: shouldForceHover || shouldShowHoverItem ? 1 : 0,\n                        width: shouldForceHover || shouldShowHoverItem ? 'auto' : 0,\n                    }}\n                    initial={false}\n                    transition={{ duration: 0.15, type: 'tween' }}\n                >\n                    <StyledMotionListItemHeadHoverItem>\n                        {hoverItem}\n                    </StyledMotionListItemHeadHoverItem>\n                </StyledMotionListItemHeadHoverItemWrapper>\n            )}\n        </StyledListItemHead>\n    );\n};\n\nListItemHead.displayName = 'ListItemHead';\n\nexport default ListItemHead;\n"],"mappings":"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","ignoreList":[]}