@chayns-components/core 5.0.0-beta.734 → 5.0.0-beta.738

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

@@ -45,27 +45,29 @@ const ListItemHead = ({
   const openedTitle = (0, _useElementSize.useElementSize)(pseudoTitleOpenRef);
   const closedSubtitle = (0, _useElementSize.useElementSize)(pseudoSubtitleClosedRef);
   const openedSubtitle = (0, _useElementSize.useElementSize)(pseudoSubtitleOpenRef);
+  const shouldShowSubtitleRow = typeof subtitle === 'string';
   (0, _react.useEffect)(() => {
     if (closedTitle && openedTitle) {
       setHeadHeight({
-        closed: subtitle && closedSubtitle ? closedSubtitle.height + 4 + closedTitle.height + 24 : closedTitle.height + 24,
-        open: subtitle && openedSubtitle ? openedSubtitle.height + 4 + openedTitle.height + 24 : openedTitle.height + 24
+        closed: shouldShowSubtitleRow && closedSubtitle ? closedSubtitle.height + 4 + closedTitle.height + 24 : closedTitle.height + 24,
+        open: shouldShowSubtitleRow && openedSubtitle ? openedSubtitle.height + 4 + openedTitle.height + 24 : openedTitle.height + 24
       });
     }
-  }, [closedSubtitle, closedTitle, openedSubtitle, openedTitle, subtitle]);
+  }, [closedSubtitle, closedTitle, openedSubtitle, openedTitle, shouldShowSubtitleRow]);
 
-  // This is used to trigger a rerender, so the head height can be calculate
+  // This is used to trigger a rerender, so the head height can be calculated
   (0, _react.useEffect)(() => {
     setIsFirstRender(true);
   }, []);
   const handleMouseEnter = (0, _react.useCallback)(() => setShouldShowHoverItem(true), []);
   const handleMouseLeave = (0, _react.useCallback)(() => setShouldShowHoverItem(false), []);
   const marginTop = (0, _react.useMemo)(() => {
-    if (headHeight.closed < 64) {
-      return (64 - headHeight.closed) / 2;
+    const height = headHeight[isOpen ? 'open' : 'closed'];
+    if (height < 64) {
+      return (64 - height) / 2;
     }
     return 0;
-  }, [headHeight.closed]);
+  }, [headHeight, isOpen]);
   const handleTouchStart = (0, _react.useCallback)(event => {
     longPressTimeoutRef.current = window.setTimeout(() => {
       if (typeof onLongPress === 'function') {
@@ -129,7 +131,7 @@ const ListItemHead = ({
     $isOpen: false
   }, title), /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitleText, {
     $isOpen: isOpen
-  }, title), /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitleElement, null, titleElement)), (rightElements === null || rightElements === void 0 ? void 0 : rightElements.length) === 1 && !shouldShowSingleRightElementCentered && /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTopRightElement, null, rightElements[0]), rightElements && rightElements.length > 1 && rightElements[0] && /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTopRightElement, null, rightElements[0])), subtitle && /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadSubtitle, null, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadSubtitleTextPseudo, {
+  }, title), /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTitleElement, null, titleElement))), shouldShowSubtitleRow && /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadSubtitle, null, /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadSubtitleTextPseudo, {
     ref: pseudoSubtitleOpenRef,
     $isOpen: true
   }, subtitle), /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadSubtitleTextPseudo, {
@@ -137,7 +139,9 @@ const ListItemHead = ({
     $isOpen: false
   }, subtitle), /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadSubtitleText, {
     $isOpen: isOpen
-  }, subtitle), rightElements && rightElements.length > 1 && rightElements[1] && /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadBottomRightElement, null, rightElements[1]))), (rightElements === null || rightElements === void 0 ? void 0 : rightElements.length) === 1 && shouldShowSingleRightElementCentered && /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadRightElement, null, rightElements[0]), hoverItem && /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledMotionListItemHeadHoverItem, {
+  }, subtitle))), rightElements && /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadRightWrapper, {
+    $shouldShowCentered: (rightElements === null || rightElements === void 0 ? void 0 : rightElements.length) === 1 && shouldShowSingleRightElementCentered
+  }, (rightElements === null || rightElements === void 0 ? void 0 : rightElements.length) === 1 && shouldShowSingleRightElementCentered ? /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadRightElement, null, rightElements[0]) : /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, rightElements[0] && /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadTopRightElement, null, rightElements[0]), rightElements[1] && /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledListItemHeadBottomRightElement, null, rightElements[1]))), hoverItem && /*#__PURE__*/_react.default.createElement(_ListItemHead.StyledMotionListItemHeadHoverItem, {
     animate: {
       marginLeft: shouldShowHoverItem ? 8 : 0,
       opacity: shouldShowHoverItem ? 1 : 0,

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

@@ -1 +1 @@
-{"version":3,"file":"ListItemHead.js","names":["_react","_interopRequireWildcard","require","_useElementSize","_Icon","_interopRequireDefault","_ListItemIcon","_ListItemImage","_ListItemHead","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ListItemHead","hoverItem","icons","images","isAnyItemExpandable","isExpandable","isOpen","leftElements","onClick","onLongPress","rightElements","subtitle","shouldShowRoundImage","shouldShowSingleRightElementCentered","title","titleElement","shouldShowHoverItem","setShouldShowHoverItem","useState","headHeight","setHeadHeight","closed","open","isFirstRender","setIsFirstRender","longPressTimeoutRef","useRef","pseudoTitleOpenRef","pseudoTitleClosedRef","pseudoSubtitleOpenRef","pseudoSubtitleClosedRef","closedTitle","useElementSize","openedTitle","closedSubtitle","openedSubtitle","useEffect","height","handleMouseEnter","useCallback","handleMouseLeave","marginTop","useMemo","handleTouchStart","event","current","window","setTimeout","handleTouchEnd","clearTimeout","iconOrImageElement","createElement","undefined","StyledListItemHead","animate","initial","transition","duration","type","className","$isClickable","$isAnyItemExpandable","onMouseEnter","onMouseLeave","onTouchStart","onTouchEnd","StyledListItemHeadLeftWrapper","StyledMotionListItemHeadIndicator","rotate","StyledListItemHeadContent","$isIconOrImageGiven","$marginTop","$isOpen","StyledListItemHeadTitle","StyledListItemHeadTitleContent","StyledListItemHeadTitleTextPseudo","ref","StyledListItemHeadTitleText","StyledListItemHeadTitleElement","length","StyledListItemHeadTopRightElement","StyledListItemHeadSubtitle","StyledListItemHeadSubtitleTextPseudo","StyledListItemHeadSubtitleText","StyledListItemHeadBottomRightElement","StyledListItemHeadRightElement","StyledMotionListItemHeadHoverItem","marginLeft","opacity","width","displayName","_default","exports"],"sources":["../../../../../../src/components/list/list-item/list-item-head/ListItemHead.tsx"],"sourcesContent":["import React, {\n    FC,\n    MouseEventHandler,\n    ReactNode,\n    TouchEventHandler,\n    useCallback,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport { useElementSize } from '../../../../hooks/useElementSize';\nimport Icon from '../../../icon/Icon';\nimport ListItemIcon from './list-item-icon/ListItemIcon';\nimport ListItemImage from './list-item-image/ListItemImage';\nimport {\n    StyledListItemHead,\n    StyledListItemHeadBottomRightElement,\n    StyledListItemHeadContent,\n    StyledListItemHeadLeftWrapper,\n    StyledListItemHeadRightElement,\n    StyledListItemHeadSubtitle,\n    StyledListItemHeadSubtitleText,\n    StyledListItemHeadSubtitleTextPseudo,\n    StyledListItemHeadTitle,\n    StyledListItemHeadTitleContent,\n    StyledListItemHeadTitleElement,\n    StyledListItemHeadTitleText,\n    StyledListItemHeadTitleTextPseudo,\n    StyledListItemHeadTopRightElement,\n    StyledMotionListItemHeadHoverItem,\n    StyledMotionListItemHeadIndicator,\n} from './ListItemHead.styles';\n\ninterface HeadHeight {\n    closed: number;\n    open: number;\n}\n\ntype ListItemHeadProps = {\n    hoverItem?: ReactNode;\n    icons?: string[];\n    images?: string[];\n    isAnyItemExpandable: boolean;\n    isExpandable: boolean;\n    isOpen: boolean;\n    leftElements?: ReactNode;\n    onClick?: MouseEventHandler<HTMLDivElement>;\n    onLongPress?: TouchEventHandler<HTMLDivElement>;\n    rightElements?: [ReactNode, ...ReactNode[]];\n    subtitle?: ReactNode;\n    shouldShowRoundImage?: boolean;\n    shouldShowSingleRightElementCentered: boolean;\n    title: ReactNode;\n    titleElement?: ReactNode;\n};\n\nconst ListItemHead: FC<ListItemHeadProps> = ({\n    hoverItem,\n    icons,\n    images,\n    isAnyItemExpandable,\n    isExpandable,\n    isOpen,\n    leftElements,\n    onClick,\n    onLongPress,\n    rightElements,\n    subtitle,\n    shouldShowRoundImage,\n    shouldShowSingleRightElementCentered,\n    title,\n    titleElement,\n}) => {\n    const [shouldShowHoverItem, setShouldShowHoverItem] = useState(false);\n    const [headHeight, setHeadHeight] = useState<HeadHeight>({\n        closed: 40,\n        open: 40,\n    });\n    const [isFirstRender, setIsFirstRender] = useState(false);\n\n    const longPressTimeoutRef = useRef<number>();\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 closedTitle = useElementSize(pseudoTitleClosedRef);\n    const openedTitle = useElementSize(pseudoTitleOpenRef);\n    const closedSubtitle = useElementSize(pseudoSubtitleClosedRef);\n    const openedSubtitle = useElementSize(pseudoSubtitleOpenRef);\n\n    useEffect(() => {\n        if (closedTitle && openedTitle) {\n            setHeadHeight({\n                closed:\n                    subtitle && closedSubtitle\n                        ? closedSubtitle.height + 4 + closedTitle.height + 24\n                        : closedTitle.height + 24,\n                open:\n                    subtitle && openedSubtitle\n                        ? openedSubtitle.height + 4 + openedTitle.height + 24\n                        : openedTitle.height + 24,\n            });\n        }\n    }, [closedSubtitle, closedTitle, openedSubtitle, openedTitle, subtitle]);\n\n    // This is used to trigger a rerender, so the head height can be calculate\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        if (headHeight.closed < 64) {\n            return (64 - headHeight.closed) / 2;\n        }\n\n        return 0;\n    }, [headHeight.closed]);\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 iconOrImageElement = useMemo(() => {\n        if (icons) {\n            return <ListItemIcon icons={icons} />;\n        }\n\n        if (images) {\n            return <ListItemImage images={images} shouldShowRoundImage={!!shouldShowRoundImage} />;\n        }\n\n        return undefined;\n    }, [icons, images, shouldShowRoundImage]);\n\n    return (\n        <StyledListItemHead\n            animate={{ height: isOpen ? headHeight.open : headHeight.closed }}\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 && <Icon icons={['fa fa-chevron-right']} />}\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                        <StyledListItemHeadTitleTextPseudo ref={pseudoTitleOpenRef} $isOpen>\n                            {title}\n                        </StyledListItemHeadTitleTextPseudo>\n                        <StyledListItemHeadTitleTextPseudo\n                            ref={pseudoTitleClosedRef}\n                            $isOpen={false}\n                        >\n                            {title}\n                        </StyledListItemHeadTitleTextPseudo>\n                        <StyledListItemHeadTitleText $isOpen={isOpen}>\n                            {title}\n                        </StyledListItemHeadTitleText>\n                        <StyledListItemHeadTitleElement>\n                            {titleElement}\n                        </StyledListItemHeadTitleElement>\n                    </StyledListItemHeadTitleContent>\n                    {rightElements?.length === 1 && !shouldShowSingleRightElementCentered && (\n                        <StyledListItemHeadTopRightElement>\n                            {rightElements[0]}\n                        </StyledListItemHeadTopRightElement>\n                    )}\n                    {rightElements && rightElements.length > 1 && rightElements[0] && (\n                        <StyledListItemHeadTopRightElement>\n                            {rightElements[0]}\n                        </StyledListItemHeadTopRightElement>\n                    )}\n                </StyledListItemHeadTitle>\n                {subtitle && (\n                    <StyledListItemHeadSubtitle>\n                        <StyledListItemHeadSubtitleTextPseudo ref={pseudoSubtitleOpenRef} $isOpen>\n                            {subtitle}\n                        </StyledListItemHeadSubtitleTextPseudo>\n                        <StyledListItemHeadSubtitleTextPseudo\n                            ref={pseudoSubtitleClosedRef}\n                            $isOpen={false}\n                        >\n                            {subtitle}\n                        </StyledListItemHeadSubtitleTextPseudo>\n                        <StyledListItemHeadSubtitleText $isOpen={isOpen}>\n                            {subtitle}\n                        </StyledListItemHeadSubtitleText>\n                        {rightElements && rightElements.length > 1 && rightElements[1] && (\n                            <StyledListItemHeadBottomRightElement>\n                                {rightElements[1]}\n                            </StyledListItemHeadBottomRightElement>\n                        )}\n                    </StyledListItemHeadSubtitle>\n                )}\n            </StyledListItemHeadContent>\n            {rightElements?.length === 1 && shouldShowSingleRightElementCentered && (\n                <StyledListItemHeadRightElement>{rightElements[0]}</StyledListItemHeadRightElement>\n            )}\n            {hoverItem && (\n                <StyledMotionListItemHeadHoverItem\n                    animate={{\n                        marginLeft: shouldShowHoverItem ? 8 : 0,\n                        opacity: shouldShowHoverItem ? 1 : 0,\n                        width: shouldShowHoverItem ? 'auto' : 0,\n                    }}\n                    initial={false}\n                    transition={{ duration: 0.15, type: 'tween' }}\n                >\n                    {hoverItem}\n                </StyledMotionListItemHeadHoverItem>\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","_useElementSize","_Icon","_interopRequireDefault","_ListItemIcon","_ListItemImage","_ListItemHead","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ListItemHead","hoverItem","icons","images","isAnyItemExpandable","isExpandable","isOpen","leftElements","onClick","onLongPress","rightElements","subtitle","shouldShowRoundImage","shouldShowSingleRightElementCentered","title","titleElement","shouldShowHoverItem","setShouldShowHoverItem","useState","headHeight","setHeadHeight","closed","open","isFirstRender","setIsFirstRender","longPressTimeoutRef","useRef","pseudoTitleOpenRef","pseudoTitleClosedRef","pseudoSubtitleOpenRef","pseudoSubtitleClosedRef","closedTitle","useElementSize","openedTitle","closedSubtitle","openedSubtitle","shouldShowSubtitleRow","useEffect","height","handleMouseEnter","useCallback","handleMouseLeave","marginTop","useMemo","handleTouchStart","event","current","window","setTimeout","handleTouchEnd","clearTimeout","iconOrImageElement","createElement","undefined","StyledListItemHead","animate","initial","transition","duration","type","className","$isClickable","$isAnyItemExpandable","onMouseEnter","onMouseLeave","onTouchStart","onTouchEnd","StyledListItemHeadLeftWrapper","StyledMotionListItemHeadIndicator","rotate","StyledListItemHeadContent","$isIconOrImageGiven","$marginTop","$isOpen","StyledListItemHeadTitle","StyledListItemHeadTitleContent","StyledListItemHeadTitleTextPseudo","ref","StyledListItemHeadTitleText","StyledListItemHeadTitleElement","StyledListItemHeadSubtitle","StyledListItemHeadSubtitleTextPseudo","StyledListItemHeadSubtitleText","StyledListItemHeadRightWrapper","$shouldShowCentered","length","StyledListItemHeadRightElement","Fragment","StyledListItemHeadTopRightElement","StyledListItemHeadBottomRightElement","StyledMotionListItemHeadHoverItem","marginLeft","opacity","width","displayName","_default","exports"],"sources":["../../../../../../src/components/list/list-item/list-item-head/ListItemHead.tsx"],"sourcesContent":["import React, {\n    FC,\n    MouseEventHandler,\n    ReactNode,\n    TouchEventHandler,\n    useCallback,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport { useElementSize } from '../../../../hooks/useElementSize';\nimport Icon from '../../../icon/Icon';\nimport ListItemIcon from './list-item-icon/ListItemIcon';\nimport ListItemImage from './list-item-image/ListItemImage';\nimport {\n    StyledListItemHead,\n    StyledListItemHeadBottomRightElement,\n    StyledListItemHeadContent,\n    StyledListItemHeadLeftWrapper,\n    StyledListItemHeadRightElement,\n    StyledListItemHeadRightWrapper,\n    StyledListItemHeadSubtitle,\n    StyledListItemHeadSubtitleText,\n    StyledListItemHeadSubtitleTextPseudo,\n    StyledListItemHeadTitle,\n    StyledListItemHeadTitleContent,\n    StyledListItemHeadTitleElement,\n    StyledListItemHeadTitleText,\n    StyledListItemHeadTitleTextPseudo,\n    StyledListItemHeadTopRightElement,\n    StyledMotionListItemHeadHoverItem,\n    StyledMotionListItemHeadIndicator,\n} from './ListItemHead.styles';\n\ninterface HeadHeight {\n    closed: number;\n    open: number;\n}\n\ntype ListItemHeadProps = {\n    hoverItem?: ReactNode;\n    icons?: string[];\n    images?: string[];\n    isAnyItemExpandable: boolean;\n    isExpandable: boolean;\n    isOpen: boolean;\n    leftElements?: ReactNode;\n    onClick?: MouseEventHandler<HTMLDivElement>;\n    onLongPress?: TouchEventHandler<HTMLDivElement>;\n    rightElements?: [ReactNode, ...ReactNode[]];\n    subtitle?: ReactNode;\n    shouldShowRoundImage?: boolean;\n    shouldShowSingleRightElementCentered: boolean;\n    title: ReactNode;\n    titleElement?: ReactNode;\n};\n\nconst ListItemHead: FC<ListItemHeadProps> = ({\n    hoverItem,\n    icons,\n    images,\n    isAnyItemExpandable,\n    isExpandable,\n    isOpen,\n    leftElements,\n    onClick,\n    onLongPress,\n    rightElements,\n    subtitle,\n    shouldShowRoundImage,\n    shouldShowSingleRightElementCentered,\n    title,\n    titleElement,\n}) => {\n    const [shouldShowHoverItem, setShouldShowHoverItem] = useState(false);\n    const [headHeight, setHeadHeight] = useState<HeadHeight>({\n        closed: 40,\n        open: 40,\n    });\n    const [isFirstRender, setIsFirstRender] = useState(false);\n\n    const longPressTimeoutRef = useRef<number>();\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 closedTitle = useElementSize(pseudoTitleClosedRef);\n    const openedTitle = useElementSize(pseudoTitleOpenRef);\n    const closedSubtitle = useElementSize(pseudoSubtitleClosedRef);\n    const openedSubtitle = useElementSize(pseudoSubtitleOpenRef);\n\n    const shouldShowSubtitleRow = typeof subtitle === 'string';\n\n    useEffect(() => {\n        if (closedTitle && openedTitle) {\n            setHeadHeight({\n                closed:\n                    shouldShowSubtitleRow && closedSubtitle\n                        ? closedSubtitle.height + 4 + closedTitle.height + 24\n                        : closedTitle.height + 24,\n                open:\n                    shouldShowSubtitleRow && openedSubtitle\n                        ? openedSubtitle.height + 4 + openedTitle.height + 24\n                        : openedTitle.height + 24,\n            });\n        }\n    }, [closedSubtitle, closedTitle, openedSubtitle, openedTitle, shouldShowSubtitleRow]);\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 iconOrImageElement = useMemo(() => {\n        if (icons) {\n            return <ListItemIcon icons={icons} />;\n        }\n\n        if (images) {\n            return <ListItemImage images={images} shouldShowRoundImage={!!shouldShowRoundImage} />;\n        }\n\n        return undefined;\n    }, [icons, images, shouldShowRoundImage]);\n\n    return (\n        <StyledListItemHead\n            animate={{ height: isOpen ? headHeight.open : headHeight.closed }}\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 && <Icon icons={['fa fa-chevron-right']} />}\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                        <StyledListItemHeadTitleTextPseudo ref={pseudoTitleOpenRef} $isOpen>\n                            {title}\n                        </StyledListItemHeadTitleTextPseudo>\n                        <StyledListItemHeadTitleTextPseudo\n                            ref={pseudoTitleClosedRef}\n                            $isOpen={false}\n                        >\n                            {title}\n                        </StyledListItemHeadTitleTextPseudo>\n                        <StyledListItemHeadTitleText $isOpen={isOpen}>\n                            {title}\n                        </StyledListItemHeadTitleText>\n                        <StyledListItemHeadTitleElement>\n                            {titleElement}\n                        </StyledListItemHeadTitleElement>\n                    </StyledListItemHeadTitleContent>\n                </StyledListItemHeadTitle>\n                {shouldShowSubtitleRow && (\n                    <StyledListItemHeadSubtitle>\n                        <StyledListItemHeadSubtitleTextPseudo ref={pseudoSubtitleOpenRef} $isOpen>\n                            {subtitle}\n                        </StyledListItemHeadSubtitleTextPseudo>\n                        <StyledListItemHeadSubtitleTextPseudo\n                            ref={pseudoSubtitleClosedRef}\n                            $isOpen={false}\n                        >\n                            {subtitle}\n                        </StyledListItemHeadSubtitleTextPseudo>\n                        <StyledListItemHeadSubtitleText $isOpen={isOpen}>\n                            {subtitle}\n                        </StyledListItemHeadSubtitleText>\n                    </StyledListItemHeadSubtitle>\n                )}\n            </StyledListItemHeadContent>\n            {rightElements && (\n                <StyledListItemHeadRightWrapper\n                    $shouldShowCentered={\n                        rightElements?.length === 1 && shouldShowSingleRightElementCentered\n                    }\n                >\n                    {rightElements?.length === 1 && shouldShowSingleRightElementCentered ? (\n                        <StyledListItemHeadRightElement>\n                            {rightElements[0]}\n                        </StyledListItemHeadRightElement>\n                    ) : (\n                        <>\n                            {rightElements[0] && (\n                                <StyledListItemHeadTopRightElement>\n                                    {rightElements[0]}\n                                </StyledListItemHeadTopRightElement>\n                            )}\n                            {rightElements[1] && (\n                                <StyledListItemHeadBottomRightElement>\n                                    {rightElements[1]}\n                                </StyledListItemHeadBottomRightElement>\n                            )}\n                        </>\n                    )}\n                </StyledListItemHeadRightWrapper>\n            )}\n            {hoverItem && (\n                <StyledMotionListItemHeadHoverItem\n                    animate={{\n                        marginLeft: shouldShowHoverItem ? 8 : 0,\n                        opacity: shouldShowHoverItem ? 1 : 0,\n                        width: shouldShowHoverItem ? 'auto' : 0,\n                    }}\n                    initial={false}\n                    transition={{ duration: 0.15, type: 'tween' }}\n                >\n                    {hoverItem}\n                </StyledMotionListItemHeadHoverItem>\n            )}\n        </StyledListItemHead>\n    );\n};\n\nListItemHead.displayName = 'ListItemHead';\n\nexport default ListItemHead;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AAWA,IAAAC,eAAA,GAAAD,OAAA;AACA,IAAAE,KAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,aAAA,GAAAD,sBAAA,CAAAH,OAAA;AACA,IAAAK,cAAA,GAAAF,sBAAA,CAAAH,OAAA;AACA,IAAAM,aAAA,GAAAN,OAAA;AAkB+B,SAAAG,uBAAAI,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAAA,SAAAG,yBAAAH,CAAA,6BAAAI,OAAA,mBAAAC,CAAA,OAAAD,OAAA,IAAAE,CAAA,OAAAF,OAAA,YAAAD,wBAAA,YAAAA,CAAAH,CAAA,WAAAA,CAAA,GAAAM,CAAA,GAAAD,CAAA,KAAAL,CAAA;AAAA,SAAAR,wBAAAQ,CAAA,EAAAK,CAAA,SAAAA,CAAA,IAAAL,CAAA,IAAAA,CAAA,CAAAC,UAAA,SAAAD,CAAA,eAAAA,CAAA,uBAAAA,CAAA,yBAAAA,CAAA,WAAAE,OAAA,EAAAF,CAAA,QAAAM,CAAA,GAAAH,wBAAA,CAAAE,CAAA,OAAAC,CAAA,IAAAA,CAAA,CAAAC,GAAA,CAAAP,CAAA,UAAAM,CAAA,CAAAE,GAAA,CAAAR,CAAA,OAAAS,CAAA,KAAAC,SAAA,UAAAC,CAAA,GAAAC,MAAA,CAAAC,cAAA,IAAAD,MAAA,CAAAE,wBAAA,WAAAC,CAAA,IAAAf,CAAA,oBAAAe,CAAA,OAAAC,cAAA,CAAAC,IAAA,CAAAjB,CAAA,EAAAe,CAAA,SAAAG,CAAA,GAAAP,CAAA,GAAAC,MAAA,CAAAE,wBAAA,CAAAd,CAAA,EAAAe,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,IAAAf,CAAA,CAAAe,CAAA,YAAAN,CAAA,CAAAP,OAAA,GAAAF,CAAA,EAAAM,CAAA,IAAAA,CAAA,CAAAa,GAAA,CAAAnB,CAAA,EAAAS,CAAA,GAAAA,CAAA;AAyB/B,MAAMW,YAAmC,GAAGA,CAAC;EACzCC,SAAS;EACTC,KAAK;EACLC,MAAM;EACNC,mBAAmB;EACnBC,YAAY;EACZC,MAAM;EACNC,YAAY;EACZC,OAAO;EACPC,WAAW;EACXC,aAAa;EACbC,QAAQ;EACRC,oBAAoB;EACpBC,oCAAoC;EACpCC,KAAK;EACLC;AACJ,CAAC,KAAK;EACF,MAAM,CAACC,mBAAmB,EAAEC,sBAAsB,CAAC,GAAG,IAAAC,eAAQ,EAAC,KAAK,CAAC;EACrE,MAAM,CAACC,UAAU,EAAEC,aAAa,CAAC,GAAG,IAAAF,eAAQ,EAAa;IACrDG,MAAM,EAAE,EAAE;IACVC,IAAI,EAAE;EACV,CAAC,CAAC;EACF,MAAM,CAACC,aAAa,EAAEC,gBAAgB,CAAC,GAAG,IAAAN,eAAQ,EAAC,KAAK,CAAC;EAEzD,MAAMO,mBAAmB,GAAG,IAAAC,aAAM,EAAS,CAAC;EAC5C,MAAMC,kBAAkB,GAAG,IAAAD,aAAM,EAAiB,IAAI,CAAC;EACvD,MAAME,oBAAoB,GAAG,IAAAF,aAAM,EAAiB,IAAI,CAAC;EACzD,MAAMG,qBAAqB,GAAG,IAAAH,aAAM,EAAiB,IAAI,CAAC;EAC1D,MAAMI,uBAAuB,GAAG,IAAAJ,aAAM,EAAiB,IAAI,CAAC;EAE5D,MAAMK,WAAW,GAAG,IAAAC,8BAAc,EAACJ,oBAAoB,CAAC;EACxD,MAAMK,WAAW,GAAG,IAAAD,8BAAc,EAACL,kBAAkB,CAAC;EACtD,MAAMO,cAAc,GAAG,IAAAF,8BAAc,EAACF,uBAAuB,CAAC;EAC9D,MAAMK,cAAc,GAAG,IAAAH,8BAAc,EAACH,qBAAqB,CAAC;EAE5D,MAAMO,qBAAqB,GAAG,OAAOzB,QAAQ,KAAK,QAAQ;EAE1D,IAAA0B,gBAAS,EAAC,MAAM;IACZ,IAAIN,WAAW,IAAIE,WAAW,EAAE;MAC5Bb,aAAa,CAAC;QACVC,MAAM,EACFe,qBAAqB,IAAIF,cAAc,GACjCA,cAAc,CAACI,MAAM,GAAG,CAAC,GAAGP,WAAW,CAACO,MAAM,GAAG,EAAE,GACnDP,WAAW,CAACO,MAAM,GAAG,EAAE;QACjChB,IAAI,EACAc,qBAAqB,IAAID,cAAc,GACjCA,cAAc,CAACG,MAAM,GAAG,CAAC,GAAGL,WAAW,CAACK,MAAM,GAAG,EAAE,GACnDL,WAAW,CAACK,MAAM,GAAG;MACnC,CAAC,CAAC;IACN;EACJ,CAAC,EAAE,CAACJ,cAAc,EAAEH,WAAW,EAAEI,cAAc,EAAEF,WAAW,EAAEG,qBAAqB,CAAC,CAAC;;EAErF;EACA,IAAAC,gBAAS,EAAC,MAAM;IACZb,gBAAgB,CAAC,IAAI,CAAC;EAC1B,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMe,gBAAgB,GAAG,IAAAC,kBAAW,EAAC,MAAMvB,sBAAsB,CAAC,IAAI,CAAC,EAAE,EAAE,CAAC;EAE5E,MAAMwB,gBAAgB,GAAG,IAAAD,kBAAW,EAAC,MAAMvB,sBAAsB,CAAC,KAAK,CAAC,EAAE,EAAE,CAAC;EAE7E,MAAMyB,SAAS,GAAG,IAAAC,cAAO,EAAC,MAAM;IAC5B,MAAML,MAAM,GAAGnB,UAAU,CAACb,MAAM,GAAG,MAAM,GAAG,QAAQ,CAAC;IAErD,IAAIgC,MAAM,GAAG,EAAE,EAAE;MACb,OAAO,CAAC,EAAE,GAAGA,MAAM,IAAI,CAAC;IAC5B;IAEA,OAAO,CAAC;EACZ,CAAC,EAAE,CAACnB,UAAU,EAAEb,MAAM,CAAC,CAAC;EAExB,MAAMsC,gBAAgB,GAAG,IAAAJ,kBAAW,EAC/BK,KAAK,IAAK;IACPpB,mBAAmB,CAACqB,OAAO,GAAGC,MAAM,CAACC,UAAU,CAAC,MAAM;MAClD,IAAI,OAAOvC,WAAW,KAAK,UAAU,EAAE;QACnCA,WAAW,CAACoC,KAAK,CAAC;MACtB;IACJ,CAAC,EAAE,GAAG,CAAC;EACX,CAAC,EACD,CAACpC,WAAW,CAChB,CAAC;EAED,MAAMwC,cAAc,GAAG,IAAAT,kBAAW,EAAC,MAAM;IACrCU,YAAY,CAACzB,mBAAmB,CAACqB,OAAO,CAAC;EAC7C,CAAC,EAAE,EAAE,CAAC;EAEN,MAAMK,kBAAkB,GAAG,IAAAR,cAAO,EAAC,MAAM;IACrC,IAAIzC,KAAK,EAAE;MACP,oBAAO/B,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAAC3E,aAAA,CAAAK,OAAY;QAACoB,KAAK,EAAEA;MAAM,CAAE,CAAC;IACzC;IAEA,IAAIC,MAAM,EAAE;MACR,oBAAOhC,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAAC1E,cAAA,CAAAI,OAAa;QAACqB,MAAM,EAAEA,MAAO;QAACS,oBAAoB,EAAE,CAAC,CAACA;MAAqB,CAAE,CAAC;IAC1F;IAEA,OAAOyC,SAAS;EACpB,CAAC,EAAE,CAACnD,KAAK,EAAEC,MAAM,EAAES,oBAAoB,CAAC,CAAC;EAEzC,oBACIzC,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAACzE,aAAA,CAAA2E,kBAAkB;IACfC,OAAO,EAAE;MAAEjB,MAAM,EAAEhC,MAAM,GAAGa,UAAU,CAACG,IAAI,GAAGH,UAAU,CAACE;IAAO,CAAE;IAClEmC,OAAO,EAAE,KAAM;IACfC,UAAU,EAAE;MAAEC,QAAQ,EAAE,GAAG;MAAEC,IAAI,EAAE;IAAQ,CAAE;IAC7CC,SAAS,EAAC,4BAA4B;IACtCC,YAAY,EAAE,OAAOrD,OAAO,KAAK,UAAU,IAAIH,YAAa;IAC5DyD,oBAAoB,EAAE1D,mBAAoB;IAC1CI,OAAO,EAAEA,OAAQ;IACjBuD,YAAY,EAAExB,gBAAiB;IAC/ByB,YAAY,EAAEvB,gBAAiB;IAC/BwB,YAAY,EAAE,OAAOxD,WAAW,KAAK,UAAU,GAAGmC,gBAAgB,GAAGS,SAAU;IAC/Ea,UAAU,EAAE,OAAOzD,WAAW,KAAK,UAAU,GAAGwC,cAAc,GAAGI;EAAU,gBAE3ElF,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAACzE,aAAA,CAAAwF,6BAA6B,QACzB/D,mBAAmB,iBAChBjC,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAACzE,aAAA,CAAAyF,iCAAiC;IAC9Bb,OAAO,EAAE;MAAEc,MAAM,EAAE/D,MAAM,GAAG,EAAE,GAAG;IAAE,CAAE;IACrCkD,OAAO,EAAE,KAAM;IACfC,UAAU,EAAE;MAAEE,IAAI,EAAE;IAAQ;EAAE,GAE7BtD,YAAY,iBAAIlC,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAAC7E,KAAA,CAAAO,OAAI;IAACoB,KAAK,EAAE,CAAC,qBAAqB;EAAE,CAAE,CACzB,CACtC,EACAK,YAAY,EACZ4C,kBAC0B,CAAC,eAChChF,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAACzE,aAAA,CAAA2F,yBAAyB;IACtBC,mBAAmB,EAAEpB,kBAAkB,KAAKE,SAAU;IACtDmB,UAAU,EAAE9B,SAAU;IACtB+B,OAAO,EAAEnE;EAAO,gBAEhBnC,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAACzE,aAAA,CAAA+F,uBAAuB,qBACpBvG,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAACzE,aAAA,CAAAgG,8BAA8B,qBAC3BxG,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAACzE,aAAA,CAAAiG,iCAAiC;IAACC,GAAG,EAAElD,kBAAmB;IAAC8C,OAAO;EAAA,GAC9D3D,KAC8B,CAAC,eACpC3C,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAACzE,aAAA,CAAAiG,iCAAiC;IAC9BC,GAAG,EAAEjD,oBAAqB;IAC1B6C,OAAO,EAAE;EAAM,GAEd3D,KAC8B,CAAC,eACpC3C,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAACzE,aAAA,CAAAmG,2BAA2B;IAACL,OAAO,EAAEnE;EAAO,GACxCQ,KACwB,CAAC,eAC9B3C,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAACzE,aAAA,CAAAoG,8BAA8B,QAC1BhE,YAC2B,CACJ,CACX,CAAC,EACzBqB,qBAAqB,iBAClBjE,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAACzE,aAAA,CAAAqG,0BAA0B,qBACvB7G,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAACzE,aAAA,CAAAsG,oCAAoC;IAACJ,GAAG,EAAEhD,qBAAsB;IAAC4C,OAAO;EAAA,GACpE9D,QACiC,CAAC,eACvCxC,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAACzE,aAAA,CAAAsG,oCAAoC;IACjCJ,GAAG,EAAE/C,uBAAwB;IAC7B2C,OAAO,EAAE;EAAM,GAEd9D,QACiC,CAAC,eACvCxC,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAACzE,aAAA,CAAAuG,8BAA8B;IAACT,OAAO,EAAEnE;EAAO,GAC3CK,QAC2B,CACR,CAET,CAAC,EAC3BD,aAAa,iBACVvC,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAACzE,aAAA,CAAAwG,8BAA8B;IAC3BC,mBAAmB,EACf,CAAA1E,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAE2E,MAAM,MAAK,CAAC,IAAIxE;EAClC,GAEA,CAAAH,aAAa,aAAbA,aAAa,uBAAbA,aAAa,CAAE2E,MAAM,MAAK,CAAC,IAAIxE,oCAAoC,gBAChE1C,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAACzE,aAAA,CAAA2G,8BAA8B,QAC1B5E,aAAa,CAAC,CAAC,CACY,CAAC,gBAEjCvC,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAAAjF,MAAA,CAAAW,OAAA,CAAAyG,QAAA,QACK7E,aAAa,CAAC,CAAC,CAAC,iBACbvC,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAACzE,aAAA,CAAA6G,iCAAiC,QAC7B9E,aAAa,CAAC,CAAC,CACe,CACtC,EACAA,aAAa,CAAC,CAAC,CAAC,iBACbvC,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAACzE,aAAA,CAAA8G,oCAAoC,QAChC/E,aAAa,CAAC,CAAC,CACkB,CAE5C,CAEsB,CACnC,EACAT,SAAS,iBACN9B,MAAA,CAAAW,OAAA,CAAAsE,aAAA,CAACzE,aAAA,CAAA+G,iCAAiC;IAC9BnC,OAAO,EAAE;MACLoC,UAAU,EAAE3E,mBAAmB,GAAG,CAAC,GAAG,CAAC;MACvC4E,OAAO,EAAE5E,mBAAmB,GAAG,CAAC,GAAG,CAAC;MACpC6E,KAAK,EAAE7E,mBAAmB,GAAG,MAAM,GAAG;IAC1C,CAAE;IACFwC,OAAO,EAAE,KAAM;IACfC,UAAU,EAAE;MAAEC,QAAQ,EAAE,IAAI;MAAEC,IAAI,EAAE;IAAQ;EAAE,GAE7C1D,SAC8B,CAEvB,CAAC;AAE7B,CAAC;AAEDD,YAAY,CAAC8F,WAAW,GAAG,cAAc;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAlH,OAAA,GAE3BkB,YAAY","ignoreList":[]}

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

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.StyledMotionListItemHeadIndicator = exports.StyledMotionListItemHeadHoverItem = exports.StyledListItemHeadTopRightElement = exports.StyledListItemHeadTitleTextPseudo = exports.StyledListItemHeadTitleText = exports.StyledListItemHeadTitleElement = exports.StyledListItemHeadTitleContent = exports.StyledListItemHeadTitle = exports.StyledListItemHeadSubtitleTextPseudo = exports.StyledListItemHeadSubtitleText = exports.StyledListItemHeadSubtitle = exports.StyledListItemHeadRightElement = exports.StyledListItemHeadLeftWrapper = exports.StyledListItemHeadContent = exports.StyledListItemHeadBottomRightElement = exports.StyledListItemHead = void 0;
+exports.StyledMotionListItemHeadIndicator = exports.StyledMotionListItemHeadHoverItem = exports.StyledListItemHeadTopRightElement = exports.StyledListItemHeadTitleTextPseudo = exports.StyledListItemHeadTitleText = exports.StyledListItemHeadTitleElement = exports.StyledListItemHeadTitleContent = exports.StyledListItemHeadTitle = exports.StyledListItemHeadSubtitleTextPseudo = exports.StyledListItemHeadSubtitleText = exports.StyledListItemHeadSubtitle = exports.StyledListItemHeadRightWrapper = exports.StyledListItemHeadRightElement = exports.StyledListItemHeadLeftWrapper = exports.StyledListItemHeadContent = exports.StyledListItemHeadBottomRightElement = exports.StyledListItemHead = void 0;
 var _framerMotion = require("framer-motion");
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
@@ -52,15 +52,12 @@ const StyledListItemHeadContent = exports.StyledListItemHeadContent = _styledCom
 }) => $isOpen ? 'bold' : 'normal'};
     justify-content: start;
     line-height: normal;
-
-    margin-top: ${({
-  $marginTop,
-  $isOpen
-}) => $isOpen ? 0 : $marginTop}px;
-
     margin-left: ${({
   $isIconOrImageGiven
 }) => $isIconOrImageGiven ? '10px' : undefined};
+    margin-top: ${({
+  $marginTop
+}) => $marginTop}px;
     min-width: 0;
 `;
 const StyledListItemHeadTitle = exports.StyledListItemHeadTitle = _styledComponents.default.div`
@@ -147,23 +144,29 @@ const StyledListItemHeadSubtitleTextPseudo = exports.StyledListItemHeadSubtitleT
 
     position: absolute;
 `;
+const StyledListItemHeadRightWrapper = exports.StyledListItemHeadRightWrapper = _styledComponents.default.div`
+    align-items: flex-end;
+    display: flex;
+    flex-direction: column;
+    justify-content: ${({
+  $shouldShowCentered
+}) => $shouldShowCentered ? 'center' : 'flex-start'};
+    margin-left: 8px;
+`;
 const StyledListItemHeadTopRightElement = exports.StyledListItemHeadTopRightElement = _styledComponents.default.div`
     display: flex;
     flex: 0 0 auto;
     font-size: 85%;
-    margin-left: 8px;
 `;
 const StyledListItemHeadBottomRightElement = exports.StyledListItemHeadBottomRightElement = _styledComponents.default.div`
     display: flex;
     flex: 0 0 auto;
-    margin-left: 8px;
     font-size: 85%;
 `;
 const StyledListItemHeadRightElement = exports.StyledListItemHeadRightElement = _styledComponents.default.div`
     align-items: center;
     display: flex;
     flex: 0 0 auto;
-    margin-left: 8px;
 `;
 const StyledMotionListItemHeadHoverItem = exports.StyledMotionListItemHeadHoverItem = (0, _styledComponents.default)(_framerMotion.motion.div)`
     overflow: hidden;

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

@@ -1 +1 @@
-{"version":3,"file":"ListItemHead.styles.js","names":["_framerMotion","require","_styledComponents","_interopRequireWildcard","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledListItemHead","exports","styled","motion","div","theme","text","$isAnyItemExpandable","css","$isClickable","StyledListItemHeadLeftWrapper","StyledMotionListItemHeadIndicator","StyledListItemHeadContent","$isOpen","$marginTop","$isIconOrImageGiven","undefined","StyledListItemHeadTitle","StyledListItemHeadTitleContent","StyledListItemHeadTitleElement","StyledListItemHeadTitleText","span","StyledListItemHeadTitleTextPseudo","StyledListItemHeadSubtitle","StyledListItemHeadSubtitleText","StyledListItemHeadSubtitleTextPseudo","StyledListItemHeadTopRightElement","StyledListItemHeadBottomRightElement","StyledListItemHeadRightElement","StyledMotionListItemHeadHoverItem"],"sources":["../../../../../../src/components/list/list-item/list-item-head/ListItemHead.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type {\n    FramerMotionBugFix,\n    WithTheme,\n} from '../../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledListItemHeadProps = WithTheme<{\n    $isClickable: boolean;\n    $isAnyItemExpandable: boolean;\n}>;\n\nexport const StyledListItemHead = styled(motion.div)<StyledListItemHeadProps>`\n    //align-items: center;\n    overflow: hidden;\n    color: ${({ theme }: StyledListItemHeadProps) => theme.text};\n    display: flex;\n    min-height: 64px;\n    padding: 12px 9px;\n\n    ${({ $isAnyItemExpandable }) =>\n        !$isAnyItemExpandable &&\n        css`\n            padding-left: 12px;\n        `}\n\n    ${({ $isClickable }) =>\n        $isClickable &&\n        css`\n            cursor: pointer;\n        `}\n`;\n\nexport const StyledListItemHeadLeftWrapper = styled.div`\n    display: flex;\n    align-items: center;\n    margin: auto 0;\n`;\n\nexport const StyledMotionListItemHeadIndicator = styled(motion.div)<FramerMotionBugFix>`\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n    height: 26px;\n    justify-content: center;\n    width: 26px;\n`;\n\ntype StyledListItemHeadContentProps = {\n    $isIconOrImageGiven: boolean;\n    $isOpen: boolean;\n    $marginTop: number;\n};\n\nexport const StyledListItemHeadContent = styled.div<StyledListItemHeadContentProps>`\n    display: flex;\n    flex: 1 1 auto;\n    flex-direction: column;\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    justify-content: start;\n    line-height: normal;\n\n    margin-top: ${({ $marginTop, $isOpen }) => ($isOpen ? 0 : $marginTop)}px;\n\n    margin-left: ${({ $isIconOrImageGiven }) => ($isIconOrImageGiven ? '10px' : undefined)};\n    min-width: 0;\n`;\n\nexport const StyledListItemHeadTitle = styled.div`\n    align-items: center;\n    display: flex;\n    justify-content: space-between;\n`;\n\nexport const StyledListItemHeadTitleContent = styled.div`\n    display: flex;\n    flex: 1 1 auto;\n    max-width: 100%;\n    min-width: 0;\n    position: relative;\n`;\n\nexport const StyledListItemHeadTitleElement = styled.div`\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n    margin-left: 8px;\n`;\n\ntype StyledListItemHeadTitleTextProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadTitleText = styled(motion.span)<StyledListItemHeadTitleTextProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n`;\n\ntype StyledListItemHeadTitleTextPseudoProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadTitleTextPseudo = styled.span<StyledListItemHeadTitleTextPseudoProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    opacity: 0;\n    pointer-events: none;\n    user-select: none;\n    position: absolute;\n`;\n\nexport const StyledListItemHeadSubtitle = styled.div`\n    align-items: center;\n    display: flex;\n    justify-content: space-between;\n    margin-top: 2px;\n`;\n\ntype StyledListItemHeadSubtitleTextProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadSubtitleText = styled.span<StyledListItemHeadSubtitleTextProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    flex: 1 1 auto;\n    font-size: 85%;\n    min-width: 0;\n    opacity: 0.75;\n`;\n\ntype StyledListItemHeadSubtitleTextPseudoProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadSubtitleTextPseudo = styled.span<StyledListItemHeadSubtitleTextPseudoProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    flex: 1 1 auto;\n    font-size: 85%;\n    min-width: 0;\n\n    opacity: 0;\n    pointer-events: none;\n    user-select: none;\n\n    position: absolute;\n`;\n\nexport const StyledListItemHeadTopRightElement = styled.div`\n    display: flex;\n    flex: 0 0 auto;\n    font-size: 85%;\n    margin-left: 8px;\n`;\n\nexport const StyledListItemHeadBottomRightElement = styled.div`\n    display: flex;\n    flex: 0 0 auto;\n    margin-left: 8px;\n    font-size: 85%;\n`;\n\nexport const StyledListItemHeadRightElement = styled.div`\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n    margin-left: 8px;\n`;\n\nexport const StyledMotionListItemHeadHoverItem = styled(motion.div)<FramerMotionBugFix>`\n    overflow: hidden;\n    flex-shrink: 0;\n    margin: auto 0;\n`;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ListItemHead.styles.js","names":["_framerMotion","require","_styledComponents","_interopRequireWildcard","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","default","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","StyledListItemHead","exports","styled","motion","div","theme","text","$isAnyItemExpandable","css","$isClickable","StyledListItemHeadLeftWrapper","StyledMotionListItemHeadIndicator","StyledListItemHeadContent","$isOpen","$isIconOrImageGiven","undefined","$marginTop","StyledListItemHeadTitle","StyledListItemHeadTitleContent","StyledListItemHeadTitleElement","StyledListItemHeadTitleText","span","StyledListItemHeadTitleTextPseudo","StyledListItemHeadSubtitle","StyledListItemHeadSubtitleText","StyledListItemHeadSubtitleTextPseudo","StyledListItemHeadRightWrapper","$shouldShowCentered","StyledListItemHeadTopRightElement","StyledListItemHeadBottomRightElement","StyledListItemHeadRightElement","StyledMotionListItemHeadHoverItem"],"sources":["../../../../../../src/components/list/list-item/list-item-head/ListItemHead.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type {\n    FramerMotionBugFix,\n    WithTheme,\n} from '../../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledListItemHeadProps = WithTheme<{\n    $isClickable: boolean;\n    $isAnyItemExpandable: boolean;\n}>;\n\nexport const StyledListItemHead = styled(motion.div)<StyledListItemHeadProps>`\n    //align-items: center;\n    overflow: hidden;\n    color: ${({ theme }: StyledListItemHeadProps) => theme.text};\n    display: flex;\n    min-height: 64px;\n    padding: 12px 9px;\n\n    ${({ $isAnyItemExpandable }) =>\n        !$isAnyItemExpandable &&\n        css`\n            padding-left: 12px;\n        `}\n\n    ${({ $isClickable }) =>\n        $isClickable &&\n        css`\n            cursor: pointer;\n        `}\n`;\n\nexport const StyledListItemHeadLeftWrapper = styled.div`\n    display: flex;\n    align-items: center;\n    margin: auto 0;\n`;\n\nexport const StyledMotionListItemHeadIndicator = styled(motion.div)<FramerMotionBugFix>`\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n    height: 26px;\n    justify-content: center;\n    width: 26px;\n`;\n\ntype StyledListItemHeadContentProps = {\n    $isIconOrImageGiven: boolean;\n    $isOpen: boolean;\n    $marginTop: number;\n};\n\nexport const StyledListItemHeadContent = styled.div<StyledListItemHeadContentProps>`\n    display: flex;\n    flex: 1 1 auto;\n    flex-direction: column;\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    justify-content: start;\n    line-height: normal;\n    margin-left: ${({ $isIconOrImageGiven }) => ($isIconOrImageGiven ? '10px' : undefined)};\n    margin-top: ${({ $marginTop }) => $marginTop}px;\n    min-width: 0;\n`;\n\nexport const StyledListItemHeadTitle = styled.div`\n    align-items: center;\n    display: flex;\n    justify-content: space-between;\n`;\n\nexport const StyledListItemHeadTitleContent = styled.div`\n    display: flex;\n    flex: 1 1 auto;\n    max-width: 100%;\n    min-width: 0;\n    position: relative;\n`;\n\nexport const StyledListItemHeadTitleElement = styled.div`\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n    margin-left: 8px;\n`;\n\ntype StyledListItemHeadTitleTextProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadTitleText = styled(motion.span)<StyledListItemHeadTitleTextProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n`;\n\ntype StyledListItemHeadTitleTextPseudoProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadTitleTextPseudo = styled.span<StyledListItemHeadTitleTextPseudoProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    opacity: 0;\n    pointer-events: none;\n    user-select: none;\n    position: absolute;\n`;\n\nexport const StyledListItemHeadSubtitle = styled.div`\n    align-items: center;\n    display: flex;\n    justify-content: space-between;\n    margin-top: 2px;\n`;\n\ntype StyledListItemHeadSubtitleTextProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadSubtitleText = styled.span<StyledListItemHeadSubtitleTextProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    flex: 1 1 auto;\n    font-size: 85%;\n    min-width: 0;\n    opacity: 0.75;\n`;\n\ntype StyledListItemHeadSubtitleTextPseudoProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadSubtitleTextPseudo = styled.span<StyledListItemHeadSubtitleTextPseudoProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    flex: 1 1 auto;\n    font-size: 85%;\n    min-width: 0;\n\n    opacity: 0;\n    pointer-events: none;\n    user-select: none;\n\n    position: absolute;\n`;\n\ntype StyledListItemHeadRightWrapperProps = WithTheme<{ $shouldShowCentered: boolean }>;\n\nexport const StyledListItemHeadRightWrapper = styled.div<StyledListItemHeadRightWrapperProps>`\n    align-items: flex-end;\n    display: flex;\n    flex-direction: column;\n    justify-content: ${({ $shouldShowCentered }) =>\n        $shouldShowCentered ? 'center' : 'flex-start'};\n    margin-left: 8px;\n`;\n\nexport const StyledListItemHeadTopRightElement = styled.div`\n    display: flex;\n    flex: 0 0 auto;\n    font-size: 85%;\n`;\n\nexport const StyledListItemHeadBottomRightElement = styled.div`\n    display: flex;\n    flex: 0 0 auto;\n    font-size: 85%;\n`;\n\nexport const StyledListItemHeadRightElement = styled.div`\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n`;\n\nexport const StyledMotionListItemHeadHoverItem = styled(motion.div)<FramerMotionBugFix>`\n    overflow: hidden;\n    flex-shrink: 0;\n    margin: auto 0;\n`;\n"],"mappings":"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","ignoreList":[]}

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

@@ -3,7 +3,7 @@ import { useElementSize } from '../../../../hooks/useElementSize';
 import Icon from '../../../icon/Icon';
 import ListItemIcon from './list-item-icon/ListItemIcon';
 import ListItemImage from './list-item-image/ListItemImage';
-import { StyledListItemHead, StyledListItemHeadBottomRightElement, StyledListItemHeadContent, StyledListItemHeadLeftWrapper, StyledListItemHeadRightElement, StyledListItemHeadSubtitle, StyledListItemHeadSubtitleText, StyledListItemHeadSubtitleTextPseudo, StyledListItemHeadTitle, StyledListItemHeadTitleContent, StyledListItemHeadTitleElement, StyledListItemHeadTitleText, StyledListItemHeadTitleTextPseudo, StyledListItemHeadTopRightElement, StyledMotionListItemHeadHoverItem, StyledMotionListItemHeadIndicator } from './ListItemHead.styles';
+import { StyledListItemHead, StyledListItemHeadBottomRightElement, StyledListItemHeadContent, StyledListItemHeadLeftWrapper, StyledListItemHeadRightElement, StyledListItemHeadRightWrapper, StyledListItemHeadSubtitle, StyledListItemHeadSubtitleText, StyledListItemHeadSubtitleTextPseudo, StyledListItemHeadTitle, StyledListItemHeadTitleContent, StyledListItemHeadTitleElement, StyledListItemHeadTitleText, StyledListItemHeadTitleTextPseudo, StyledListItemHeadTopRightElement, StyledMotionListItemHeadHoverItem, StyledMotionListItemHeadIndicator } from './ListItemHead.styles';
 const ListItemHead = _ref => {
   let {
     hoverItem,
@@ -37,27 +37,29 @@ const ListItemHead = _ref => {
   const openedTitle = useElementSize(pseudoTitleOpenRef);
   const closedSubtitle = useElementSize(pseudoSubtitleClosedRef);
   const openedSubtitle = useElementSize(pseudoSubtitleOpenRef);
+  const shouldShowSubtitleRow = typeof subtitle === 'string';
   useEffect(() => {
     if (closedTitle && openedTitle) {
       setHeadHeight({
-        closed: subtitle && closedSubtitle ? closedSubtitle.height + 4 + closedTitle.height + 24 : closedTitle.height + 24,
-        open: subtitle && openedSubtitle ? openedSubtitle.height + 4 + openedTitle.height + 24 : openedTitle.height + 24
+        closed: shouldShowSubtitleRow && closedSubtitle ? closedSubtitle.height + 4 + closedTitle.height + 24 : closedTitle.height + 24,
+        open: shouldShowSubtitleRow && openedSubtitle ? openedSubtitle.height + 4 + openedTitle.height + 24 : openedTitle.height + 24
       });
     }
-  }, [closedSubtitle, closedTitle, openedSubtitle, openedTitle, subtitle]);
+  }, [closedSubtitle, closedTitle, openedSubtitle, openedTitle, shouldShowSubtitleRow]);
 
-  // This is used to trigger a rerender, so the head height can be calculate
+  // This is used to trigger a rerender, so the head height can be calculated
   useEffect(() => {
     setIsFirstRender(true);
   }, []);
   const handleMouseEnter = useCallback(() => setShouldShowHoverItem(true), []);
   const handleMouseLeave = useCallback(() => setShouldShowHoverItem(false), []);
   const marginTop = useMemo(() => {
-    if (headHeight.closed < 64) {
-      return (64 - headHeight.closed) / 2;
+    const height = headHeight[isOpen ? 'open' : 'closed'];
+    if (height < 64) {
+      return (64 - height) / 2;
     }
     return 0;
-  }, [headHeight.closed]);
+  }, [headHeight, isOpen]);
   const handleTouchStart = useCallback(event => {
     longPressTimeoutRef.current = window.setTimeout(() => {
       if (typeof onLongPress === 'function') {
@@ -121,7 +123,7 @@ const ListItemHead = _ref => {
     $isOpen: false
   }, title), /*#__PURE__*/React.createElement(StyledListItemHeadTitleText, {
     $isOpen: isOpen
-  }, title), /*#__PURE__*/React.createElement(StyledListItemHeadTitleElement, null, titleElement)), rightElements?.length === 1 && !shouldShowSingleRightElementCentered && /*#__PURE__*/React.createElement(StyledListItemHeadTopRightElement, null, rightElements[0]), rightElements && rightElements.length > 1 && rightElements[0] && /*#__PURE__*/React.createElement(StyledListItemHeadTopRightElement, null, rightElements[0])), subtitle && /*#__PURE__*/React.createElement(StyledListItemHeadSubtitle, null, /*#__PURE__*/React.createElement(StyledListItemHeadSubtitleTextPseudo, {
+  }, title), /*#__PURE__*/React.createElement(StyledListItemHeadTitleElement, null, titleElement))), shouldShowSubtitleRow && /*#__PURE__*/React.createElement(StyledListItemHeadSubtitle, null, /*#__PURE__*/React.createElement(StyledListItemHeadSubtitleTextPseudo, {
     ref: pseudoSubtitleOpenRef,
     $isOpen: true
   }, subtitle), /*#__PURE__*/React.createElement(StyledListItemHeadSubtitleTextPseudo, {
@@ -129,7 +131,9 @@ const ListItemHead = _ref => {
     $isOpen: false
   }, subtitle), /*#__PURE__*/React.createElement(StyledListItemHeadSubtitleText, {
     $isOpen: isOpen
-  }, subtitle), rightElements && rightElements.length > 1 && rightElements[1] && /*#__PURE__*/React.createElement(StyledListItemHeadBottomRightElement, null, rightElements[1]))), rightElements?.length === 1 && shouldShowSingleRightElementCentered && /*#__PURE__*/React.createElement(StyledListItemHeadRightElement, null, rightElements[0]), hoverItem && /*#__PURE__*/React.createElement(StyledMotionListItemHeadHoverItem, {
+  }, subtitle))), rightElements && /*#__PURE__*/React.createElement(StyledListItemHeadRightWrapper, {
+    $shouldShowCentered: rightElements?.length === 1 && shouldShowSingleRightElementCentered
+  }, rightElements?.length === 1 && shouldShowSingleRightElementCentered ? /*#__PURE__*/React.createElement(StyledListItemHeadRightElement, null, rightElements[0]) : /*#__PURE__*/React.createElement(React.Fragment, null, rightElements[0] && /*#__PURE__*/React.createElement(StyledListItemHeadTopRightElement, null, rightElements[0]), rightElements[1] && /*#__PURE__*/React.createElement(StyledListItemHeadBottomRightElement, null, rightElements[1]))), hoverItem && /*#__PURE__*/React.createElement(StyledMotionListItemHeadHoverItem, {
     animate: {
       marginLeft: shouldShowHoverItem ? 8 : 0,
       opacity: shouldShowHoverItem ? 1 : 0,

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

@@ -1 +1 @@
-{"version":3,"file":"ListItemHead.js","names":["React","useCallback","useEffect","useMemo","useRef","useState","useElementSize","Icon","ListItemIcon","ListItemImage","StyledListItemHead","StyledListItemHeadBottomRightElement","StyledListItemHeadContent","StyledListItemHeadLeftWrapper","StyledListItemHeadRightElement","StyledListItemHeadSubtitle","StyledListItemHeadSubtitleText","StyledListItemHeadSubtitleTextPseudo","StyledListItemHeadTitle","StyledListItemHeadTitleContent","StyledListItemHeadTitleElement","StyledListItemHeadTitleText","StyledListItemHeadTitleTextPseudo","StyledListItemHeadTopRightElement","StyledMotionListItemHeadHoverItem","StyledMotionListItemHeadIndicator","ListItemHead","_ref","hoverItem","icons","images","isAnyItemExpandable","isExpandable","isOpen","leftElements","onClick","onLongPress","rightElements","subtitle","shouldShowRoundImage","shouldShowSingleRightElementCentered","title","titleElement","shouldShowHoverItem","setShouldShowHoverItem","headHeight","setHeadHeight","closed","open","isFirstRender","setIsFirstRender","longPressTimeoutRef","pseudoTitleOpenRef","pseudoTitleClosedRef","pseudoSubtitleOpenRef","pseudoSubtitleClosedRef","closedTitle","openedTitle","closedSubtitle","openedSubtitle","height","handleMouseEnter","handleMouseLeave","marginTop","handleTouchStart","event","current","window","setTimeout","handleTouchEnd","clearTimeout","iconOrImageElement","createElement","undefined","animate","initial","transition","duration","type","className","$isClickable","$isAnyItemExpandable","onMouseEnter","onMouseLeave","onTouchStart","onTouchEnd","rotate","$isIconOrImageGiven","$marginTop","$isOpen","ref","length","marginLeft","opacity","width","displayName"],"sources":["../../../../../../src/components/list/list-item/list-item-head/ListItemHead.tsx"],"sourcesContent":["import React, {\n    FC,\n    MouseEventHandler,\n    ReactNode,\n    TouchEventHandler,\n    useCallback,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport { useElementSize } from '../../../../hooks/useElementSize';\nimport Icon from '../../../icon/Icon';\nimport ListItemIcon from './list-item-icon/ListItemIcon';\nimport ListItemImage from './list-item-image/ListItemImage';\nimport {\n    StyledListItemHead,\n    StyledListItemHeadBottomRightElement,\n    StyledListItemHeadContent,\n    StyledListItemHeadLeftWrapper,\n    StyledListItemHeadRightElement,\n    StyledListItemHeadSubtitle,\n    StyledListItemHeadSubtitleText,\n    StyledListItemHeadSubtitleTextPseudo,\n    StyledListItemHeadTitle,\n    StyledListItemHeadTitleContent,\n    StyledListItemHeadTitleElement,\n    StyledListItemHeadTitleText,\n    StyledListItemHeadTitleTextPseudo,\n    StyledListItemHeadTopRightElement,\n    StyledMotionListItemHeadHoverItem,\n    StyledMotionListItemHeadIndicator,\n} from './ListItemHead.styles';\n\ninterface HeadHeight {\n    closed: number;\n    open: number;\n}\n\ntype ListItemHeadProps = {\n    hoverItem?: ReactNode;\n    icons?: string[];\n    images?: string[];\n    isAnyItemExpandable: boolean;\n    isExpandable: boolean;\n    isOpen: boolean;\n    leftElements?: ReactNode;\n    onClick?: MouseEventHandler<HTMLDivElement>;\n    onLongPress?: TouchEventHandler<HTMLDivElement>;\n    rightElements?: [ReactNode, ...ReactNode[]];\n    subtitle?: ReactNode;\n    shouldShowRoundImage?: boolean;\n    shouldShowSingleRightElementCentered: boolean;\n    title: ReactNode;\n    titleElement?: ReactNode;\n};\n\nconst ListItemHead: FC<ListItemHeadProps> = ({\n    hoverItem,\n    icons,\n    images,\n    isAnyItemExpandable,\n    isExpandable,\n    isOpen,\n    leftElements,\n    onClick,\n    onLongPress,\n    rightElements,\n    subtitle,\n    shouldShowRoundImage,\n    shouldShowSingleRightElementCentered,\n    title,\n    titleElement,\n}) => {\n    const [shouldShowHoverItem, setShouldShowHoverItem] = useState(false);\n    const [headHeight, setHeadHeight] = useState<HeadHeight>({\n        closed: 40,\n        open: 40,\n    });\n    const [isFirstRender, setIsFirstRender] = useState(false);\n\n    const longPressTimeoutRef = useRef<number>();\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 closedTitle = useElementSize(pseudoTitleClosedRef);\n    const openedTitle = useElementSize(pseudoTitleOpenRef);\n    const closedSubtitle = useElementSize(pseudoSubtitleClosedRef);\n    const openedSubtitle = useElementSize(pseudoSubtitleOpenRef);\n\n    useEffect(() => {\n        if (closedTitle && openedTitle) {\n            setHeadHeight({\n                closed:\n                    subtitle && closedSubtitle\n                        ? closedSubtitle.height + 4 + closedTitle.height + 24\n                        : closedTitle.height + 24,\n                open:\n                    subtitle && openedSubtitle\n                        ? openedSubtitle.height + 4 + openedTitle.height + 24\n                        : openedTitle.height + 24,\n            });\n        }\n    }, [closedSubtitle, closedTitle, openedSubtitle, openedTitle, subtitle]);\n\n    // This is used to trigger a rerender, so the head height can be calculate\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        if (headHeight.closed < 64) {\n            return (64 - headHeight.closed) / 2;\n        }\n\n        return 0;\n    }, [headHeight.closed]);\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 iconOrImageElement = useMemo(() => {\n        if (icons) {\n            return <ListItemIcon icons={icons} />;\n        }\n\n        if (images) {\n            return <ListItemImage images={images} shouldShowRoundImage={!!shouldShowRoundImage} />;\n        }\n\n        return undefined;\n    }, [icons, images, shouldShowRoundImage]);\n\n    return (\n        <StyledListItemHead\n            animate={{ height: isOpen ? headHeight.open : headHeight.closed }}\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 && <Icon icons={['fa fa-chevron-right']} />}\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                        <StyledListItemHeadTitleTextPseudo ref={pseudoTitleOpenRef} $isOpen>\n                            {title}\n                        </StyledListItemHeadTitleTextPseudo>\n                        <StyledListItemHeadTitleTextPseudo\n                            ref={pseudoTitleClosedRef}\n                            $isOpen={false}\n                        >\n                            {title}\n                        </StyledListItemHeadTitleTextPseudo>\n                        <StyledListItemHeadTitleText $isOpen={isOpen}>\n                            {title}\n                        </StyledListItemHeadTitleText>\n                        <StyledListItemHeadTitleElement>\n                            {titleElement}\n                        </StyledListItemHeadTitleElement>\n                    </StyledListItemHeadTitleContent>\n                    {rightElements?.length === 1 && !shouldShowSingleRightElementCentered && (\n                        <StyledListItemHeadTopRightElement>\n                            {rightElements[0]}\n                        </StyledListItemHeadTopRightElement>\n                    )}\n                    {rightElements && rightElements.length > 1 && rightElements[0] && (\n                        <StyledListItemHeadTopRightElement>\n                            {rightElements[0]}\n                        </StyledListItemHeadTopRightElement>\n                    )}\n                </StyledListItemHeadTitle>\n                {subtitle && (\n                    <StyledListItemHeadSubtitle>\n                        <StyledListItemHeadSubtitleTextPseudo ref={pseudoSubtitleOpenRef} $isOpen>\n                            {subtitle}\n                        </StyledListItemHeadSubtitleTextPseudo>\n                        <StyledListItemHeadSubtitleTextPseudo\n                            ref={pseudoSubtitleClosedRef}\n                            $isOpen={false}\n                        >\n                            {subtitle}\n                        </StyledListItemHeadSubtitleTextPseudo>\n                        <StyledListItemHeadSubtitleText $isOpen={isOpen}>\n                            {subtitle}\n                        </StyledListItemHeadSubtitleText>\n                        {rightElements && rightElements.length > 1 && rightElements[1] && (\n                            <StyledListItemHeadBottomRightElement>\n                                {rightElements[1]}\n                            </StyledListItemHeadBottomRightElement>\n                        )}\n                    </StyledListItemHeadSubtitle>\n                )}\n            </StyledListItemHeadContent>\n            {rightElements?.length === 1 && shouldShowSingleRightElementCentered && (\n                <StyledListItemHeadRightElement>{rightElements[0]}</StyledListItemHeadRightElement>\n            )}\n            {hoverItem && (\n                <StyledMotionListItemHeadHoverItem\n                    animate={{\n                        marginLeft: shouldShowHoverItem ? 8 : 0,\n                        opacity: shouldShowHoverItem ? 1 : 0,\n                        width: shouldShowHoverItem ? 'auto' : 0,\n                    }}\n                    initial={false}\n                    transition={{ duration: 0.15, type: 'tween' }}\n                >\n                    {hoverItem}\n                </StyledMotionListItemHeadHoverItem>\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","useCallback","useEffect","useMemo","useRef","useState","useElementSize","Icon","ListItemIcon","ListItemImage","StyledListItemHead","StyledListItemHeadBottomRightElement","StyledListItemHeadContent","StyledListItemHeadLeftWrapper","StyledListItemHeadRightElement","StyledListItemHeadRightWrapper","StyledListItemHeadSubtitle","StyledListItemHeadSubtitleText","StyledListItemHeadSubtitleTextPseudo","StyledListItemHeadTitle","StyledListItemHeadTitleContent","StyledListItemHeadTitleElement","StyledListItemHeadTitleText","StyledListItemHeadTitleTextPseudo","StyledListItemHeadTopRightElement","StyledMotionListItemHeadHoverItem","StyledMotionListItemHeadIndicator","ListItemHead","_ref","hoverItem","icons","images","isAnyItemExpandable","isExpandable","isOpen","leftElements","onClick","onLongPress","rightElements","subtitle","shouldShowRoundImage","shouldShowSingleRightElementCentered","title","titleElement","shouldShowHoverItem","setShouldShowHoverItem","headHeight","setHeadHeight","closed","open","isFirstRender","setIsFirstRender","longPressTimeoutRef","pseudoTitleOpenRef","pseudoTitleClosedRef","pseudoSubtitleOpenRef","pseudoSubtitleClosedRef","closedTitle","openedTitle","closedSubtitle","openedSubtitle","shouldShowSubtitleRow","height","handleMouseEnter","handleMouseLeave","marginTop","handleTouchStart","event","current","window","setTimeout","handleTouchEnd","clearTimeout","iconOrImageElement","createElement","undefined","animate","initial","transition","duration","type","className","$isClickable","$isAnyItemExpandable","onMouseEnter","onMouseLeave","onTouchStart","onTouchEnd","rotate","$isIconOrImageGiven","$marginTop","$isOpen","ref","$shouldShowCentered","length","Fragment","marginLeft","opacity","width","displayName"],"sources":["../../../../../../src/components/list/list-item/list-item-head/ListItemHead.tsx"],"sourcesContent":["import React, {\n    FC,\n    MouseEventHandler,\n    ReactNode,\n    TouchEventHandler,\n    useCallback,\n    useEffect,\n    useMemo,\n    useRef,\n    useState,\n} from 'react';\nimport { useElementSize } from '../../../../hooks/useElementSize';\nimport Icon from '../../../icon/Icon';\nimport ListItemIcon from './list-item-icon/ListItemIcon';\nimport ListItemImage from './list-item-image/ListItemImage';\nimport {\n    StyledListItemHead,\n    StyledListItemHeadBottomRightElement,\n    StyledListItemHeadContent,\n    StyledListItemHeadLeftWrapper,\n    StyledListItemHeadRightElement,\n    StyledListItemHeadRightWrapper,\n    StyledListItemHeadSubtitle,\n    StyledListItemHeadSubtitleText,\n    StyledListItemHeadSubtitleTextPseudo,\n    StyledListItemHeadTitle,\n    StyledListItemHeadTitleContent,\n    StyledListItemHeadTitleElement,\n    StyledListItemHeadTitleText,\n    StyledListItemHeadTitleTextPseudo,\n    StyledListItemHeadTopRightElement,\n    StyledMotionListItemHeadHoverItem,\n    StyledMotionListItemHeadIndicator,\n} from './ListItemHead.styles';\n\ninterface HeadHeight {\n    closed: number;\n    open: number;\n}\n\ntype ListItemHeadProps = {\n    hoverItem?: ReactNode;\n    icons?: string[];\n    images?: string[];\n    isAnyItemExpandable: boolean;\n    isExpandable: boolean;\n    isOpen: boolean;\n    leftElements?: ReactNode;\n    onClick?: MouseEventHandler<HTMLDivElement>;\n    onLongPress?: TouchEventHandler<HTMLDivElement>;\n    rightElements?: [ReactNode, ...ReactNode[]];\n    subtitle?: ReactNode;\n    shouldShowRoundImage?: boolean;\n    shouldShowSingleRightElementCentered: boolean;\n    title: ReactNode;\n    titleElement?: ReactNode;\n};\n\nconst ListItemHead: FC<ListItemHeadProps> = ({\n    hoverItem,\n    icons,\n    images,\n    isAnyItemExpandable,\n    isExpandable,\n    isOpen,\n    leftElements,\n    onClick,\n    onLongPress,\n    rightElements,\n    subtitle,\n    shouldShowRoundImage,\n    shouldShowSingleRightElementCentered,\n    title,\n    titleElement,\n}) => {\n    const [shouldShowHoverItem, setShouldShowHoverItem] = useState(false);\n    const [headHeight, setHeadHeight] = useState<HeadHeight>({\n        closed: 40,\n        open: 40,\n    });\n    const [isFirstRender, setIsFirstRender] = useState(false);\n\n    const longPressTimeoutRef = useRef<number>();\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 closedTitle = useElementSize(pseudoTitleClosedRef);\n    const openedTitle = useElementSize(pseudoTitleOpenRef);\n    const closedSubtitle = useElementSize(pseudoSubtitleClosedRef);\n    const openedSubtitle = useElementSize(pseudoSubtitleOpenRef);\n\n    const shouldShowSubtitleRow = typeof subtitle === 'string';\n\n    useEffect(() => {\n        if (closedTitle && openedTitle) {\n            setHeadHeight({\n                closed:\n                    shouldShowSubtitleRow && closedSubtitle\n                        ? closedSubtitle.height + 4 + closedTitle.height + 24\n                        : closedTitle.height + 24,\n                open:\n                    shouldShowSubtitleRow && openedSubtitle\n                        ? openedSubtitle.height + 4 + openedTitle.height + 24\n                        : openedTitle.height + 24,\n            });\n        }\n    }, [closedSubtitle, closedTitle, openedSubtitle, openedTitle, shouldShowSubtitleRow]);\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 iconOrImageElement = useMemo(() => {\n        if (icons) {\n            return <ListItemIcon icons={icons} />;\n        }\n\n        if (images) {\n            return <ListItemImage images={images} shouldShowRoundImage={!!shouldShowRoundImage} />;\n        }\n\n        return undefined;\n    }, [icons, images, shouldShowRoundImage]);\n\n    return (\n        <StyledListItemHead\n            animate={{ height: isOpen ? headHeight.open : headHeight.closed }}\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 && <Icon icons={['fa fa-chevron-right']} />}\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                        <StyledListItemHeadTitleTextPseudo ref={pseudoTitleOpenRef} $isOpen>\n                            {title}\n                        </StyledListItemHeadTitleTextPseudo>\n                        <StyledListItemHeadTitleTextPseudo\n                            ref={pseudoTitleClosedRef}\n                            $isOpen={false}\n                        >\n                            {title}\n                        </StyledListItemHeadTitleTextPseudo>\n                        <StyledListItemHeadTitleText $isOpen={isOpen}>\n                            {title}\n                        </StyledListItemHeadTitleText>\n                        <StyledListItemHeadTitleElement>\n                            {titleElement}\n                        </StyledListItemHeadTitleElement>\n                    </StyledListItemHeadTitleContent>\n                </StyledListItemHeadTitle>\n                {shouldShowSubtitleRow && (\n                    <StyledListItemHeadSubtitle>\n                        <StyledListItemHeadSubtitleTextPseudo ref={pseudoSubtitleOpenRef} $isOpen>\n                            {subtitle}\n                        </StyledListItemHeadSubtitleTextPseudo>\n                        <StyledListItemHeadSubtitleTextPseudo\n                            ref={pseudoSubtitleClosedRef}\n                            $isOpen={false}\n                        >\n                            {subtitle}\n                        </StyledListItemHeadSubtitleTextPseudo>\n                        <StyledListItemHeadSubtitleText $isOpen={isOpen}>\n                            {subtitle}\n                        </StyledListItemHeadSubtitleText>\n                    </StyledListItemHeadSubtitle>\n                )}\n            </StyledListItemHeadContent>\n            {rightElements && (\n                <StyledListItemHeadRightWrapper\n                    $shouldShowCentered={\n                        rightElements?.length === 1 && shouldShowSingleRightElementCentered\n                    }\n                >\n                    {rightElements?.length === 1 && shouldShowSingleRightElementCentered ? (\n                        <StyledListItemHeadRightElement>\n                            {rightElements[0]}\n                        </StyledListItemHeadRightElement>\n                    ) : (\n                        <>\n                            {rightElements[0] && (\n                                <StyledListItemHeadTopRightElement>\n                                    {rightElements[0]}\n                                </StyledListItemHeadTopRightElement>\n                            )}\n                            {rightElements[1] && (\n                                <StyledListItemHeadBottomRightElement>\n                                    {rightElements[1]}\n                                </StyledListItemHeadBottomRightElement>\n                            )}\n                        </>\n                    )}\n                </StyledListItemHeadRightWrapper>\n            )}\n            {hoverItem && (\n                <StyledMotionListItemHeadHoverItem\n                    animate={{\n                        marginLeft: shouldShowHoverItem ? 8 : 0,\n                        opacity: shouldShowHoverItem ? 1 : 0,\n                        width: shouldShowHoverItem ? 'auto' : 0,\n                    }}\n                    initial={false}\n                    transition={{ duration: 0.15, type: 'tween' }}\n                >\n                    {hoverItem}\n                </StyledMotionListItemHeadHoverItem>\n            )}\n        </StyledListItemHead>\n    );\n};\n\nListItemHead.displayName = 'ListItemHead';\n\nexport default ListItemHead;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/list/list-item/list-item-head/ListItemHead.styles.js

@@ -56,21 +56,18 @@ export const StyledListItemHeadContent = styled.div`
 }};
     justify-content: start;
     line-height: normal;
-
-    margin-top: ${_ref5 => {
-  let {
-    $marginTop,
-    $isOpen
-  } = _ref5;
-  return $isOpen ? 0 : $marginTop;
-}}px;
-
-    margin-left: ${_ref6 => {
+    margin-left: ${_ref5 => {
   let {
     $isIconOrImageGiven
-  } = _ref6;
+  } = _ref5;
   return $isIconOrImageGiven ? '10px' : undefined;
 }};
+    margin-top: ${_ref6 => {
+  let {
+    $marginTop
+  } = _ref6;
+  return $marginTop;
+}}px;
     min-width: 0;
 `;
 export const StyledListItemHeadTitle = styled.div`
@@ -181,23 +178,32 @@ export const StyledListItemHeadSubtitleTextPseudo = styled.span`
 
     position: absolute;
 `;
+export const StyledListItemHeadRightWrapper = styled.div`
+    align-items: flex-end;
+    display: flex;
+    flex-direction: column;
+    justify-content: ${_ref15 => {
+  let {
+    $shouldShowCentered
+  } = _ref15;
+  return $shouldShowCentered ? 'center' : 'flex-start';
+}};
+    margin-left: 8px;
+`;
 export const StyledListItemHeadTopRightElement = styled.div`
     display: flex;
     flex: 0 0 auto;
     font-size: 85%;
-    margin-left: 8px;
 `;
 export const StyledListItemHeadBottomRightElement = styled.div`
     display: flex;
     flex: 0 0 auto;
-    margin-left: 8px;
     font-size: 85%;
 `;
 export const StyledListItemHeadRightElement = styled.div`
     align-items: center;
     display: flex;
     flex: 0 0 auto;
-    margin-left: 8px;
 `;
 export const StyledMotionListItemHeadHoverItem = styled(motion.div)`
     overflow: hidden;

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

@@ -1 +1 @@
-{"version":3,"file":"ListItemHead.styles.js","names":["motion","styled","css","StyledListItemHead","div","_ref","theme","text","_ref2","$isAnyItemExpandable","_ref3","$isClickable","StyledListItemHeadLeftWrapper","StyledMotionListItemHeadIndicator","StyledListItemHeadContent","_ref4","$isOpen","_ref5","$marginTop","_ref6","$isIconOrImageGiven","undefined","StyledListItemHeadTitle","StyledListItemHeadTitleContent","StyledListItemHeadTitleElement","StyledListItemHeadTitleText","span","_ref7","_ref8","StyledListItemHeadTitleTextPseudo","_ref9","_ref10","StyledListItemHeadSubtitle","StyledListItemHeadSubtitleText","_ref11","_ref12","StyledListItemHeadSubtitleTextPseudo","_ref13","_ref14","StyledListItemHeadTopRightElement","StyledListItemHeadBottomRightElement","StyledListItemHeadRightElement","StyledMotionListItemHeadHoverItem"],"sources":["../../../../../../src/components/list/list-item/list-item-head/ListItemHead.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type {\n    FramerMotionBugFix,\n    WithTheme,\n} from '../../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledListItemHeadProps = WithTheme<{\n    $isClickable: boolean;\n    $isAnyItemExpandable: boolean;\n}>;\n\nexport const StyledListItemHead = styled(motion.div)<StyledListItemHeadProps>`\n    //align-items: center;\n    overflow: hidden;\n    color: ${({ theme }: StyledListItemHeadProps) => theme.text};\n    display: flex;\n    min-height: 64px;\n    padding: 12px 9px;\n\n    ${({ $isAnyItemExpandable }) =>\n        !$isAnyItemExpandable &&\n        css`\n            padding-left: 12px;\n        `}\n\n    ${({ $isClickable }) =>\n        $isClickable &&\n        css`\n            cursor: pointer;\n        `}\n`;\n\nexport const StyledListItemHeadLeftWrapper = styled.div`\n    display: flex;\n    align-items: center;\n    margin: auto 0;\n`;\n\nexport const StyledMotionListItemHeadIndicator = styled(motion.div)<FramerMotionBugFix>`\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n    height: 26px;\n    justify-content: center;\n    width: 26px;\n`;\n\ntype StyledListItemHeadContentProps = {\n    $isIconOrImageGiven: boolean;\n    $isOpen: boolean;\n    $marginTop: number;\n};\n\nexport const StyledListItemHeadContent = styled.div<StyledListItemHeadContentProps>`\n    display: flex;\n    flex: 1 1 auto;\n    flex-direction: column;\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    justify-content: start;\n    line-height: normal;\n\n    margin-top: ${({ $marginTop, $isOpen }) => ($isOpen ? 0 : $marginTop)}px;\n\n    margin-left: ${({ $isIconOrImageGiven }) => ($isIconOrImageGiven ? '10px' : undefined)};\n    min-width: 0;\n`;\n\nexport const StyledListItemHeadTitle = styled.div`\n    align-items: center;\n    display: flex;\n    justify-content: space-between;\n`;\n\nexport const StyledListItemHeadTitleContent = styled.div`\n    display: flex;\n    flex: 1 1 auto;\n    max-width: 100%;\n    min-width: 0;\n    position: relative;\n`;\n\nexport const StyledListItemHeadTitleElement = styled.div`\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n    margin-left: 8px;\n`;\n\ntype StyledListItemHeadTitleTextProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadTitleText = styled(motion.span)<StyledListItemHeadTitleTextProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n`;\n\ntype StyledListItemHeadTitleTextPseudoProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadTitleTextPseudo = styled.span<StyledListItemHeadTitleTextPseudoProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    opacity: 0;\n    pointer-events: none;\n    user-select: none;\n    position: absolute;\n`;\n\nexport const StyledListItemHeadSubtitle = styled.div`\n    align-items: center;\n    display: flex;\n    justify-content: space-between;\n    margin-top: 2px;\n`;\n\ntype StyledListItemHeadSubtitleTextProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadSubtitleText = styled.span<StyledListItemHeadSubtitleTextProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    flex: 1 1 auto;\n    font-size: 85%;\n    min-width: 0;\n    opacity: 0.75;\n`;\n\ntype StyledListItemHeadSubtitleTextPseudoProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadSubtitleTextPseudo = styled.span<StyledListItemHeadSubtitleTextPseudoProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    flex: 1 1 auto;\n    font-size: 85%;\n    min-width: 0;\n\n    opacity: 0;\n    pointer-events: none;\n    user-select: none;\n\n    position: absolute;\n`;\n\nexport const StyledListItemHeadTopRightElement = styled.div`\n    display: flex;\n    flex: 0 0 auto;\n    font-size: 85%;\n    margin-left: 8px;\n`;\n\nexport const StyledListItemHeadBottomRightElement = styled.div`\n    display: flex;\n    flex: 0 0 auto;\n    margin-left: 8px;\n    font-size: 85%;\n`;\n\nexport const StyledListItemHeadRightElement = styled.div`\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n    margin-left: 8px;\n`;\n\nexport const StyledMotionListItemHeadHoverItem = styled(motion.div)<FramerMotionBugFix>`\n    overflow: hidden;\n    flex-shrink: 0;\n    margin: auto 0;\n`;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ListItemHead.styles.js","names":["motion","styled","css","StyledListItemHead","div","_ref","theme","text","_ref2","$isAnyItemExpandable","_ref3","$isClickable","StyledListItemHeadLeftWrapper","StyledMotionListItemHeadIndicator","StyledListItemHeadContent","_ref4","$isOpen","_ref5","$isIconOrImageGiven","undefined","_ref6","$marginTop","StyledListItemHeadTitle","StyledListItemHeadTitleContent","StyledListItemHeadTitleElement","StyledListItemHeadTitleText","span","_ref7","_ref8","StyledListItemHeadTitleTextPseudo","_ref9","_ref10","StyledListItemHeadSubtitle","StyledListItemHeadSubtitleText","_ref11","_ref12","StyledListItemHeadSubtitleTextPseudo","_ref13","_ref14","StyledListItemHeadRightWrapper","_ref15","$shouldShowCentered","StyledListItemHeadTopRightElement","StyledListItemHeadBottomRightElement","StyledListItemHeadRightElement","StyledMotionListItemHeadHoverItem"],"sources":["../../../../../../src/components/list/list-item/list-item-head/ListItemHead.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type {\n    FramerMotionBugFix,\n    WithTheme,\n} from '../../../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledListItemHeadProps = WithTheme<{\n    $isClickable: boolean;\n    $isAnyItemExpandable: boolean;\n}>;\n\nexport const StyledListItemHead = styled(motion.div)<StyledListItemHeadProps>`\n    //align-items: center;\n    overflow: hidden;\n    color: ${({ theme }: StyledListItemHeadProps) => theme.text};\n    display: flex;\n    min-height: 64px;\n    padding: 12px 9px;\n\n    ${({ $isAnyItemExpandable }) =>\n        !$isAnyItemExpandable &&\n        css`\n            padding-left: 12px;\n        `}\n\n    ${({ $isClickable }) =>\n        $isClickable &&\n        css`\n            cursor: pointer;\n        `}\n`;\n\nexport const StyledListItemHeadLeftWrapper = styled.div`\n    display: flex;\n    align-items: center;\n    margin: auto 0;\n`;\n\nexport const StyledMotionListItemHeadIndicator = styled(motion.div)<FramerMotionBugFix>`\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n    height: 26px;\n    justify-content: center;\n    width: 26px;\n`;\n\ntype StyledListItemHeadContentProps = {\n    $isIconOrImageGiven: boolean;\n    $isOpen: boolean;\n    $marginTop: number;\n};\n\nexport const StyledListItemHeadContent = styled.div<StyledListItemHeadContentProps>`\n    display: flex;\n    flex: 1 1 auto;\n    flex-direction: column;\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    justify-content: start;\n    line-height: normal;\n    margin-left: ${({ $isIconOrImageGiven }) => ($isIconOrImageGiven ? '10px' : undefined)};\n    margin-top: ${({ $marginTop }) => $marginTop}px;\n    min-width: 0;\n`;\n\nexport const StyledListItemHeadTitle = styled.div`\n    align-items: center;\n    display: flex;\n    justify-content: space-between;\n`;\n\nexport const StyledListItemHeadTitleContent = styled.div`\n    display: flex;\n    flex: 1 1 auto;\n    max-width: 100%;\n    min-width: 0;\n    position: relative;\n`;\n\nexport const StyledListItemHeadTitleElement = styled.div`\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n    margin-left: 8px;\n`;\n\ntype StyledListItemHeadTitleTextProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadTitleText = styled(motion.span)<StyledListItemHeadTitleTextProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n`;\n\ntype StyledListItemHeadTitleTextPseudoProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadTitleTextPseudo = styled.span<StyledListItemHeadTitleTextPseudoProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    opacity: 0;\n    pointer-events: none;\n    user-select: none;\n    position: absolute;\n`;\n\nexport const StyledListItemHeadSubtitle = styled.div`\n    align-items: center;\n    display: flex;\n    justify-content: space-between;\n    margin-top: 2px;\n`;\n\ntype StyledListItemHeadSubtitleTextProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadSubtitleText = styled.span<StyledListItemHeadSubtitleTextProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    flex: 1 1 auto;\n    font-size: 85%;\n    min-width: 0;\n    opacity: 0.75;\n`;\n\ntype StyledListItemHeadSubtitleTextPseudoProps = WithTheme<{ $isOpen: boolean }>;\n\nexport const StyledListItemHeadSubtitleTextPseudo = styled.span<StyledListItemHeadSubtitleTextPseudoProps>`\n    font-weight: ${({ $isOpen }) => ($isOpen ? 'bold' : 'normal')};\n    white-space: ${({ $isOpen }) => ($isOpen ? 'normal' : 'nowrap')};\n    overflow: hidden;\n    text-overflow: ellipsis;\n\n    flex: 1 1 auto;\n    font-size: 85%;\n    min-width: 0;\n\n    opacity: 0;\n    pointer-events: none;\n    user-select: none;\n\n    position: absolute;\n`;\n\ntype StyledListItemHeadRightWrapperProps = WithTheme<{ $shouldShowCentered: boolean }>;\n\nexport const StyledListItemHeadRightWrapper = styled.div<StyledListItemHeadRightWrapperProps>`\n    align-items: flex-end;\n    display: flex;\n    flex-direction: column;\n    justify-content: ${({ $shouldShowCentered }) =>\n        $shouldShowCentered ? 'center' : 'flex-start'};\n    margin-left: 8px;\n`;\n\nexport const StyledListItemHeadTopRightElement = styled.div`\n    display: flex;\n    flex: 0 0 auto;\n    font-size: 85%;\n`;\n\nexport const StyledListItemHeadBottomRightElement = styled.div`\n    display: flex;\n    flex: 0 0 auto;\n    font-size: 85%;\n`;\n\nexport const StyledListItemHeadRightElement = styled.div`\n    align-items: center;\n    display: flex;\n    flex: 0 0 auto;\n`;\n\nexport const StyledMotionListItemHeadHoverItem = styled(motion.div)<FramerMotionBugFix>`\n    overflow: hidden;\n    flex-shrink: 0;\n    margin: auto 0;\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,eAAe;AACtC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAW/C,OAAO,MAAMC,kBAAkB,GAAGF,MAAM,CAACD,MAAM,CAACI,GAAG,CAA0B;AAC7E;AACA;AACA,aAAaC,IAAA;EAAA,IAAC;IAAEC;EAA+B,CAAC,GAAAD,IAAA;EAAA,OAAKC,KAAK,CAACC,IAAI;AAAA;AAC/D;AACA;AACA;AACA;AACA,MAAMC,KAAA;EAAA,IAAC;IAAEC;EAAqB,CAAC,GAAAD,KAAA;EAAA,OACvB,CAACC,oBAAoB,IACrBP,GAAG;AACX;AACA,SAAS;AAAA;AACT;AACA,MAAMQ,KAAA;EAAA,IAAC;IAAEC;EAAa,CAAC,GAAAD,KAAA;EAAA,OACfC,YAAY,IACZT,GAAG;AACX;AACA,SAAS;AAAA;AACT,CAAC;AAED,OAAO,MAAMU,6BAA6B,GAAGX,MAAM,CAACG,GAAG;AACvD;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMS,iCAAiC,GAAGZ,MAAM,CAACD,MAAM,CAACI,GAAG,CAAqB;AACvF;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAQD,OAAO,MAAMU,yBAAyB,GAAGb,MAAM,CAACG,GAAmC;AACnF;AACA;AACA;AACA,mBAAmBW,KAAA;EAAA,IAAC;IAAEC;EAAQ,CAAC,GAAAD,KAAA;EAAA,OAAMC,OAAO,GAAG,MAAM,GAAG,QAAQ;AAAA,CAAC;AACjE;AACA;AACA,mBAAmBC,KAAA;EAAA,IAAC;IAAEC;EAAoB,CAAC,GAAAD,KAAA;EAAA,OAAMC,mBAAmB,GAAG,MAAM,GAAGC,SAAS;AAAA,CAAC;AAC1F,kBAAkBC,KAAA;EAAA,IAAC;IAAEC;EAAW,CAAC,GAAAD,KAAA;EAAA,OAAKC,UAAU;AAAA;AAChD;AACA,CAAC;AAED,OAAO,MAAMC,uBAAuB,GAAGrB,MAAM,CAACG,GAAG;AACjD;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMmB,8BAA8B,GAAGtB,MAAM,CAACG,GAAG;AACxD;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMoB,8BAA8B,GAAGvB,MAAM,CAACG,GAAG;AACxD;AACA;AACA;AACA;AACA,CAAC;AAID,OAAO,MAAMqB,2BAA2B,GAAGxB,MAAM,CAACD,MAAM,CAAC0B,IAAI,CAAmC;AAChG,mBAAmBC,KAAA;EAAA,IAAC;IAAEX;EAAQ,CAAC,GAAAW,KAAA;EAAA,OAAMX,OAAO,GAAG,MAAM,GAAG,QAAQ;AAAA,CAAC;AACjE,mBAAmBY,KAAA;EAAA,IAAC;IAAEZ;EAAQ,CAAC,GAAAY,KAAA;EAAA,OAAMZ,OAAO,GAAG,QAAQ,GAAG,QAAQ;AAAA,CAAC;AACnE;AACA;AACA,CAAC;AAID,OAAO,MAAMa,iCAAiC,GAAG5B,MAAM,CAACyB,IAA4C;AACpG,mBAAmBI,KAAA;EAAA,IAAC;IAAEd;EAAQ,CAAC,GAAAc,KAAA;EAAA,OAAMd,OAAO,GAAG,MAAM,GAAG,QAAQ;AAAA,CAAC;AACjE,mBAAmBe,MAAA;EAAA,IAAC;IAAEf;EAAQ,CAAC,GAAAe,MAAA;EAAA,OAAMf,OAAO,GAAG,QAAQ,GAAG,QAAQ;AAAA,CAAC;AACnE;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMgB,0BAA0B,GAAG/B,MAAM,CAACG,GAAG;AACpD;AACA;AACA;AACA;AACA,CAAC;AAID,OAAO,MAAM6B,8BAA8B,GAAGhC,MAAM,CAACyB,IAAyC;AAC9F,mBAAmBQ,MAAA;EAAA,IAAC;IAAElB;EAAQ,CAAC,GAAAkB,MAAA;EAAA,OAAMlB,OAAO,GAAG,MAAM,GAAG,QAAQ;AAAA,CAAC;AACjE,mBAAmBmB,MAAA;EAAA,IAAC;IAAEnB;EAAQ,CAAC,GAAAmB,MAAA;EAAA,OAAMnB,OAAO,GAAG,QAAQ,GAAG,QAAQ;AAAA,CAAC;AACnE;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAID,OAAO,MAAMoB,oCAAoC,GAAGnC,MAAM,CAACyB,IAA+C;AAC1G,mBAAmBW,MAAA;EAAA,IAAC;IAAErB;EAAQ,CAAC,GAAAqB,MAAA;EAAA,OAAMrB,OAAO,GAAG,MAAM,GAAG,QAAQ;AAAA,CAAC;AACjE,mBAAmBsB,MAAA;EAAA,IAAC;IAAEtB;EAAQ,CAAC,GAAAsB,MAAA;EAAA,OAAMtB,OAAO,GAAG,QAAQ,GAAG,QAAQ;AAAA,CAAC;AACnE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAID,OAAO,MAAMuB,8BAA8B,GAAGtC,MAAM,CAACG,GAAwC;AAC7F;AACA;AACA;AACA,uBAAuBoC,MAAA;EAAA,IAAC;IAAEC;EAAoB,CAAC,GAAAD,MAAA;EAAA,OACvCC,mBAAmB,GAAG,QAAQ,GAAG,YAAY;AAAA;AACrD;AACA,CAAC;AAED,OAAO,MAAMC,iCAAiC,GAAGzC,MAAM,CAACG,GAAG;AAC3D;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMuC,oCAAoC,GAAG1C,MAAM,CAACG,GAAG;AAC9D;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMwC,8BAA8B,GAAG3C,MAAM,CAACG,GAAG;AACxD;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMyC,iCAAiC,GAAG5C,MAAM,CAACD,MAAM,CAACI,GAAG,CAAqB;AACvF;AACA;AACA;AACA,CAAC","ignoreList":[]}

package/lib/types/components/list/list-item/list-item-head/ListItemHead.styles.d.ts

@@ -820,6 +820,10 @@ type StyledListItemHeadSubtitleTextPseudoProps = WithTheme<{
     $isOpen: boolean;
 }>;
 export declare const StyledListItemHeadSubtitleTextPseudo: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, StyledListItemHeadSubtitleTextPseudoProps>> & string;
+type StyledListItemHeadRightWrapperProps = WithTheme<{
+    $shouldShowCentered: boolean;
+}>;
+export declare const StyledListItemHeadRightWrapper: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, StyledListItemHeadRightWrapperProps>> & string;
 export declare const StyledListItemHeadTopRightElement: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const StyledListItemHeadBottomRightElement: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
 export declare const StyledListItemHeadRightElement: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@chayns-components/core",
-    "version": "5.0.0-beta.734",
+    "version": "5.0.0-beta.738",
     "description": "A set of beautiful React components for developing your own applications with chayns.",
     "sideEffects": false,
     "browserslist": [
@@ -85,5 +85,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "8b0bc487b6227733b117ffdebe937ad58ea23ef5"
+    "gitHead": "849c712adba8e23731e3c08c902cae4b274276bc"
 }