@chayns-components/core 5.0.0-beta.912 → 5.0.0-beta.914

package/lib/cjs/components/badge/Badge.styles.js

@@ -24,6 +24,7 @@ const StyledBadge = exports.StyledBadge = _styledComponents.default.div`
   $minWidth
 }) => $minWidth};
     padding: 2px 6px;
+    line-height: 20px;
     text-align: center;
     cursor: ${({
   $cursor

package/lib/cjs/components/badge/Badge.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.styles.js","names":["_styledComponents","_interopRequireDefault","require","e","__esModule","default","StyledBadge","exports","styled","div","$backgroundColor","theme","$borderRadius","$fontColor","text","$minWidth","$cursor"],"sources":["../../../../src/components/badge/Badge.styles.ts"],"sourcesContent":["import type { CSSProperties } from 'react';\nimport styled from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledBadgeProps = WithTheme<{\n    $cursor: CSSProperties['cursor'];\n    $backgroundColor?: CSSProperties['backgroundColor'];\n    $borderRadius: CSSProperties['borderRadius'];\n    $fontColor?: CSSProperties['color'];\n    $minWidth: CSSProperties['minWidth'];\n}>;\n\nexport const StyledBadge = styled.div<StyledBadgeProps>`\n    background-color: ${({ $backgroundColor, theme }: StyledBadgeProps) =>\n        $backgroundColor ?? theme['secondary-202']};\n    border-radius: ${({ $borderRadius }) => $borderRadius};\n    color: ${({ $fontColor, theme }: StyledBadgeProps) => $fontColor ?? theme.text};\n    display: inline-block;\n    font-size: 0.8rem;\n    min-width: ${({ $minWidth }) => $minWidth};\n    padding: 2px 6px;\n    text-align: center;\n    cursor: ${({ $cursor }) => $cursor};\n`;\n"],"mappings":";;;;;;AACA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAuC,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAWhC,MAAMG,WAAW,GAAAC,OAAA,CAAAD,WAAA,GAAGE,yBAAM,CAACC,GAAqB;AACvD,wBAAwB,CAAC;EAAEC,gBAAgB;EAAEC;AAAwB,CAAC,KAC9DD,gBAAgB,IAAIC,KAAK,CAAC,eAAe,CAAC;AAClD,qBAAqB,CAAC;EAAEC;AAAc,CAAC,KAAKA,aAAa;AACzD,aAAa,CAAC;EAAEC,UAAU;EAAEF;AAAwB,CAAC,KAAKE,UAAU,IAAIF,KAAK,CAACG,IAAI;AAClF;AACA;AACA,iBAAiB,CAAC;EAAEC;AAAU,CAAC,KAAKA,SAAS;AAC7C;AACA;AACA,cAAc,CAAC;EAAEC;AAAQ,CAAC,KAAKA,OAAO;AACtC,CAAC","ignoreList":[]}
+{"version":3,"file":"Badge.styles.js","names":["_styledComponents","_interopRequireDefault","require","e","__esModule","default","StyledBadge","exports","styled","div","$backgroundColor","theme","$borderRadius","$fontColor","text","$minWidth","$cursor"],"sources":["../../../../src/components/badge/Badge.styles.ts"],"sourcesContent":["import type { CSSProperties } from 'react';\nimport styled from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledBadgeProps = WithTheme<{\n    $cursor: CSSProperties['cursor'];\n    $backgroundColor?: CSSProperties['backgroundColor'];\n    $borderRadius: CSSProperties['borderRadius'];\n    $fontColor?: CSSProperties['color'];\n    $minWidth: CSSProperties['minWidth'];\n}>;\n\nexport const StyledBadge = styled.div<StyledBadgeProps>`\n    background-color: ${({ $backgroundColor, theme }: StyledBadgeProps) =>\n        $backgroundColor ?? theme['secondary-202']};\n    border-radius: ${({ $borderRadius }) => $borderRadius};\n    color: ${({ $fontColor, theme }: StyledBadgeProps) => $fontColor ?? theme.text};\n    display: inline-block;\n    font-size: 0.8rem;\n    min-width: ${({ $minWidth }) => $minWidth};\n    padding: 2px 6px;\n    line-height: 20px;\n    text-align: center;\n    cursor: ${({ $cursor }) => $cursor};\n`;\n"],"mappings":";;;;;;AACA,IAAAA,iBAAA,GAAAC,sBAAA,CAAAC,OAAA;AAAuC,SAAAD,uBAAAE,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAWhC,MAAMG,WAAW,GAAAC,OAAA,CAAAD,WAAA,GAAGE,yBAAM,CAACC,GAAqB;AACvD,wBAAwB,CAAC;EAAEC,gBAAgB;EAAEC;AAAwB,CAAC,KAC9DD,gBAAgB,IAAIC,KAAK,CAAC,eAAe,CAAC;AAClD,qBAAqB,CAAC;EAAEC;AAAc,CAAC,KAAKA,aAAa;AACzD,aAAa,CAAC;EAAEC,UAAU;EAAEF;AAAwB,CAAC,KAAKE,UAAU,IAAIF,KAAK,CAACG,IAAI;AAClF;AACA;AACA,iBAAiB,CAAC;EAAEC;AAAU,CAAC,KAAKA,SAAS;AAC7C;AACA;AACA;AACA,cAAc,CAAC;EAAEC;AAAQ,CAAC,KAAKA,OAAO;AACtC,CAAC","ignoreList":[]}

package/lib/cjs/components/button/Button.styles.js

@@ -56,7 +56,7 @@ const StyledMotionButton = exports.StyledMotionButton = (0, _styledComponents.de
   $isDisabled
 }) => $isDisabled ? 'default' : 'pointer'};
     display: inline-flex;
-    line-height: 1.15;
+    line-height: 22px;
     min-height: 32px;
     position: relative;
     user-select: none;
@@ -68,15 +68,15 @@ const StyledMotionButton = exports.StyledMotionButton = (0, _styledComponents.de
   if ($hasIcon) {
     if ($hasChildren) {
       return (0, _styledComponents.css)`
-                    padding: 7px 12px 7px 42px;
+                    padding: 6px 12px 6px 42px;
                 `;
     }
     return (0, _styledComponents.css)`
-                padding: 7px 12px 7px 18px;
+                padding: 6px 12px 6px 18px;
             `;
   }
   return (0, _styledComponents.css)`
-            padding: 7px 12px 7px 12px;
+            padding: 6px 12px 6px 12px;
         `;
 }}
 `;

package/lib/cjs/components/button/Button.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.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","StyledMotionButton","exports","styled","motion","button","$shouldShowTextAsRobotoMedium","$shouldShowAsSelectButton","css","$isSecondary","theme","text","buttonDesign","buttonColor","buttonBackgroundColor","$isDisabled","$hasIcon","$hasChildren","StyledIconWrapper","span","StyledMotionChildrenWrapper","div","StyledMotionWaitCursorWrapper"],"sources":["../../../../src/components/button/Button.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type { FramerMotionBugFix, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledButtonProps = WithTheme<{\n    $hasIcon: boolean;\n    $hasChildren: boolean;\n    $isDisabled?: boolean;\n    $isSecondary?: boolean;\n    $shouldShowTextAsRobotoMedium: boolean;\n    $shouldShowAsSelectButton: boolean;\n}>;\n\nexport const StyledMotionButton = styled(motion.button)<StyledButtonProps>`\n    ${({ $shouldShowTextAsRobotoMedium, $shouldShowAsSelectButton }) =>\n        $shouldShowTextAsRobotoMedium &&\n        !$shouldShowAsSelectButton &&\n        css`\n            font-size: 110%;\n            font-family: 'Roboto Medium', serif;\n        `}\n\n    align-items: center;\n\n    ${({ $isSecondary, $shouldShowAsSelectButton, theme }: StyledButtonProps) => {\n        if ($isSecondary || $shouldShowAsSelectButton) {\n            return css`\n                color: ${theme.text};\n            `;\n        }\n\n        return css`\n            color: ${theme.buttonDesign === '2'\n                ? (theme.buttonColor ?? theme.buttonBackgroundColor ?? 'white')\n                : (theme.buttonColor ?? 'white')};\n        `;\n    }}\n\n    ${({ theme, $isSecondary, $shouldShowAsSelectButton }: StyledButtonProps) => {\n        if (theme.buttonDesign === '2' && !$shouldShowAsSelectButton) {\n            return css`\n                border: 1px solid ${$isSecondary ? theme['202'] : theme.buttonBackgroundColor};\n                box-shadow: none;\n            `;\n        }\n\n        return css`\n            border: none;\n            box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.2);\n        `;\n    }}\n\n    border-radius: 3px;\n    cursor: ${({ $isDisabled }) => ($isDisabled ? 'default' : 'pointer')};\n    display: inline-flex;\n    line-height: 1.15;\n    min-height: 32px;\n    position: relative;\n    user-select: none;\n\n    ${({ $hasIcon, $hasChildren }) => {\n        if ($hasIcon) {\n            if ($hasChildren) {\n                return css`\n                    padding: 7px 12px 7px 42px;\n                `;\n            }\n            return css`\n                padding: 7px 12px 7px 18px;\n            `;\n        }\n        return css`\n            padding: 7px 12px 7px 12px;\n        `;\n    }}\n`;\n//\nexport const StyledIconWrapper = styled.span`\n    align-items: center;\n    background-color: rgba(255, 255, 255, 0.2);\n    bottom: 0;\n    display: flex;\n    justify-content: center;\n    left: 0;\n    position: absolute;\n    top: 0;\n    width: 30px;\n`;\n\nexport const StyledMotionChildrenWrapper = styled(motion.div)<FramerMotionBugFix>`\n    will-change: unset !important;\n`;\n\nexport const StyledMotionWaitCursorWrapper = styled(motion.div)<FramerMotionBugFix>`\n    align-items: center;\n    display: flex;\n    justify-content: center;\n`;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"Button.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","StyledMotionButton","exports","styled","motion","button","$shouldShowTextAsRobotoMedium","$shouldShowAsSelectButton","css","$isSecondary","theme","text","buttonDesign","buttonColor","buttonBackgroundColor","$isDisabled","$hasIcon","$hasChildren","StyledIconWrapper","span","StyledMotionChildrenWrapper","div","StyledMotionWaitCursorWrapper"],"sources":["../../../../src/components/button/Button.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type { FramerMotionBugFix, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledButtonProps = WithTheme<{\n    $hasIcon: boolean;\n    $hasChildren: boolean;\n    $isDisabled?: boolean;\n    $isSecondary?: boolean;\n    $shouldShowTextAsRobotoMedium: boolean;\n    $shouldShowAsSelectButton: boolean;\n}>;\n\nexport const StyledMotionButton = styled(motion.button)<StyledButtonProps>`\n    ${({ $shouldShowTextAsRobotoMedium, $shouldShowAsSelectButton }) =>\n        $shouldShowTextAsRobotoMedium &&\n        !$shouldShowAsSelectButton &&\n        css`\n            font-size: 110%;\n            font-family: 'Roboto Medium', serif;\n        `}\n\n    align-items: center;\n\n    ${({ $isSecondary, $shouldShowAsSelectButton, theme }: StyledButtonProps) => {\n        if ($isSecondary || $shouldShowAsSelectButton) {\n            return css`\n                color: ${theme.text};\n            `;\n        }\n\n        return css`\n            color: ${theme.buttonDesign === '2'\n                ? (theme.buttonColor ?? theme.buttonBackgroundColor ?? 'white')\n                : (theme.buttonColor ?? 'white')};\n        `;\n    }}\n\n    ${({ theme, $isSecondary, $shouldShowAsSelectButton }: StyledButtonProps) => {\n        if (theme.buttonDesign === '2' && !$shouldShowAsSelectButton) {\n            return css`\n                border: 1px solid ${$isSecondary ? theme['202'] : theme.buttonBackgroundColor};\n                box-shadow: none;\n            `;\n        }\n\n        return css`\n            border: none;\n            box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.2);\n        `;\n    }}\n\n    border-radius: 3px;\n    cursor: ${({ $isDisabled }) => ($isDisabled ? 'default' : 'pointer')};\n    display: inline-flex;\n    line-height: 22px;\n    min-height: 32px;\n    position: relative;\n    user-select: none;\n\n    ${({ $hasIcon, $hasChildren }) => {\n        if ($hasIcon) {\n            if ($hasChildren) {\n                return css`\n                    padding: 6px 12px 6px 42px;\n                `;\n            }\n            return css`\n                padding: 6px 12px 6px 18px;\n            `;\n        }\n        return css`\n            padding: 6px 12px 6px 12px;\n        `;\n    }}\n`;\n//\nexport const StyledIconWrapper = styled.span`\n    align-items: center;\n    background-color: rgba(255, 255, 255, 0.2);\n    bottom: 0;\n    display: flex;\n    justify-content: center;\n    left: 0;\n    position: absolute;\n    top: 0;\n    width: 30px;\n`;\n\nexport const StyledMotionChildrenWrapper = styled(motion.div)<FramerMotionBugFix>`\n    will-change: unset !important;\n`;\n\nexport const StyledMotionWaitCursorWrapper = styled(motion.div)<FramerMotionBugFix>`\n    align-items: center;\n    display: flex;\n    justify-content: center;\n`;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/combobox/combobox-item/ComboBoxItem.js

@@ -33,10 +33,11 @@ const ComboBoxItem = ({
         text,
         value,
         suffixElement,
-        imageUrl
+        imageUrl,
+        icons
       });
     }
-  }, [imageUrl, isDisabled, onSelect, suffixElement, text, value]);
+  }, [icons, imageUrl, isDisabled, onSelect, suffixElement, text, value]);
   const isTouch = (0, _environment.getIsTouch)();
   return (0, _react.useMemo)(() => /*#__PURE__*/_react.default.createElement(_ComboBoxItem.StyledComboBoxItem, {
     id: `combobox-item__${typeof id === 'number' ? String(id) : id}`,

package/lib/cjs/components/combobox/combobox-item/ComboBoxItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboBoxItem.js","names":["_react","_interopRequireWildcard","require","_environment","_Icon","_interopRequireDefault","_ComboBoxItem","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ComboBoxItem","icons","id","imageUrl","isDisabled","isSelected","onSelect","rightElement","shouldShowBigImage","shouldShowRoundImage","subtext","suffixElement","textStyles","text","value","handleItemClick","useCallback","isTouch","getIsTouch","useMemo","createElement","StyledComboBoxItem","String","onClick","$isDisabled","$isSelected","$isTouch","StyledComboBoxItemImage","src","$shouldShowBigImage","trim","$shouldShowRoundImage","StyledComboBoxItemContent","StyledComboBoxItemContentHeader","StyledComboBoxItemContentHeaderText","as","tagName","style","styles","StyledComboBoxItemContentHeaderRightElement","StyledComboBoxItemContentSubtext","displayName","_default","exports"],"sources":["../../../../../src/components/combobox/combobox-item/ComboBoxItem.tsx"],"sourcesContent":["import React, { FC, ReactNode, useCallback, useMemo } from 'react';\nimport { getIsTouch } from '../../../utils/environment';\nimport Icon from '../../icon/Icon';\nimport type { ComboBoxProps, IComboBoxItem } from '../ComboBox';\nimport {\n    StyledComboBoxItem,\n    StyledComboBoxItemContent,\n    StyledComboBoxItemContentHeader,\n    StyledComboBoxItemContentHeaderRightElement,\n    StyledComboBoxItemContentHeaderText,\n    StyledComboBoxItemContentSubtext,\n    StyledComboBoxItemImage,\n} from './ComboBoxItem.styles';\n\nexport type ComboBoxItemProps = {\n    icons?: IComboBoxItem['icons'];\n    id: IComboBoxItem['value'];\n    imageUrl: IComboBoxItem['imageUrl'];\n    isDisabled?: IComboBoxItem['isDisabled'];\n    isSelected: boolean;\n    onSelect: (itemToSelect: IComboBoxItem) => void;\n    rightElement: IComboBoxItem['rightElement'];\n    shouldShowBigImage: ComboBoxProps['shouldShowBigImage'];\n    shouldShowRoundImage: ComboBoxProps['shouldShowRoundImage'];\n    subtext: IComboBoxItem['subtext'];\n    suffixElement?: ReactNode;\n    text: IComboBoxItem['text'];\n    value: IComboBoxItem['value'];\n    textStyles?: IComboBoxItem['textStyles'];\n};\n\nconst ComboBoxItem: FC<ComboBoxItemProps> = ({\n    icons,\n    id,\n    imageUrl,\n    isDisabled,\n    isSelected,\n    onSelect,\n    rightElement,\n    shouldShowBigImage,\n    shouldShowRoundImage,\n    subtext,\n    suffixElement,\n    textStyles,\n    text,\n    value,\n}) => {\n    const handleItemClick = useCallback(() => {\n        if (!isDisabled) {\n            onSelect({ text, value, suffixElement, imageUrl });\n        }\n    }, [imageUrl, isDisabled, onSelect, suffixElement, text, value]);\n\n    const isTouch = getIsTouch();\n\n    return useMemo(\n        () => (\n            <StyledComboBoxItem\n                id={`combobox-item__${typeof id === 'number' ? String(id) : id}`}\n                onClick={handleItemClick}\n                $isDisabled={isDisabled}\n                $isSelected={isSelected}\n                $isTouch={isTouch}\n            >\n                {imageUrl && (\n                    <StyledComboBoxItemImage\n                        src={imageUrl}\n                        $shouldShowBigImage={\n                            shouldShowBigImage ||\n                            (typeof subtext === 'string' && subtext.trim() !== '')\n                        }\n                        $shouldShowRoundImage={shouldShowRoundImage}\n                    />\n                )}\n                {icons && <Icon icons={icons} />}\n                <StyledComboBoxItemContent>\n                    <StyledComboBoxItemContentHeader>\n                        <StyledComboBoxItemContentHeaderText\n                            as={textStyles?.tagName}\n                            style={textStyles?.styles}\n                        >\n                            {text}\n                            {suffixElement}\n                        </StyledComboBoxItemContentHeaderText>\n                        {rightElement && (\n                            <StyledComboBoxItemContentHeaderRightElement>\n                                {rightElement}\n                            </StyledComboBoxItemContentHeaderRightElement>\n                        )}\n                    </StyledComboBoxItemContentHeader>\n                    {subtext && (\n                        <StyledComboBoxItemContentSubtext>\n                            {subtext}\n                        </StyledComboBoxItemContentSubtext>\n                    )}\n                </StyledComboBoxItemContent>\n            </StyledComboBoxItem>\n        ),\n        [\n            handleItemClick,\n            icons,\n            id,\n            imageUrl,\n            isDisabled,\n            isSelected,\n            isTouch,\n            rightElement,\n            shouldShowBigImage,\n            shouldShowRoundImage,\n            subtext,\n            suffixElement,\n            text,\n        ],\n    );\n};\n\nComboBoxItem.displayName = 'ComboBoxItem';\n\nexport default ComboBoxItem;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"ComboBoxItem.js","names":["_react","_interopRequireWildcard","require","_environment","_Icon","_interopRequireDefault","_ComboBoxItem","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ComboBoxItem","icons","id","imageUrl","isDisabled","isSelected","onSelect","rightElement","shouldShowBigImage","shouldShowRoundImage","subtext","suffixElement","textStyles","text","value","handleItemClick","useCallback","isTouch","getIsTouch","useMemo","createElement","StyledComboBoxItem","String","onClick","$isDisabled","$isSelected","$isTouch","StyledComboBoxItemImage","src","$shouldShowBigImage","trim","$shouldShowRoundImage","StyledComboBoxItemContent","StyledComboBoxItemContentHeader","StyledComboBoxItemContentHeaderText","as","tagName","style","styles","StyledComboBoxItemContentHeaderRightElement","StyledComboBoxItemContentSubtext","displayName","_default","exports"],"sources":["../../../../../src/components/combobox/combobox-item/ComboBoxItem.tsx"],"sourcesContent":["import React, { FC, ReactNode, useCallback, useMemo } from 'react';\nimport { getIsTouch } from '../../../utils/environment';\nimport Icon from '../../icon/Icon';\nimport type { ComboBoxProps, IComboBoxItem } from '../ComboBox';\nimport {\n    StyledComboBoxItem,\n    StyledComboBoxItemContent,\n    StyledComboBoxItemContentHeader,\n    StyledComboBoxItemContentHeaderRightElement,\n    StyledComboBoxItemContentHeaderText,\n    StyledComboBoxItemContentSubtext,\n    StyledComboBoxItemImage,\n} from './ComboBoxItem.styles';\n\nexport type ComboBoxItemProps = {\n    icons?: IComboBoxItem['icons'];\n    id: IComboBoxItem['value'];\n    imageUrl: IComboBoxItem['imageUrl'];\n    isDisabled?: IComboBoxItem['isDisabled'];\n    isSelected: boolean;\n    onSelect: (itemToSelect: IComboBoxItem) => void;\n    rightElement: IComboBoxItem['rightElement'];\n    shouldShowBigImage: ComboBoxProps['shouldShowBigImage'];\n    shouldShowRoundImage: ComboBoxProps['shouldShowRoundImage'];\n    subtext: IComboBoxItem['subtext'];\n    suffixElement?: ReactNode;\n    text: IComboBoxItem['text'];\n    value: IComboBoxItem['value'];\n    textStyles?: IComboBoxItem['textStyles'];\n};\n\nconst ComboBoxItem: FC<ComboBoxItemProps> = ({\n    icons,\n    id,\n    imageUrl,\n    isDisabled,\n    isSelected,\n    onSelect,\n    rightElement,\n    shouldShowBigImage,\n    shouldShowRoundImage,\n    subtext,\n    suffixElement,\n    textStyles,\n    text,\n    value,\n}) => {\n    const handleItemClick = useCallback(() => {\n        if (!isDisabled) {\n            onSelect({ text, value, suffixElement, imageUrl, icons });\n        }\n    }, [icons, imageUrl, isDisabled, onSelect, suffixElement, text, value]);\n\n    const isTouch = getIsTouch();\n\n    return useMemo(\n        () => (\n            <StyledComboBoxItem\n                id={`combobox-item__${typeof id === 'number' ? String(id) : id}`}\n                onClick={handleItemClick}\n                $isDisabled={isDisabled}\n                $isSelected={isSelected}\n                $isTouch={isTouch}\n            >\n                {imageUrl && (\n                    <StyledComboBoxItemImage\n                        src={imageUrl}\n                        $shouldShowBigImage={\n                            shouldShowBigImage ||\n                            (typeof subtext === 'string' && subtext.trim() !== '')\n                        }\n                        $shouldShowRoundImage={shouldShowRoundImage}\n                    />\n                )}\n                {icons && <Icon icons={icons} />}\n                <StyledComboBoxItemContent>\n                    <StyledComboBoxItemContentHeader>\n                        <StyledComboBoxItemContentHeaderText\n                            as={textStyles?.tagName}\n                            style={textStyles?.styles}\n                        >\n                            {text}\n                            {suffixElement}\n                        </StyledComboBoxItemContentHeaderText>\n                        {rightElement && (\n                            <StyledComboBoxItemContentHeaderRightElement>\n                                {rightElement}\n                            </StyledComboBoxItemContentHeaderRightElement>\n                        )}\n                    </StyledComboBoxItemContentHeader>\n                    {subtext && (\n                        <StyledComboBoxItemContentSubtext>\n                            {subtext}\n                        </StyledComboBoxItemContentSubtext>\n                    )}\n                </StyledComboBoxItemContent>\n            </StyledComboBoxItem>\n        ),\n        [\n            handleItemClick,\n            icons,\n            id,\n            imageUrl,\n            isDisabled,\n            isSelected,\n            isTouch,\n            rightElement,\n            shouldShowBigImage,\n            shouldShowRoundImage,\n            subtext,\n            suffixElement,\n            text,\n        ],\n    );\n};\n\nComboBoxItem.displayName = 'ComboBoxItem';\n\nexport default ComboBoxItem;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/components/tooltip/Tooltip.js

@@ -41,7 +41,7 @@ const Tooltip = ({
     content: content,
     ref: tooltipRef,
     container: container,
-    shouldUseChildrenWidth: false
+    shouldUseChildrenWidth: shouldUseChildrenWidth
   }, /*#__PURE__*/_react.default.createElement(_Tooltip.StyledTooltipChildren, {
     $isOnlyText: (0, _tooltip.isTextOnlyElement)(children),
     $shouldUseChildrenWidth: shouldUseChildrenWidth

package/lib/cjs/components/tooltip/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","names":["_react","_interopRequireWildcard","require","_tooltip","_Popup","_interopRequireDefault","_TooltipItem","_Tooltip","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Tooltip","item","children","container","isDisabled","itemWidth","shouldUseChildrenWidth","tooltipRef","useRef","content","useMemo","isValidElement","createElement","width","text","headline","imageUrl","button","StyledTooltip","StyledTooltipChildren","$isOnlyText","isTextOnlyElement","$shouldUseChildrenWidth","shouldShowOnHover","ref","displayName","_default","exports"],"sources":["../../../../src/components/tooltip/Tooltip.tsx"],"sourcesContent":["import React, { FC, isValidElement, ReactNode, useMemo, useRef, type CSSProperties } from 'react';\nimport type { PopupRef } from '../../types/popup';\nimport type { ITooltipItem } from '../../types/tooltip';\nimport { isTextOnlyElement } from '../../utils/tooltip';\nimport Popup from '../popup/Popup';\nimport TooltipItem from './tooltip-item/TooltipItem';\nimport { StyledTooltip, StyledTooltipChildren } from './Tooltip.styles';\n\nexport type TooltipProps = {\n    /**\n     * The elements that the tooltip should surround.\n     */\n    children: ReactNode;\n    /**\n     * The element where the content of the `Tooltip` should be rendered via React Portal.\n     */\n    container?: Element;\n    /**\n     * The content that should be displayed.\n     */\n    item: ITooltipItem | ReactNode;\n    /**\n     * The width of an item.\n     */\n    itemWidth?: CSSProperties['width'];\n    /**\n     * whether the tooltip should be shown.\n     */\n    isDisabled?: boolean;\n    /**\n     * Whether the width of the children should be used.\n     */\n    shouldUseChildrenWidth?: boolean;\n};\n\nconst Tooltip: FC<TooltipProps> = ({\n    item,\n    children,\n    container,\n    isDisabled,\n    itemWidth,\n    shouldUseChildrenWidth = true,\n}) => {\n    const tooltipRef = useRef<PopupRef>(null);\n\n    const content = useMemo(() => {\n        if (isValidElement(item)) {\n            return item;\n        }\n\n        return (\n            <TooltipItem\n                width={itemWidth}\n                text={(item as ITooltipItem).text}\n                headline={(item as ITooltipItem).headline}\n                imageUrl={(item as ITooltipItem).imageUrl}\n                button={(item as ITooltipItem).button}\n            />\n        );\n    }, [item, itemWidth]);\n\n    return useMemo(\n        () => (\n            <StyledTooltip>\n                {isDisabled ? (\n                    <StyledTooltipChildren\n                        $isOnlyText={isTextOnlyElement(children)}\n                        $shouldUseChildrenWidth={shouldUseChildrenWidth}\n                    >\n                        {children}\n                    </StyledTooltipChildren>\n                ) : (\n                    <Popup\n                        shouldShowOnHover\n                        content={content}\n                        ref={tooltipRef}\n                        container={container}\n                        shouldUseChildrenWidth={false}\n                    >\n                        <StyledTooltipChildren\n                            $isOnlyText={isTextOnlyElement(children)}\n                            $shouldUseChildrenWidth={shouldUseChildrenWidth}\n                        >\n                            {children}\n                        </StyledTooltipChildren>\n                    </Popup>\n                )}\n            </StyledTooltip>\n        ),\n        [isDisabled, children, shouldUseChildrenWidth, content, container],\n    );\n};\n\nTooltip.displayName = 'Tooltip';\n\nexport default Tooltip;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,uBAAA,CAAAC,OAAA;AAGA,IAAAC,QAAA,GAAAD,OAAA;AACA,IAAAE,MAAA,GAAAC,sBAAA,CAAAH,OAAA;AACA,IAAAI,YAAA,GAAAD,sBAAA,CAAAH,OAAA;AACA,IAAAK,QAAA,GAAAL,OAAA;AAAwE,SAAAG,uBAAAG,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,SAAAP,wBAAAO,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;AA6BxE,MAAMW,OAAyB,GAAGA,CAAC;EAC/BC,IAAI;EACJC,QAAQ;EACRC,SAAS;EACTC,UAAU;EACVC,SAAS;EACTC,sBAAsB,GAAG;AAC7B,CAAC,KAAK;EACF,MAAMC,UAAU,GAAG,IAAAC,aAAM,EAAW,IAAI,CAAC;EAEzC,MAAMC,OAAO,GAAG,IAAAC,cAAO,EAAC,MAAM;IAC1B,iBAAI,IAAAC,qBAAc,EAACV,IAAI,CAAC,EAAE;MACtB,OAAOA,IAAI;IACf;IAEA,oBACI7B,MAAA,CAAAU,OAAA,CAAA8B,aAAA,CAAClC,YAAA,CAAAI,OAAW;MACR+B,KAAK,EAAER,SAAU;MACjBS,IAAI,EAAGb,IAAI,CAAkBa,IAAK;MAClCC,QAAQ,EAAGd,IAAI,CAAkBc,QAAS;MAC1CC,QAAQ,EAAGf,IAAI,CAAkBe,QAAS;MAC1CC,MAAM,EAAGhB,IAAI,CAAkBgB;IAAO,CACzC,CAAC;EAEV,CAAC,EAAE,CAAChB,IAAI,EAAEI,SAAS,CAAC,CAAC;EAErB,OAAO,IAAAK,cAAO,EACV,mBACItC,MAAA,CAAAU,OAAA,CAAA8B,aAAA,CAACjC,QAAA,CAAAuC,aAAa,QACTd,UAAU,gBACPhC,MAAA,CAAAU,OAAA,CAAA8B,aAAA,CAACjC,QAAA,CAAAwC,qBAAqB;IAClBC,WAAW,EAAE,IAAAC,0BAAiB,EAACnB,QAAQ,CAAE;IACzCoB,uBAAuB,EAAEhB;EAAuB,GAE/CJ,QACkB,CAAC,gBAExB9B,MAAA,CAAAU,OAAA,CAAA8B,aAAA,CAACpC,MAAA,CAAAM,OAAK;IACFyC,iBAAiB;IACjBd,OAAO,EAAEA,OAAQ;IACjBe,GAAG,EAAEjB,UAAW;IAChBJ,SAAS,EAAEA,SAAU;IACrBG,sBAAsB,EAAE;EAAM,gBAE9BlC,MAAA,CAAAU,OAAA,CAAA8B,aAAA,CAACjC,QAAA,CAAAwC,qBAAqB;IAClBC,WAAW,EAAE,IAAAC,0BAAiB,EAACnB,QAAQ,CAAE;IACzCoB,uBAAuB,EAAEhB;EAAuB,GAE/CJ,QACkB,CACpB,CAEA,CAClB,EACD,CAACE,UAAU,EAAEF,QAAQ,EAAEI,sBAAsB,EAAEG,OAAO,EAAEN,SAAS,CACrE,CAAC;AACL,CAAC;AAEDH,OAAO,CAACyB,WAAW,GAAG,SAAS;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAA7C,OAAA,GAEjBkB,OAAO","ignoreList":[]}
+{"version":3,"file":"Tooltip.js","names":["_react","_interopRequireWildcard","require","_tooltip","_Popup","_interopRequireDefault","_TooltipItem","_Tooltip","e","__esModule","default","_getRequireWildcardCache","WeakMap","r","t","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","Tooltip","item","children","container","isDisabled","itemWidth","shouldUseChildrenWidth","tooltipRef","useRef","content","useMemo","isValidElement","createElement","width","text","headline","imageUrl","button","StyledTooltip","StyledTooltipChildren","$isOnlyText","isTextOnlyElement","$shouldUseChildrenWidth","shouldShowOnHover","ref","displayName","_default","exports"],"sources":["../../../../src/components/tooltip/Tooltip.tsx"],"sourcesContent":["import React, { FC, isValidElement, ReactNode, useMemo, useRef, type CSSProperties } from 'react';\nimport type { PopupRef } from '../../types/popup';\nimport type { ITooltipItem } from '../../types/tooltip';\nimport { isTextOnlyElement } from '../../utils/tooltip';\nimport Popup from '../popup/Popup';\nimport TooltipItem from './tooltip-item/TooltipItem';\nimport { StyledTooltip, StyledTooltipChildren } from './Tooltip.styles';\n\nexport type TooltipProps = {\n    /**\n     * The elements that the tooltip should surround.\n     */\n    children: ReactNode;\n    /**\n     * The element where the content of the `Tooltip` should be rendered via React Portal.\n     */\n    container?: Element;\n    /**\n     * The content that should be displayed.\n     */\n    item: ITooltipItem | ReactNode;\n    /**\n     * The width of an item.\n     */\n    itemWidth?: CSSProperties['width'];\n    /**\n     * whether the tooltip should be shown.\n     */\n    isDisabled?: boolean;\n    /**\n     * Whether the width of the children should be used.\n     */\n    shouldUseChildrenWidth?: boolean;\n};\n\nconst Tooltip: FC<TooltipProps> = ({\n    item,\n    children,\n    container,\n    isDisabled,\n    itemWidth,\n    shouldUseChildrenWidth = true,\n}) => {\n    const tooltipRef = useRef<PopupRef>(null);\n\n    const content = useMemo(() => {\n        if (isValidElement(item)) {\n            return item;\n        }\n\n        return (\n            <TooltipItem\n                width={itemWidth}\n                text={(item as ITooltipItem).text}\n                headline={(item as ITooltipItem).headline}\n                imageUrl={(item as ITooltipItem).imageUrl}\n                button={(item as ITooltipItem).button}\n            />\n        );\n    }, [item, itemWidth]);\n\n    return useMemo(\n        () => (\n            <StyledTooltip>\n                {isDisabled ? (\n                    <StyledTooltipChildren\n                        $isOnlyText={isTextOnlyElement(children)}\n                        $shouldUseChildrenWidth={shouldUseChildrenWidth}\n                    >\n                        {children}\n                    </StyledTooltipChildren>\n                ) : (\n                    <Popup\n                        shouldShowOnHover\n                        content={content}\n                        ref={tooltipRef}\n                        container={container}\n                        shouldUseChildrenWidth={shouldUseChildrenWidth}\n                    >\n                        <StyledTooltipChildren\n                            $isOnlyText={isTextOnlyElement(children)}\n                            $shouldUseChildrenWidth={shouldUseChildrenWidth}\n                        >\n                            {children}\n                        </StyledTooltipChildren>\n                    </Popup>\n                )}\n            </StyledTooltip>\n        ),\n        [isDisabled, children, shouldUseChildrenWidth, content, container],\n    );\n};\n\nTooltip.displayName = 'Tooltip';\n\nexport default Tooltip;\n"],"mappings":"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","ignoreList":[]}

package/lib/cjs/utils/slider.js

@@ -44,7 +44,7 @@ const calculateGradientOffset = ({
 }) => {
   const percentage = (value - min) / (max - min);
   const adjustedWidth = containerWidth - thumbWidth / 2;
-  return percentage * adjustedWidth + thumbWidth / 2;
+  return percentage * adjustedWidth + thumbWidth / 2 + 5;
 };
 exports.calculateGradientOffset = calculateGradientOffset;
 const calculatePopupPosition = ({

package/lib/cjs/utils/slider.js.map

@@ -1 +1 @@
-{"version":3,"file":"slider.js","names":["fillSlider","fromSlider","toSlider","theme","fromValue","toValue","rangeDistance","Number","max","min","fromPosition","value","toPosition","backgroundColor","trackColor","gradient","style","background","exports","calculateGradientOffset","thumbWidth","containerWidth","percentage","adjustedWidth","calculatePopupPosition","sliderValue","popupWidth","leftAtMin","leftAtMax","getThumbMaxWidth","maxNumber","thumbLabelFormatter","element","document","createElement","height","display","padding","whiteSpace","minWidth","opacity","position","textContent","String","body","appendChild","width","offsetWidth","removeChild"],"sources":["../../../src/utils/slider.ts"],"sourcesContent":["import type { Theme } from '../components/color-scheme-provider/ColorSchemeProvider';\n\nexport interface FillSlider {\n    fromSlider: HTMLInputElement;\n    toSlider: HTMLInputElement;\n    fromValue?: number;\n    toValue?: number;\n    theme: Theme;\n}\n\nexport const fillSlider = ({ fromSlider, toSlider, theme, fromValue, toValue }: FillSlider) => {\n    const rangeDistance = Number(toSlider.max) - Number(toSlider.min);\n    const fromPosition = Number(fromValue ?? fromSlider.value) - Number(toSlider.min);\n    const toPosition = Number(toValue ?? toSlider.value) - Number(toSlider.min);\n\n    const backgroundColor = theme['403'];\n    const trackColor = theme['409'];\n\n    if (!backgroundColor || !trackColor) {\n        return;\n    }\n\n    const gradient = `linear-gradient(\n      to right,\n      ${backgroundColor} 0%,\n      ${backgroundColor} ${(fromPosition / rangeDistance) * 100}%,\n      ${trackColor} ${(fromPosition / rangeDistance) * 100}%,\n      ${trackColor} ${(toPosition / rangeDistance) * 100}%,\n      ${backgroundColor} ${(toPosition / rangeDistance) * 100}%,\n      ${backgroundColor} 100%)`;\n\n    // Apply the gradient to the appropriate slider\n    // eslint-disable-next-line no-param-reassign\n    toSlider.style.background = gradient;\n    // eslint-disable-next-line no-param-reassign\n    fromSlider.style.background = gradient;\n};\n\ninterface CalculateGradientOffset {\n    value: number;\n    min: number;\n    max: number;\n    thumbWidth: number;\n    containerWidth: number;\n}\n\nexport const calculateGradientOffset = ({\n    value,\n    min,\n    max,\n    thumbWidth,\n    containerWidth,\n}: CalculateGradientOffset): number => {\n    const percentage = (value - min) / (max - min);\n\n    const adjustedWidth = containerWidth - thumbWidth / 2;\n\n    return percentage * adjustedWidth + thumbWidth / 2;\n};\n\ninterface GetThumbMaxWidthOptions {\n    maxNumber: number;\n    thumbLabelFormatter?: (value: number) => string;\n}\n\ninterface CalculatePopupPositionOptions {\n    sliderValue: number;\n    min: number;\n    max: number;\n    popupWidth: number;\n}\n\nexport const calculatePopupPosition = ({\n    sliderValue,\n    min,\n    max,\n    popupWidth,\n}: CalculatePopupPositionOptions) => {\n    // Berechnung des Prozentwerts des Sliders zwischen min und max\n    const percentage = (sliderValue - min) / (max - min);\n\n    // Berechnung des linken Versatzes bei 0% (-10px) und bei 100% (-popupWidth + 20px)\n    const leftAtMin = -10;\n    const leftAtMax = -popupWidth + 25;\n\n    // Berechnung des dynamischen Left-Werts basierend auf dem Slider-Prozentwert\n    return leftAtMin + percentage * (leftAtMax - leftAtMin);\n};\n\nexport const getThumbMaxWidth = ({ maxNumber, thumbLabelFormatter }: GetThumbMaxWidthOptions) => {\n    const element = document.createElement('span');\n\n    element.style.height = '20px';\n    element.style.display = 'flex';\n    element.style.padding = '16px';\n    element.style.whiteSpace = 'nowrap';\n    element.style.minWidth = '20px';\n    element.style.opacity = '0';\n    element.style.position = 'absolute';\n\n    element.textContent =\n        typeof thumbLabelFormatter === 'function'\n            ? thumbLabelFormatter(maxNumber)\n            : String(maxNumber);\n\n    document.body.appendChild(element);\n\n    const width = element.offsetWidth;\n\n    document.body.removeChild(element);\n\n    return width;\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"slider.js","names":["fillSlider","fromSlider","toSlider","theme","fromValue","toValue","rangeDistance","Number","max","min","fromPosition","value","toPosition","backgroundColor","trackColor","gradient","style","background","exports","calculateGradientOffset","thumbWidth","containerWidth","percentage","adjustedWidth","calculatePopupPosition","sliderValue","popupWidth","leftAtMin","leftAtMax","getThumbMaxWidth","maxNumber","thumbLabelFormatter","element","document","createElement","height","display","padding","whiteSpace","minWidth","opacity","position","textContent","String","body","appendChild","width","offsetWidth","removeChild"],"sources":["../../../src/utils/slider.ts"],"sourcesContent":["import type { Theme } from '../components/color-scheme-provider/ColorSchemeProvider';\n\nexport interface FillSlider {\n    fromSlider: HTMLInputElement;\n    toSlider: HTMLInputElement;\n    fromValue?: number;\n    toValue?: number;\n    theme: Theme;\n}\n\nexport const fillSlider = ({ fromSlider, toSlider, theme, fromValue, toValue }: FillSlider) => {\n    const rangeDistance = Number(toSlider.max) - Number(toSlider.min);\n    const fromPosition = Number(fromValue ?? fromSlider.value) - Number(toSlider.min);\n    const toPosition = Number(toValue ?? toSlider.value) - Number(toSlider.min);\n\n    const backgroundColor = theme['403'];\n    const trackColor = theme['409'];\n\n    if (!backgroundColor || !trackColor) {\n        return;\n    }\n\n    const gradient = `linear-gradient(\n      to right,\n      ${backgroundColor} 0%,\n      ${backgroundColor} ${(fromPosition / rangeDistance) * 100}%,\n      ${trackColor} ${(fromPosition / rangeDistance) * 100}%,\n      ${trackColor} ${(toPosition / rangeDistance) * 100}%,\n      ${backgroundColor} ${(toPosition / rangeDistance) * 100}%,\n      ${backgroundColor} 100%)`;\n\n    // Apply the gradient to the appropriate slider\n    // eslint-disable-next-line no-param-reassign\n    toSlider.style.background = gradient;\n    // eslint-disable-next-line no-param-reassign\n    fromSlider.style.background = gradient;\n};\n\ninterface CalculateGradientOffset {\n    value: number;\n    min: number;\n    max: number;\n    thumbWidth: number;\n    containerWidth: number;\n}\n\nexport const calculateGradientOffset = ({\n    value,\n    min,\n    max,\n    thumbWidth,\n    containerWidth,\n}: CalculateGradientOffset): number => {\n    const percentage = (value - min) / (max - min);\n\n    const adjustedWidth = containerWidth - thumbWidth / 2;\n\n    return percentage * adjustedWidth + thumbWidth / 2 + 5;\n};\n\ninterface GetThumbMaxWidthOptions {\n    maxNumber: number;\n    thumbLabelFormatter?: (value: number) => string;\n}\n\ninterface CalculatePopupPositionOptions {\n    sliderValue: number;\n    min: number;\n    max: number;\n    popupWidth: number;\n}\n\nexport const calculatePopupPosition = ({\n    sliderValue,\n    min,\n    max,\n    popupWidth,\n}: CalculatePopupPositionOptions) => {\n    // Berechnung des Prozentwerts des Sliders zwischen min und max\n    const percentage = (sliderValue - min) / (max - min);\n\n    // Berechnung des linken Versatzes bei 0% (-10px) und bei 100% (-popupWidth + 20px)\n    const leftAtMin = -10;\n    const leftAtMax = -popupWidth + 25;\n\n    // Berechnung des dynamischen Left-Werts basierend auf dem Slider-Prozentwert\n    return leftAtMin + percentage * (leftAtMax - leftAtMin);\n};\n\nexport const getThumbMaxWidth = ({ maxNumber, thumbLabelFormatter }: GetThumbMaxWidthOptions) => {\n    const element = document.createElement('span');\n\n    element.style.height = '20px';\n    element.style.display = 'flex';\n    element.style.padding = '16px';\n    element.style.whiteSpace = 'nowrap';\n    element.style.minWidth = '20px';\n    element.style.opacity = '0';\n    element.style.position = 'absolute';\n\n    element.textContent =\n        typeof thumbLabelFormatter === 'function'\n            ? thumbLabelFormatter(maxNumber)\n            : String(maxNumber);\n\n    document.body.appendChild(element);\n\n    const width = element.offsetWidth;\n\n    document.body.removeChild(element);\n\n    return width;\n};\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/badge/Badge.styles.js

@@ -29,6 +29,7 @@ export const StyledBadge = styled.div`
   return $minWidth;
 }};
     padding: 2px 6px;
+    line-height: 20px;
     text-align: center;
     cursor: ${_ref5 => {
   let {

package/lib/esm/components/badge/Badge.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.styles.js","names":["styled","StyledBadge","div","_ref","$backgroundColor","theme","_ref2","$borderRadius","_ref3","$fontColor","text","_ref4","$minWidth","_ref5","$cursor"],"sources":["../../../../src/components/badge/Badge.styles.ts"],"sourcesContent":["import type { CSSProperties } from 'react';\nimport styled from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledBadgeProps = WithTheme<{\n    $cursor: CSSProperties['cursor'];\n    $backgroundColor?: CSSProperties['backgroundColor'];\n    $borderRadius: CSSProperties['borderRadius'];\n    $fontColor?: CSSProperties['color'];\n    $minWidth: CSSProperties['minWidth'];\n}>;\n\nexport const StyledBadge = styled.div<StyledBadgeProps>`\n    background-color: ${({ $backgroundColor, theme }: StyledBadgeProps) =>\n        $backgroundColor ?? theme['secondary-202']};\n    border-radius: ${({ $borderRadius }) => $borderRadius};\n    color: ${({ $fontColor, theme }: StyledBadgeProps) => $fontColor ?? theme.text};\n    display: inline-block;\n    font-size: 0.8rem;\n    min-width: ${({ $minWidth }) => $minWidth};\n    padding: 2px 6px;\n    text-align: center;\n    cursor: ${({ $cursor }) => $cursor};\n`;\n"],"mappings":"AACA,OAAOA,MAAM,MAAM,mBAAmB;AAWtC,OAAO,MAAMC,WAAW,GAAGD,MAAM,CAACE,GAAqB;AACvD,wBAAwBC,IAAA;EAAA,IAAC;IAAEC,gBAAgB;IAAEC;EAAwB,CAAC,GAAAF,IAAA;EAAA,OAC9DC,gBAAgB,IAAIC,KAAK,CAAC,eAAe,CAAC;AAAA;AAClD,qBAAqBC,KAAA;EAAA,IAAC;IAAEC;EAAc,CAAC,GAAAD,KAAA;EAAA,OAAKC,aAAa;AAAA;AACzD,aAAaC,KAAA;EAAA,IAAC;IAAEC,UAAU;IAAEJ;EAAwB,CAAC,GAAAG,KAAA;EAAA,OAAKC,UAAU,IAAIJ,KAAK,CAACK,IAAI;AAAA;AAClF;AACA;AACA,iBAAiBC,KAAA;EAAA,IAAC;IAAEC;EAAU,CAAC,GAAAD,KAAA;EAAA,OAAKC,SAAS;AAAA;AAC7C;AACA;AACA,cAAcC,KAAA;EAAA,IAAC;IAAEC;EAAQ,CAAC,GAAAD,KAAA;EAAA,OAAKC,OAAO;AAAA;AACtC,CAAC","ignoreList":[]}
+{"version":3,"file":"Badge.styles.js","names":["styled","StyledBadge","div","_ref","$backgroundColor","theme","_ref2","$borderRadius","_ref3","$fontColor","text","_ref4","$minWidth","_ref5","$cursor"],"sources":["../../../../src/components/badge/Badge.styles.ts"],"sourcesContent":["import type { CSSProperties } from 'react';\nimport styled from 'styled-components';\nimport type { WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledBadgeProps = WithTheme<{\n    $cursor: CSSProperties['cursor'];\n    $backgroundColor?: CSSProperties['backgroundColor'];\n    $borderRadius: CSSProperties['borderRadius'];\n    $fontColor?: CSSProperties['color'];\n    $minWidth: CSSProperties['minWidth'];\n}>;\n\nexport const StyledBadge = styled.div<StyledBadgeProps>`\n    background-color: ${({ $backgroundColor, theme }: StyledBadgeProps) =>\n        $backgroundColor ?? theme['secondary-202']};\n    border-radius: ${({ $borderRadius }) => $borderRadius};\n    color: ${({ $fontColor, theme }: StyledBadgeProps) => $fontColor ?? theme.text};\n    display: inline-block;\n    font-size: 0.8rem;\n    min-width: ${({ $minWidth }) => $minWidth};\n    padding: 2px 6px;\n    line-height: 20px;\n    text-align: center;\n    cursor: ${({ $cursor }) => $cursor};\n`;\n"],"mappings":"AACA,OAAOA,MAAM,MAAM,mBAAmB;AAWtC,OAAO,MAAMC,WAAW,GAAGD,MAAM,CAACE,GAAqB;AACvD,wBAAwBC,IAAA;EAAA,IAAC;IAAEC,gBAAgB;IAAEC;EAAwB,CAAC,GAAAF,IAAA;EAAA,OAC9DC,gBAAgB,IAAIC,KAAK,CAAC,eAAe,CAAC;AAAA;AAClD,qBAAqBC,KAAA;EAAA,IAAC;IAAEC;EAAc,CAAC,GAAAD,KAAA;EAAA,OAAKC,aAAa;AAAA;AACzD,aAAaC,KAAA;EAAA,IAAC;IAAEC,UAAU;IAAEJ;EAAwB,CAAC,GAAAG,KAAA;EAAA,OAAKC,UAAU,IAAIJ,KAAK,CAACK,IAAI;AAAA;AAClF;AACA;AACA,iBAAiBC,KAAA;EAAA,IAAC;IAAEC;EAAU,CAAC,GAAAD,KAAA;EAAA,OAAKC,SAAS;AAAA;AAC7C;AACA;AACA;AACA,cAAcC,KAAA;EAAA,IAAC;IAAEC;EAAQ,CAAC,GAAAD,KAAA;EAAA,OAAKC,OAAO;AAAA;AACtC,CAAC","ignoreList":[]}

package/lib/esm/components/button/Button.styles.js

@@ -56,7 +56,7 @@ export const StyledMotionButton = styled(motion.button)`
   return $isDisabled ? 'default' : 'pointer';
 }};
     display: inline-flex;
-    line-height: 1.15;
+    line-height: 22px;
     min-height: 32px;
     position: relative;
     user-select: none;
@@ -69,15 +69,15 @@ export const StyledMotionButton = styled(motion.button)`
   if ($hasIcon) {
     if ($hasChildren) {
       return css`
-                    padding: 7px 12px 7px 42px;
+                    padding: 6px 12px 6px 42px;
                 `;
     }
     return css`
-                padding: 7px 12px 7px 18px;
+                padding: 6px 12px 6px 18px;
             `;
   }
   return css`
-            padding: 7px 12px 7px 12px;
+            padding: 6px 12px 6px 12px;
         `;
 }}
 `;

package/lib/esm/components/button/Button.styles.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.styles.js","names":["motion","styled","css","StyledMotionButton","button","_ref","$shouldShowTextAsRobotoMedium","$shouldShowAsSelectButton","_ref2","$isSecondary","theme","text","buttonDesign","buttonColor","buttonBackgroundColor","_ref3","_ref4","$isDisabled","_ref5","$hasIcon","$hasChildren","StyledIconWrapper","span","StyledMotionChildrenWrapper","div","StyledMotionWaitCursorWrapper"],"sources":["../../../../src/components/button/Button.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type { FramerMotionBugFix, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledButtonProps = WithTheme<{\n    $hasIcon: boolean;\n    $hasChildren: boolean;\n    $isDisabled?: boolean;\n    $isSecondary?: boolean;\n    $shouldShowTextAsRobotoMedium: boolean;\n    $shouldShowAsSelectButton: boolean;\n}>;\n\nexport const StyledMotionButton = styled(motion.button)<StyledButtonProps>`\n    ${({ $shouldShowTextAsRobotoMedium, $shouldShowAsSelectButton }) =>\n        $shouldShowTextAsRobotoMedium &&\n        !$shouldShowAsSelectButton &&\n        css`\n            font-size: 110%;\n            font-family: 'Roboto Medium', serif;\n        `}\n\n    align-items: center;\n\n    ${({ $isSecondary, $shouldShowAsSelectButton, theme }: StyledButtonProps) => {\n        if ($isSecondary || $shouldShowAsSelectButton) {\n            return css`\n                color: ${theme.text};\n            `;\n        }\n\n        return css`\n            color: ${theme.buttonDesign === '2'\n                ? (theme.buttonColor ?? theme.buttonBackgroundColor ?? 'white')\n                : (theme.buttonColor ?? 'white')};\n        `;\n    }}\n\n    ${({ theme, $isSecondary, $shouldShowAsSelectButton }: StyledButtonProps) => {\n        if (theme.buttonDesign === '2' && !$shouldShowAsSelectButton) {\n            return css`\n                border: 1px solid ${$isSecondary ? theme['202'] : theme.buttonBackgroundColor};\n                box-shadow: none;\n            `;\n        }\n\n        return css`\n            border: none;\n            box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.2);\n        `;\n    }}\n\n    border-radius: 3px;\n    cursor: ${({ $isDisabled }) => ($isDisabled ? 'default' : 'pointer')};\n    display: inline-flex;\n    line-height: 1.15;\n    min-height: 32px;\n    position: relative;\n    user-select: none;\n\n    ${({ $hasIcon, $hasChildren }) => {\n        if ($hasIcon) {\n            if ($hasChildren) {\n                return css`\n                    padding: 7px 12px 7px 42px;\n                `;\n            }\n            return css`\n                padding: 7px 12px 7px 18px;\n            `;\n        }\n        return css`\n            padding: 7px 12px 7px 12px;\n        `;\n    }}\n`;\n//\nexport const StyledIconWrapper = styled.span`\n    align-items: center;\n    background-color: rgba(255, 255, 255, 0.2);\n    bottom: 0;\n    display: flex;\n    justify-content: center;\n    left: 0;\n    position: absolute;\n    top: 0;\n    width: 30px;\n`;\n\nexport const StyledMotionChildrenWrapper = styled(motion.div)<FramerMotionBugFix>`\n    will-change: unset !important;\n`;\n\nexport const StyledMotionWaitCursorWrapper = styled(motion.div)<FramerMotionBugFix>`\n    align-items: center;\n    display: flex;\n    justify-content: center;\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,eAAe;AACtC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAY/C,OAAO,MAAMC,kBAAkB,GAAGF,MAAM,CAACD,MAAM,CAACI,MAAM,CAAoB;AAC1E,MAAMC,IAAA;EAAA,IAAC;IAAEC,6BAA6B;IAAEC;EAA0B,CAAC,GAAAF,IAAA;EAAA,OAC3DC,6BAA6B,IAC7B,CAACC,yBAAyB,IAC1BL,GAAG;AACX;AACA;AACA,SAAS;AAAA;AACT;AACA;AACA;AACA,MAAMM,KAAA,IAA2E;EAAA,IAA1E;IAAEC,YAAY;IAAEF,yBAAyB;IAAEG;EAAyB,CAAC,GAAAF,KAAA;EACpE,IAAIC,YAAY,IAAIF,yBAAyB,EAAE;IAC3C,OAAOL,GAAG;AACtB,yBAAyBQ,KAAK,CAACC,IAAI;AACnC,aAAa;EACL;EAEA,OAAOT,GAAG;AAClB,qBAAqBQ,KAAK,CAACE,YAAY,KAAK,GAAG,GAC5BF,KAAK,CAACG,WAAW,IAAIH,KAAK,CAACI,qBAAqB,IAAI,OAAO,GAC3DJ,KAAK,CAACG,WAAW,IAAI,OAAQ;AAChD,SAAS;AACL,CAAC;AACL;AACA,MAAME,KAAA,IAA2E;EAAA,IAA1E;IAAEL,KAAK;IAAED,YAAY;IAAEF;EAA6C,CAAC,GAAAQ,KAAA;EACpE,IAAIL,KAAK,CAACE,YAAY,KAAK,GAAG,IAAI,CAACL,yBAAyB,EAAE;IAC1D,OAAOL,GAAG;AACtB,oCAAoCO,YAAY,GAAGC,KAAK,CAAC,KAAK,CAAC,GAAGA,KAAK,CAACI,qBAAqB;AAC7F;AACA,aAAa;EACL;EAEA,OAAOZ,GAAG;AAClB;AACA;AACA,SAAS;AACL,CAAC;AACL;AACA;AACA,cAAcc,KAAA;EAAA,IAAC;IAAEC;EAAY,CAAC,GAAAD,KAAA;EAAA,OAAMC,WAAW,GAAG,SAAS,GAAG,SAAS;AAAA,CAAC;AACxE;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,KAAA,IAAgC;EAAA,IAA/B;IAAEC,QAAQ;IAAEC;EAAa,CAAC,GAAAF,KAAA;EACzB,IAAIC,QAAQ,EAAE;IACV,IAAIC,YAAY,EAAE;MACd,OAAOlB,GAAG;AAC1B;AACA,iBAAiB;IACL;IACA,OAAOA,GAAG;AACtB;AACA,aAAa;EACL;EACA,OAAOA,GAAG;AAClB;AACA,SAAS;AACL,CAAC;AACL,CAAC;AACD;AACA,OAAO,MAAMmB,iBAAiB,GAAGpB,MAAM,CAACqB,IAAI;AAC5C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMC,2BAA2B,GAAGtB,MAAM,CAACD,MAAM,CAACwB,GAAG,CAAqB;AACjF;AACA,CAAC;AAED,OAAO,MAAMC,6BAA6B,GAAGxB,MAAM,CAACD,MAAM,CAACwB,GAAG,CAAqB;AACnF;AACA;AACA;AACA,CAAC","ignoreList":[]}
+{"version":3,"file":"Button.styles.js","names":["motion","styled","css","StyledMotionButton","button","_ref","$shouldShowTextAsRobotoMedium","$shouldShowAsSelectButton","_ref2","$isSecondary","theme","text","buttonDesign","buttonColor","buttonBackgroundColor","_ref3","_ref4","$isDisabled","_ref5","$hasIcon","$hasChildren","StyledIconWrapper","span","StyledMotionChildrenWrapper","div","StyledMotionWaitCursorWrapper"],"sources":["../../../../src/components/button/Button.styles.ts"],"sourcesContent":["import { motion } from 'framer-motion';\nimport styled, { css } from 'styled-components';\nimport type { FramerMotionBugFix, WithTheme } from '../color-scheme-provider/ColorSchemeProvider';\n\ntype StyledButtonProps = WithTheme<{\n    $hasIcon: boolean;\n    $hasChildren: boolean;\n    $isDisabled?: boolean;\n    $isSecondary?: boolean;\n    $shouldShowTextAsRobotoMedium: boolean;\n    $shouldShowAsSelectButton: boolean;\n}>;\n\nexport const StyledMotionButton = styled(motion.button)<StyledButtonProps>`\n    ${({ $shouldShowTextAsRobotoMedium, $shouldShowAsSelectButton }) =>\n        $shouldShowTextAsRobotoMedium &&\n        !$shouldShowAsSelectButton &&\n        css`\n            font-size: 110%;\n            font-family: 'Roboto Medium', serif;\n        `}\n\n    align-items: center;\n\n    ${({ $isSecondary, $shouldShowAsSelectButton, theme }: StyledButtonProps) => {\n        if ($isSecondary || $shouldShowAsSelectButton) {\n            return css`\n                color: ${theme.text};\n            `;\n        }\n\n        return css`\n            color: ${theme.buttonDesign === '2'\n                ? (theme.buttonColor ?? theme.buttonBackgroundColor ?? 'white')\n                : (theme.buttonColor ?? 'white')};\n        `;\n    }}\n\n    ${({ theme, $isSecondary, $shouldShowAsSelectButton }: StyledButtonProps) => {\n        if (theme.buttonDesign === '2' && !$shouldShowAsSelectButton) {\n            return css`\n                border: 1px solid ${$isSecondary ? theme['202'] : theme.buttonBackgroundColor};\n                box-shadow: none;\n            `;\n        }\n\n        return css`\n            border: none;\n            box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.2);\n        `;\n    }}\n\n    border-radius: 3px;\n    cursor: ${({ $isDisabled }) => ($isDisabled ? 'default' : 'pointer')};\n    display: inline-flex;\n    line-height: 22px;\n    min-height: 32px;\n    position: relative;\n    user-select: none;\n\n    ${({ $hasIcon, $hasChildren }) => {\n        if ($hasIcon) {\n            if ($hasChildren) {\n                return css`\n                    padding: 6px 12px 6px 42px;\n                `;\n            }\n            return css`\n                padding: 6px 12px 6px 18px;\n            `;\n        }\n        return css`\n            padding: 6px 12px 6px 12px;\n        `;\n    }}\n`;\n//\nexport const StyledIconWrapper = styled.span`\n    align-items: center;\n    background-color: rgba(255, 255, 255, 0.2);\n    bottom: 0;\n    display: flex;\n    justify-content: center;\n    left: 0;\n    position: absolute;\n    top: 0;\n    width: 30px;\n`;\n\nexport const StyledMotionChildrenWrapper = styled(motion.div)<FramerMotionBugFix>`\n    will-change: unset !important;\n`;\n\nexport const StyledMotionWaitCursorWrapper = styled(motion.div)<FramerMotionBugFix>`\n    align-items: center;\n    display: flex;\n    justify-content: center;\n`;\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,eAAe;AACtC,OAAOC,MAAM,IAAIC,GAAG,QAAQ,mBAAmB;AAY/C,OAAO,MAAMC,kBAAkB,GAAGF,MAAM,CAACD,MAAM,CAACI,MAAM,CAAoB;AAC1E,MAAMC,IAAA;EAAA,IAAC;IAAEC,6BAA6B;IAAEC;EAA0B,CAAC,GAAAF,IAAA;EAAA,OAC3DC,6BAA6B,IAC7B,CAACC,yBAAyB,IAC1BL,GAAG;AACX;AACA;AACA,SAAS;AAAA;AACT;AACA;AACA;AACA,MAAMM,KAAA,IAA2E;EAAA,IAA1E;IAAEC,YAAY;IAAEF,yBAAyB;IAAEG;EAAyB,CAAC,GAAAF,KAAA;EACpE,IAAIC,YAAY,IAAIF,yBAAyB,EAAE;IAC3C,OAAOL,GAAG;AACtB,yBAAyBQ,KAAK,CAACC,IAAI;AACnC,aAAa;EACL;EAEA,OAAOT,GAAG;AAClB,qBAAqBQ,KAAK,CAACE,YAAY,KAAK,GAAG,GAC5BF,KAAK,CAACG,WAAW,IAAIH,KAAK,CAACI,qBAAqB,IAAI,OAAO,GAC3DJ,KAAK,CAACG,WAAW,IAAI,OAAQ;AAChD,SAAS;AACL,CAAC;AACL;AACA,MAAME,KAAA,IAA2E;EAAA,IAA1E;IAAEL,KAAK;IAAED,YAAY;IAAEF;EAA6C,CAAC,GAAAQ,KAAA;EACpE,IAAIL,KAAK,CAACE,YAAY,KAAK,GAAG,IAAI,CAACL,yBAAyB,EAAE;IAC1D,OAAOL,GAAG;AACtB,oCAAoCO,YAAY,GAAGC,KAAK,CAAC,KAAK,CAAC,GAAGA,KAAK,CAACI,qBAAqB;AAC7F;AACA,aAAa;EACL;EAEA,OAAOZ,GAAG;AAClB;AACA;AACA,SAAS;AACL,CAAC;AACL;AACA;AACA,cAAcc,KAAA;EAAA,IAAC;IAAEC;EAAY,CAAC,GAAAD,KAAA;EAAA,OAAMC,WAAW,GAAG,SAAS,GAAG,SAAS;AAAA,CAAC;AACxE;AACA;AACA;AACA;AACA;AACA;AACA,MAAMC,KAAA,IAAgC;EAAA,IAA/B;IAAEC,QAAQ;IAAEC;EAAa,CAAC,GAAAF,KAAA;EACzB,IAAIC,QAAQ,EAAE;IACV,IAAIC,YAAY,EAAE;MACd,OAAOlB,GAAG;AAC1B;AACA,iBAAiB;IACL;IACA,OAAOA,GAAG;AACtB;AACA,aAAa;EACL;EACA,OAAOA,GAAG;AAClB;AACA,SAAS;AACL,CAAC;AACL,CAAC;AACD;AACA,OAAO,MAAMmB,iBAAiB,GAAGpB,MAAM,CAACqB,IAAI;AAC5C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,CAAC;AAED,OAAO,MAAMC,2BAA2B,GAAGtB,MAAM,CAACD,MAAM,CAACwB,GAAG,CAAqB;AACjF;AACA,CAAC;AAED,OAAO,MAAMC,6BAA6B,GAAGxB,MAAM,CAACD,MAAM,CAACwB,GAAG,CAAqB;AACnF;AACA;AACA;AACA,CAAC","ignoreList":[]}

package/lib/esm/components/combobox/combobox-item/ComboBoxItem.js

@@ -25,10 +25,11 @@ const ComboBoxItem = _ref => {
         text,
         value,
         suffixElement,
-        imageUrl
+        imageUrl,
+        icons
       });
     }
-  }, [imageUrl, isDisabled, onSelect, suffixElement, text, value]);
+  }, [icons, imageUrl, isDisabled, onSelect, suffixElement, text, value]);
   const isTouch = getIsTouch();
   return useMemo(() => /*#__PURE__*/React.createElement(StyledComboBoxItem, {
     id: `combobox-item__${typeof id === 'number' ? String(id) : id}`,

package/lib/esm/components/combobox/combobox-item/ComboBoxItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboBoxItem.js","names":["React","useCallback","useMemo","getIsTouch","Icon","StyledComboBoxItem","StyledComboBoxItemContent","StyledComboBoxItemContentHeader","StyledComboBoxItemContentHeaderRightElement","StyledComboBoxItemContentHeaderText","StyledComboBoxItemContentSubtext","StyledComboBoxItemImage","ComboBoxItem","_ref","icons","id","imageUrl","isDisabled","isSelected","onSelect","rightElement","shouldShowBigImage","shouldShowRoundImage","subtext","suffixElement","textStyles","text","value","handleItemClick","isTouch","createElement","String","onClick","$isDisabled","$isSelected","$isTouch","src","$shouldShowBigImage","trim","$shouldShowRoundImage","as","tagName","style","styles","displayName"],"sources":["../../../../../src/components/combobox/combobox-item/ComboBoxItem.tsx"],"sourcesContent":["import React, { FC, ReactNode, useCallback, useMemo } from 'react';\nimport { getIsTouch } from '../../../utils/environment';\nimport Icon from '../../icon/Icon';\nimport type { ComboBoxProps, IComboBoxItem } from '../ComboBox';\nimport {\n    StyledComboBoxItem,\n    StyledComboBoxItemContent,\n    StyledComboBoxItemContentHeader,\n    StyledComboBoxItemContentHeaderRightElement,\n    StyledComboBoxItemContentHeaderText,\n    StyledComboBoxItemContentSubtext,\n    StyledComboBoxItemImage,\n} from './ComboBoxItem.styles';\n\nexport type ComboBoxItemProps = {\n    icons?: IComboBoxItem['icons'];\n    id: IComboBoxItem['value'];\n    imageUrl: IComboBoxItem['imageUrl'];\n    isDisabled?: IComboBoxItem['isDisabled'];\n    isSelected: boolean;\n    onSelect: (itemToSelect: IComboBoxItem) => void;\n    rightElement: IComboBoxItem['rightElement'];\n    shouldShowBigImage: ComboBoxProps['shouldShowBigImage'];\n    shouldShowRoundImage: ComboBoxProps['shouldShowRoundImage'];\n    subtext: IComboBoxItem['subtext'];\n    suffixElement?: ReactNode;\n    text: IComboBoxItem['text'];\n    value: IComboBoxItem['value'];\n    textStyles?: IComboBoxItem['textStyles'];\n};\n\nconst ComboBoxItem: FC<ComboBoxItemProps> = ({\n    icons,\n    id,\n    imageUrl,\n    isDisabled,\n    isSelected,\n    onSelect,\n    rightElement,\n    shouldShowBigImage,\n    shouldShowRoundImage,\n    subtext,\n    suffixElement,\n    textStyles,\n    text,\n    value,\n}) => {\n    const handleItemClick = useCallback(() => {\n        if (!isDisabled) {\n            onSelect({ text, value, suffixElement, imageUrl });\n        }\n    }, [imageUrl, isDisabled, onSelect, suffixElement, text, value]);\n\n    const isTouch = getIsTouch();\n\n    return useMemo(\n        () => (\n            <StyledComboBoxItem\n                id={`combobox-item__${typeof id === 'number' ? String(id) : id}`}\n                onClick={handleItemClick}\n                $isDisabled={isDisabled}\n                $isSelected={isSelected}\n                $isTouch={isTouch}\n            >\n                {imageUrl && (\n                    <StyledComboBoxItemImage\n                        src={imageUrl}\n                        $shouldShowBigImage={\n                            shouldShowBigImage ||\n                            (typeof subtext === 'string' && subtext.trim() !== '')\n                        }\n                        $shouldShowRoundImage={shouldShowRoundImage}\n                    />\n                )}\n                {icons && <Icon icons={icons} />}\n                <StyledComboBoxItemContent>\n                    <StyledComboBoxItemContentHeader>\n                        <StyledComboBoxItemContentHeaderText\n                            as={textStyles?.tagName}\n                            style={textStyles?.styles}\n                        >\n                            {text}\n                            {suffixElement}\n                        </StyledComboBoxItemContentHeaderText>\n                        {rightElement && (\n                            <StyledComboBoxItemContentHeaderRightElement>\n                                {rightElement}\n                            </StyledComboBoxItemContentHeaderRightElement>\n                        )}\n                    </StyledComboBoxItemContentHeader>\n                    {subtext && (\n                        <StyledComboBoxItemContentSubtext>\n                            {subtext}\n                        </StyledComboBoxItemContentSubtext>\n                    )}\n                </StyledComboBoxItemContent>\n            </StyledComboBoxItem>\n        ),\n        [\n            handleItemClick,\n            icons,\n            id,\n            imageUrl,\n            isDisabled,\n            isSelected,\n            isTouch,\n            rightElement,\n            shouldShowBigImage,\n            shouldShowRoundImage,\n            subtext,\n            suffixElement,\n            text,\n        ],\n    );\n};\n\nComboBoxItem.displayName = 'ComboBoxItem';\n\nexport default ComboBoxItem;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAmBC,WAAW,EAAEC,OAAO,QAAQ,OAAO;AAClE,SAASC,UAAU,QAAQ,4BAA4B;AACvD,OAAOC,IAAI,MAAM,iBAAiB;AAElC,SACIC,kBAAkB,EAClBC,yBAAyB,EACzBC,+BAA+B,EAC/BC,2CAA2C,EAC3CC,mCAAmC,EACnCC,gCAAgC,EAChCC,uBAAuB,QACpB,uBAAuB;AAmB9B,MAAMC,YAAmC,GAAGC,IAAA,IAetC;EAAA,IAfuC;IACzCC,KAAK;IACLC,EAAE;IACFC,QAAQ;IACRC,UAAU;IACVC,UAAU;IACVC,QAAQ;IACRC,YAAY;IACZC,kBAAkB;IAClBC,oBAAoB;IACpBC,OAAO;IACPC,aAAa;IACbC,UAAU;IACVC,IAAI;IACJC;EACJ,CAAC,GAAAd,IAAA;EACG,MAAMe,eAAe,GAAG3B,WAAW,CAAC,MAAM;IACtC,IAAI,CAACgB,UAAU,EAAE;MACbE,QAAQ,CAAC;QAAEO,IAAI;QAAEC,KAAK;QAAEH,aAAa;QAAER;MAAS,CAAC,CAAC;IACtD;EACJ,CAAC,EAAE,CAACA,QAAQ,EAAEC,UAAU,EAAEE,QAAQ,EAAEK,aAAa,EAAEE,IAAI,EAAEC,KAAK,CAAC,CAAC;EAEhE,MAAME,OAAO,GAAG1B,UAAU,CAAC,CAAC;EAE5B,OAAOD,OAAO,CACV,mBACIF,KAAA,CAAA8B,aAAA,CAACzB,kBAAkB;IACfU,EAAE,EAAE,kBAAkB,OAAOA,EAAE,KAAK,QAAQ,GAAGgB,MAAM,CAAChB,EAAE,CAAC,GAAGA,EAAE,EAAG;IACjEiB,OAAO,EAAEJ,eAAgB;IACzBK,WAAW,EAAEhB,UAAW;IACxBiB,WAAW,EAAEhB,UAAW;IACxBiB,QAAQ,EAAEN;EAAQ,GAEjBb,QAAQ,iBACLhB,KAAA,CAAA8B,aAAA,CAACnB,uBAAuB;IACpByB,GAAG,EAAEpB,QAAS;IACdqB,mBAAmB,EACfhB,kBAAkB,IACjB,OAAOE,OAAO,KAAK,QAAQ,IAAIA,OAAO,CAACe,IAAI,CAAC,CAAC,KAAK,EACtD;IACDC,qBAAqB,EAAEjB;EAAqB,CAC/C,CACJ,EACAR,KAAK,iBAAId,KAAA,CAAA8B,aAAA,CAAC1B,IAAI;IAACU,KAAK,EAAEA;EAAM,CAAE,CAAC,eAChCd,KAAA,CAAA8B,aAAA,CAACxB,yBAAyB,qBACtBN,KAAA,CAAA8B,aAAA,CAACvB,+BAA+B,qBAC5BP,KAAA,CAAA8B,aAAA,CAACrB,mCAAmC;IAChC+B,EAAE,EAAEf,UAAU,EAAEgB,OAAQ;IACxBC,KAAK,EAAEjB,UAAU,EAAEkB;EAAO,GAEzBjB,IAAI,EACJF,aACgC,CAAC,EACrCJ,YAAY,iBACTpB,KAAA,CAAA8B,aAAA,CAACtB,2CAA2C,QACvCY,YACwC,CAEpB,CAAC,EACjCG,OAAO,iBACJvB,KAAA,CAAA8B,aAAA,CAACpB,gCAAgC,QAC5Ba,OAC6B,CAEf,CACX,CACvB,EACD,CACIK,eAAe,EACfd,KAAK,EACLC,EAAE,EACFC,QAAQ,EACRC,UAAU,EACVC,UAAU,EACVW,OAAO,EACPT,YAAY,EACZC,kBAAkB,EAClBC,oBAAoB,EACpBC,OAAO,EACPC,aAAa,EACbE,IAAI,CAEZ,CAAC;AACL,CAAC;AAEDd,YAAY,CAACgC,WAAW,GAAG,cAAc;AAEzC,eAAehC,YAAY","ignoreList":[]}
+{"version":3,"file":"ComboBoxItem.js","names":["React","useCallback","useMemo","getIsTouch","Icon","StyledComboBoxItem","StyledComboBoxItemContent","StyledComboBoxItemContentHeader","StyledComboBoxItemContentHeaderRightElement","StyledComboBoxItemContentHeaderText","StyledComboBoxItemContentSubtext","StyledComboBoxItemImage","ComboBoxItem","_ref","icons","id","imageUrl","isDisabled","isSelected","onSelect","rightElement","shouldShowBigImage","shouldShowRoundImage","subtext","suffixElement","textStyles","text","value","handleItemClick","isTouch","createElement","String","onClick","$isDisabled","$isSelected","$isTouch","src","$shouldShowBigImage","trim","$shouldShowRoundImage","as","tagName","style","styles","displayName"],"sources":["../../../../../src/components/combobox/combobox-item/ComboBoxItem.tsx"],"sourcesContent":["import React, { FC, ReactNode, useCallback, useMemo } from 'react';\nimport { getIsTouch } from '../../../utils/environment';\nimport Icon from '../../icon/Icon';\nimport type { ComboBoxProps, IComboBoxItem } from '../ComboBox';\nimport {\n    StyledComboBoxItem,\n    StyledComboBoxItemContent,\n    StyledComboBoxItemContentHeader,\n    StyledComboBoxItemContentHeaderRightElement,\n    StyledComboBoxItemContentHeaderText,\n    StyledComboBoxItemContentSubtext,\n    StyledComboBoxItemImage,\n} from './ComboBoxItem.styles';\n\nexport type ComboBoxItemProps = {\n    icons?: IComboBoxItem['icons'];\n    id: IComboBoxItem['value'];\n    imageUrl: IComboBoxItem['imageUrl'];\n    isDisabled?: IComboBoxItem['isDisabled'];\n    isSelected: boolean;\n    onSelect: (itemToSelect: IComboBoxItem) => void;\n    rightElement: IComboBoxItem['rightElement'];\n    shouldShowBigImage: ComboBoxProps['shouldShowBigImage'];\n    shouldShowRoundImage: ComboBoxProps['shouldShowRoundImage'];\n    subtext: IComboBoxItem['subtext'];\n    suffixElement?: ReactNode;\n    text: IComboBoxItem['text'];\n    value: IComboBoxItem['value'];\n    textStyles?: IComboBoxItem['textStyles'];\n};\n\nconst ComboBoxItem: FC<ComboBoxItemProps> = ({\n    icons,\n    id,\n    imageUrl,\n    isDisabled,\n    isSelected,\n    onSelect,\n    rightElement,\n    shouldShowBigImage,\n    shouldShowRoundImage,\n    subtext,\n    suffixElement,\n    textStyles,\n    text,\n    value,\n}) => {\n    const handleItemClick = useCallback(() => {\n        if (!isDisabled) {\n            onSelect({ text, value, suffixElement, imageUrl, icons });\n        }\n    }, [icons, imageUrl, isDisabled, onSelect, suffixElement, text, value]);\n\n    const isTouch = getIsTouch();\n\n    return useMemo(\n        () => (\n            <StyledComboBoxItem\n                id={`combobox-item__${typeof id === 'number' ? String(id) : id}`}\n                onClick={handleItemClick}\n                $isDisabled={isDisabled}\n                $isSelected={isSelected}\n                $isTouch={isTouch}\n            >\n                {imageUrl && (\n                    <StyledComboBoxItemImage\n                        src={imageUrl}\n                        $shouldShowBigImage={\n                            shouldShowBigImage ||\n                            (typeof subtext === 'string' && subtext.trim() !== '')\n                        }\n                        $shouldShowRoundImage={shouldShowRoundImage}\n                    />\n                )}\n                {icons && <Icon icons={icons} />}\n                <StyledComboBoxItemContent>\n                    <StyledComboBoxItemContentHeader>\n                        <StyledComboBoxItemContentHeaderText\n                            as={textStyles?.tagName}\n                            style={textStyles?.styles}\n                        >\n                            {text}\n                            {suffixElement}\n                        </StyledComboBoxItemContentHeaderText>\n                        {rightElement && (\n                            <StyledComboBoxItemContentHeaderRightElement>\n                                {rightElement}\n                            </StyledComboBoxItemContentHeaderRightElement>\n                        )}\n                    </StyledComboBoxItemContentHeader>\n                    {subtext && (\n                        <StyledComboBoxItemContentSubtext>\n                            {subtext}\n                        </StyledComboBoxItemContentSubtext>\n                    )}\n                </StyledComboBoxItemContent>\n            </StyledComboBoxItem>\n        ),\n        [\n            handleItemClick,\n            icons,\n            id,\n            imageUrl,\n            isDisabled,\n            isSelected,\n            isTouch,\n            rightElement,\n            shouldShowBigImage,\n            shouldShowRoundImage,\n            subtext,\n            suffixElement,\n            text,\n        ],\n    );\n};\n\nComboBoxItem.displayName = 'ComboBoxItem';\n\nexport default ComboBoxItem;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAmBC,WAAW,EAAEC,OAAO,QAAQ,OAAO;AAClE,SAASC,UAAU,QAAQ,4BAA4B;AACvD,OAAOC,IAAI,MAAM,iBAAiB;AAElC,SACIC,kBAAkB,EAClBC,yBAAyB,EACzBC,+BAA+B,EAC/BC,2CAA2C,EAC3CC,mCAAmC,EACnCC,gCAAgC,EAChCC,uBAAuB,QACpB,uBAAuB;AAmB9B,MAAMC,YAAmC,GAAGC,IAAA,IAetC;EAAA,IAfuC;IACzCC,KAAK;IACLC,EAAE;IACFC,QAAQ;IACRC,UAAU;IACVC,UAAU;IACVC,QAAQ;IACRC,YAAY;IACZC,kBAAkB;IAClBC,oBAAoB;IACpBC,OAAO;IACPC,aAAa;IACbC,UAAU;IACVC,IAAI;IACJC;EACJ,CAAC,GAAAd,IAAA;EACG,MAAMe,eAAe,GAAG3B,WAAW,CAAC,MAAM;IACtC,IAAI,CAACgB,UAAU,EAAE;MACbE,QAAQ,CAAC;QAAEO,IAAI;QAAEC,KAAK;QAAEH,aAAa;QAAER,QAAQ;QAAEF;MAAM,CAAC,CAAC;IAC7D;EACJ,CAAC,EAAE,CAACA,KAAK,EAAEE,QAAQ,EAAEC,UAAU,EAAEE,QAAQ,EAAEK,aAAa,EAAEE,IAAI,EAAEC,KAAK,CAAC,CAAC;EAEvE,MAAME,OAAO,GAAG1B,UAAU,CAAC,CAAC;EAE5B,OAAOD,OAAO,CACV,mBACIF,KAAA,CAAA8B,aAAA,CAACzB,kBAAkB;IACfU,EAAE,EAAE,kBAAkB,OAAOA,EAAE,KAAK,QAAQ,GAAGgB,MAAM,CAAChB,EAAE,CAAC,GAAGA,EAAE,EAAG;IACjEiB,OAAO,EAAEJ,eAAgB;IACzBK,WAAW,EAAEhB,UAAW;IACxBiB,WAAW,EAAEhB,UAAW;IACxBiB,QAAQ,EAAEN;EAAQ,GAEjBb,QAAQ,iBACLhB,KAAA,CAAA8B,aAAA,CAACnB,uBAAuB;IACpByB,GAAG,EAAEpB,QAAS;IACdqB,mBAAmB,EACfhB,kBAAkB,IACjB,OAAOE,OAAO,KAAK,QAAQ,IAAIA,OAAO,CAACe,IAAI,CAAC,CAAC,KAAK,EACtD;IACDC,qBAAqB,EAAEjB;EAAqB,CAC/C,CACJ,EACAR,KAAK,iBAAId,KAAA,CAAA8B,aAAA,CAAC1B,IAAI;IAACU,KAAK,EAAEA;EAAM,CAAE,CAAC,eAChCd,KAAA,CAAA8B,aAAA,CAACxB,yBAAyB,qBACtBN,KAAA,CAAA8B,aAAA,CAACvB,+BAA+B,qBAC5BP,KAAA,CAAA8B,aAAA,CAACrB,mCAAmC;IAChC+B,EAAE,EAAEf,UAAU,EAAEgB,OAAQ;IACxBC,KAAK,EAAEjB,UAAU,EAAEkB;EAAO,GAEzBjB,IAAI,EACJF,aACgC,CAAC,EACrCJ,YAAY,iBACTpB,KAAA,CAAA8B,aAAA,CAACtB,2CAA2C,QACvCY,YACwC,CAEpB,CAAC,EACjCG,OAAO,iBACJvB,KAAA,CAAA8B,aAAA,CAACpB,gCAAgC,QAC5Ba,OAC6B,CAEf,CACX,CACvB,EACD,CACIK,eAAe,EACfd,KAAK,EACLC,EAAE,EACFC,QAAQ,EACRC,UAAU,EACVC,UAAU,EACVW,OAAO,EACPT,YAAY,EACZC,kBAAkB,EAClBC,oBAAoB,EACpBC,OAAO,EACPC,aAAa,EACbE,IAAI,CAEZ,CAAC;AACL,CAAC;AAEDd,YAAY,CAACgC,WAAW,GAAG,cAAc;AAEzC,eAAehC,YAAY","ignoreList":[]}

package/lib/esm/components/tooltip/Tooltip.js

@@ -33,7 +33,7 @@ const Tooltip = _ref => {
     content: content,
     ref: tooltipRef,
     container: container,
-    shouldUseChildrenWidth: false
+    shouldUseChildrenWidth: shouldUseChildrenWidth
   }, /*#__PURE__*/React.createElement(StyledTooltipChildren, {
     $isOnlyText: isTextOnlyElement(children),
     $shouldUseChildrenWidth: shouldUseChildrenWidth

package/lib/esm/components/tooltip/Tooltip.js.map

@@ -1 +1 @@
-{"version":3,"file":"Tooltip.js","names":["React","isValidElement","useMemo","useRef","isTextOnlyElement","Popup","TooltipItem","StyledTooltip","StyledTooltipChildren","Tooltip","_ref","item","children","container","isDisabled","itemWidth","shouldUseChildrenWidth","tooltipRef","content","createElement","width","text","headline","imageUrl","button","$isOnlyText","$shouldUseChildrenWidth","shouldShowOnHover","ref","displayName"],"sources":["../../../../src/components/tooltip/Tooltip.tsx"],"sourcesContent":["import React, { FC, isValidElement, ReactNode, useMemo, useRef, type CSSProperties } from 'react';\nimport type { PopupRef } from '../../types/popup';\nimport type { ITooltipItem } from '../../types/tooltip';\nimport { isTextOnlyElement } from '../../utils/tooltip';\nimport Popup from '../popup/Popup';\nimport TooltipItem from './tooltip-item/TooltipItem';\nimport { StyledTooltip, StyledTooltipChildren } from './Tooltip.styles';\n\nexport type TooltipProps = {\n    /**\n     * The elements that the tooltip should surround.\n     */\n    children: ReactNode;\n    /**\n     * The element where the content of the `Tooltip` should be rendered via React Portal.\n     */\n    container?: Element;\n    /**\n     * The content that should be displayed.\n     */\n    item: ITooltipItem | ReactNode;\n    /**\n     * The width of an item.\n     */\n    itemWidth?: CSSProperties['width'];\n    /**\n     * whether the tooltip should be shown.\n     */\n    isDisabled?: boolean;\n    /**\n     * Whether the width of the children should be used.\n     */\n    shouldUseChildrenWidth?: boolean;\n};\n\nconst Tooltip: FC<TooltipProps> = ({\n    item,\n    children,\n    container,\n    isDisabled,\n    itemWidth,\n    shouldUseChildrenWidth = true,\n}) => {\n    const tooltipRef = useRef<PopupRef>(null);\n\n    const content = useMemo(() => {\n        if (isValidElement(item)) {\n            return item;\n        }\n\n        return (\n            <TooltipItem\n                width={itemWidth}\n                text={(item as ITooltipItem).text}\n                headline={(item as ITooltipItem).headline}\n                imageUrl={(item as ITooltipItem).imageUrl}\n                button={(item as ITooltipItem).button}\n            />\n        );\n    }, [item, itemWidth]);\n\n    return useMemo(\n        () => (\n            <StyledTooltip>\n                {isDisabled ? (\n                    <StyledTooltipChildren\n                        $isOnlyText={isTextOnlyElement(children)}\n                        $shouldUseChildrenWidth={shouldUseChildrenWidth}\n                    >\n                        {children}\n                    </StyledTooltipChildren>\n                ) : (\n                    <Popup\n                        shouldShowOnHover\n                        content={content}\n                        ref={tooltipRef}\n                        container={container}\n                        shouldUseChildrenWidth={false}\n                    >\n                        <StyledTooltipChildren\n                            $isOnlyText={isTextOnlyElement(children)}\n                            $shouldUseChildrenWidth={shouldUseChildrenWidth}\n                        >\n                            {children}\n                        </StyledTooltipChildren>\n                    </Popup>\n                )}\n            </StyledTooltip>\n        ),\n        [isDisabled, children, shouldUseChildrenWidth, content, container],\n    );\n};\n\nTooltip.displayName = 'Tooltip';\n\nexport default Tooltip;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAQC,cAAc,EAAaC,OAAO,EAAEC,MAAM,QAA4B,OAAO;AAGjG,SAASC,iBAAiB,QAAQ,qBAAqB;AACvD,OAAOC,KAAK,MAAM,gBAAgB;AAClC,OAAOC,WAAW,MAAM,4BAA4B;AACpD,SAASC,aAAa,EAAEC,qBAAqB,QAAQ,kBAAkB;AA6BvE,MAAMC,OAAyB,GAAGC,IAAA,IAO5B;EAAA,IAP6B;IAC/BC,IAAI;IACJC,QAAQ;IACRC,SAAS;IACTC,UAAU;IACVC,SAAS;IACTC,sBAAsB,GAAG;EAC7B,CAAC,GAAAN,IAAA;EACG,MAAMO,UAAU,GAAGd,MAAM,CAAW,IAAI,CAAC;EAEzC,MAAMe,OAAO,GAAGhB,OAAO,CAAC,MAAM;IAC1B,iBAAID,cAAc,CAACU,IAAI,CAAC,EAAE;MACtB,OAAOA,IAAI;IACf;IAEA,oBACIX,KAAA,CAAAmB,aAAA,CAACb,WAAW;MACRc,KAAK,EAAEL,SAAU;MACjBM,IAAI,EAAGV,IAAI,CAAkBU,IAAK;MAClCC,QAAQ,EAAGX,IAAI,CAAkBW,QAAS;MAC1CC,QAAQ,EAAGZ,IAAI,CAAkBY,QAAS;MAC1CC,MAAM,EAAGb,IAAI,CAAkBa;IAAO,CACzC,CAAC;EAEV,CAAC,EAAE,CAACb,IAAI,EAAEI,SAAS,CAAC,CAAC;EAErB,OAAOb,OAAO,CACV,mBACIF,KAAA,CAAAmB,aAAA,CAACZ,aAAa,QACTO,UAAU,gBACPd,KAAA,CAAAmB,aAAA,CAACX,qBAAqB;IAClBiB,WAAW,EAAErB,iBAAiB,CAACQ,QAAQ,CAAE;IACzCc,uBAAuB,EAAEV;EAAuB,GAE/CJ,QACkB,CAAC,gBAExBZ,KAAA,CAAAmB,aAAA,CAACd,KAAK;IACFsB,iBAAiB;IACjBT,OAAO,EAAEA,OAAQ;IACjBU,GAAG,EAAEX,UAAW;IAChBJ,SAAS,EAAEA,SAAU;IACrBG,sBAAsB,EAAE;EAAM,gBAE9BhB,KAAA,CAAAmB,aAAA,CAACX,qBAAqB;IAClBiB,WAAW,EAAErB,iBAAiB,CAACQ,QAAQ,CAAE;IACzCc,uBAAuB,EAAEV;EAAuB,GAE/CJ,QACkB,CACpB,CAEA,CAClB,EACD,CAACE,UAAU,EAAEF,QAAQ,EAAEI,sBAAsB,EAAEE,OAAO,EAAEL,SAAS,CACrE,CAAC;AACL,CAAC;AAEDJ,OAAO,CAACoB,WAAW,GAAG,SAAS;AAE/B,eAAepB,OAAO","ignoreList":[]}
+{"version":3,"file":"Tooltip.js","names":["React","isValidElement","useMemo","useRef","isTextOnlyElement","Popup","TooltipItem","StyledTooltip","StyledTooltipChildren","Tooltip","_ref","item","children","container","isDisabled","itemWidth","shouldUseChildrenWidth","tooltipRef","content","createElement","width","text","headline","imageUrl","button","$isOnlyText","$shouldUseChildrenWidth","shouldShowOnHover","ref","displayName"],"sources":["../../../../src/components/tooltip/Tooltip.tsx"],"sourcesContent":["import React, { FC, isValidElement, ReactNode, useMemo, useRef, type CSSProperties } from 'react';\nimport type { PopupRef } from '../../types/popup';\nimport type { ITooltipItem } from '../../types/tooltip';\nimport { isTextOnlyElement } from '../../utils/tooltip';\nimport Popup from '../popup/Popup';\nimport TooltipItem from './tooltip-item/TooltipItem';\nimport { StyledTooltip, StyledTooltipChildren } from './Tooltip.styles';\n\nexport type TooltipProps = {\n    /**\n     * The elements that the tooltip should surround.\n     */\n    children: ReactNode;\n    /**\n     * The element where the content of the `Tooltip` should be rendered via React Portal.\n     */\n    container?: Element;\n    /**\n     * The content that should be displayed.\n     */\n    item: ITooltipItem | ReactNode;\n    /**\n     * The width of an item.\n     */\n    itemWidth?: CSSProperties['width'];\n    /**\n     * whether the tooltip should be shown.\n     */\n    isDisabled?: boolean;\n    /**\n     * Whether the width of the children should be used.\n     */\n    shouldUseChildrenWidth?: boolean;\n};\n\nconst Tooltip: FC<TooltipProps> = ({\n    item,\n    children,\n    container,\n    isDisabled,\n    itemWidth,\n    shouldUseChildrenWidth = true,\n}) => {\n    const tooltipRef = useRef<PopupRef>(null);\n\n    const content = useMemo(() => {\n        if (isValidElement(item)) {\n            return item;\n        }\n\n        return (\n            <TooltipItem\n                width={itemWidth}\n                text={(item as ITooltipItem).text}\n                headline={(item as ITooltipItem).headline}\n                imageUrl={(item as ITooltipItem).imageUrl}\n                button={(item as ITooltipItem).button}\n            />\n        );\n    }, [item, itemWidth]);\n\n    return useMemo(\n        () => (\n            <StyledTooltip>\n                {isDisabled ? (\n                    <StyledTooltipChildren\n                        $isOnlyText={isTextOnlyElement(children)}\n                        $shouldUseChildrenWidth={shouldUseChildrenWidth}\n                    >\n                        {children}\n                    </StyledTooltipChildren>\n                ) : (\n                    <Popup\n                        shouldShowOnHover\n                        content={content}\n                        ref={tooltipRef}\n                        container={container}\n                        shouldUseChildrenWidth={shouldUseChildrenWidth}\n                    >\n                        <StyledTooltipChildren\n                            $isOnlyText={isTextOnlyElement(children)}\n                            $shouldUseChildrenWidth={shouldUseChildrenWidth}\n                        >\n                            {children}\n                        </StyledTooltipChildren>\n                    </Popup>\n                )}\n            </StyledTooltip>\n        ),\n        [isDisabled, children, shouldUseChildrenWidth, content, container],\n    );\n};\n\nTooltip.displayName = 'Tooltip';\n\nexport default Tooltip;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAQC,cAAc,EAAaC,OAAO,EAAEC,MAAM,QAA4B,OAAO;AAGjG,SAASC,iBAAiB,QAAQ,qBAAqB;AACvD,OAAOC,KAAK,MAAM,gBAAgB;AAClC,OAAOC,WAAW,MAAM,4BAA4B;AACpD,SAASC,aAAa,EAAEC,qBAAqB,QAAQ,kBAAkB;AA6BvE,MAAMC,OAAyB,GAAGC,IAAA,IAO5B;EAAA,IAP6B;IAC/BC,IAAI;IACJC,QAAQ;IACRC,SAAS;IACTC,UAAU;IACVC,SAAS;IACTC,sBAAsB,GAAG;EAC7B,CAAC,GAAAN,IAAA;EACG,MAAMO,UAAU,GAAGd,MAAM,CAAW,IAAI,CAAC;EAEzC,MAAMe,OAAO,GAAGhB,OAAO,CAAC,MAAM;IAC1B,iBAAID,cAAc,CAACU,IAAI,CAAC,EAAE;MACtB,OAAOA,IAAI;IACf;IAEA,oBACIX,KAAA,CAAAmB,aAAA,CAACb,WAAW;MACRc,KAAK,EAAEL,SAAU;MACjBM,IAAI,EAAGV,IAAI,CAAkBU,IAAK;MAClCC,QAAQ,EAAGX,IAAI,CAAkBW,QAAS;MAC1CC,QAAQ,EAAGZ,IAAI,CAAkBY,QAAS;MAC1CC,MAAM,EAAGb,IAAI,CAAkBa;IAAO,CACzC,CAAC;EAEV,CAAC,EAAE,CAACb,IAAI,EAAEI,SAAS,CAAC,CAAC;EAErB,OAAOb,OAAO,CACV,mBACIF,KAAA,CAAAmB,aAAA,CAACZ,aAAa,QACTO,UAAU,gBACPd,KAAA,CAAAmB,aAAA,CAACX,qBAAqB;IAClBiB,WAAW,EAAErB,iBAAiB,CAACQ,QAAQ,CAAE;IACzCc,uBAAuB,EAAEV;EAAuB,GAE/CJ,QACkB,CAAC,gBAExBZ,KAAA,CAAAmB,aAAA,CAACd,KAAK;IACFsB,iBAAiB;IACjBT,OAAO,EAAEA,OAAQ;IACjBU,GAAG,EAAEX,UAAW;IAChBJ,SAAS,EAAEA,SAAU;IACrBG,sBAAsB,EAAEA;EAAuB,gBAE/ChB,KAAA,CAAAmB,aAAA,CAACX,qBAAqB;IAClBiB,WAAW,EAAErB,iBAAiB,CAACQ,QAAQ,CAAE;IACzCc,uBAAuB,EAAEV;EAAuB,GAE/CJ,QACkB,CACpB,CAEA,CAClB,EACD,CAACE,UAAU,EAAEF,QAAQ,EAAEI,sBAAsB,EAAEE,OAAO,EAAEL,SAAS,CACrE,CAAC;AACL,CAAC;AAEDJ,OAAO,CAACoB,WAAW,GAAG,SAAS;AAE/B,eAAepB,OAAO","ignoreList":[]}

package/lib/esm/utils/slider.js

@@ -39,7 +39,7 @@ export const calculateGradientOffset = _ref2 => {
   } = _ref2;
   const percentage = (value - min) / (max - min);
   const adjustedWidth = containerWidth - thumbWidth / 2;
-  return percentage * adjustedWidth + thumbWidth / 2;
+  return percentage * adjustedWidth + thumbWidth / 2 + 5;
 };
 export const calculatePopupPosition = _ref3 => {
   let {

package/lib/esm/utils/slider.js.map

@@ -1 +1 @@
-{"version":3,"file":"slider.js","names":["fillSlider","_ref","fromSlider","toSlider","theme","fromValue","toValue","rangeDistance","Number","max","min","fromPosition","value","toPosition","backgroundColor","trackColor","gradient","style","background","calculateGradientOffset","_ref2","thumbWidth","containerWidth","percentage","adjustedWidth","calculatePopupPosition","_ref3","sliderValue","popupWidth","leftAtMin","leftAtMax","getThumbMaxWidth","_ref4","maxNumber","thumbLabelFormatter","element","document","createElement","height","display","padding","whiteSpace","minWidth","opacity","position","textContent","String","body","appendChild","width","offsetWidth","removeChild"],"sources":["../../../src/utils/slider.ts"],"sourcesContent":["import type { Theme } from '../components/color-scheme-provider/ColorSchemeProvider';\n\nexport interface FillSlider {\n    fromSlider: HTMLInputElement;\n    toSlider: HTMLInputElement;\n    fromValue?: number;\n    toValue?: number;\n    theme: Theme;\n}\n\nexport const fillSlider = ({ fromSlider, toSlider, theme, fromValue, toValue }: FillSlider) => {\n    const rangeDistance = Number(toSlider.max) - Number(toSlider.min);\n    const fromPosition = Number(fromValue ?? fromSlider.value) - Number(toSlider.min);\n    const toPosition = Number(toValue ?? toSlider.value) - Number(toSlider.min);\n\n    const backgroundColor = theme['403'];\n    const trackColor = theme['409'];\n\n    if (!backgroundColor || !trackColor) {\n        return;\n    }\n\n    const gradient = `linear-gradient(\n      to right,\n      ${backgroundColor} 0%,\n      ${backgroundColor} ${(fromPosition / rangeDistance) * 100}%,\n      ${trackColor} ${(fromPosition / rangeDistance) * 100}%,\n      ${trackColor} ${(toPosition / rangeDistance) * 100}%,\n      ${backgroundColor} ${(toPosition / rangeDistance) * 100}%,\n      ${backgroundColor} 100%)`;\n\n    // Apply the gradient to the appropriate slider\n    // eslint-disable-next-line no-param-reassign\n    toSlider.style.background = gradient;\n    // eslint-disable-next-line no-param-reassign\n    fromSlider.style.background = gradient;\n};\n\ninterface CalculateGradientOffset {\n    value: number;\n    min: number;\n    max: number;\n    thumbWidth: number;\n    containerWidth: number;\n}\n\nexport const calculateGradientOffset = ({\n    value,\n    min,\n    max,\n    thumbWidth,\n    containerWidth,\n}: CalculateGradientOffset): number => {\n    const percentage = (value - min) / (max - min);\n\n    const adjustedWidth = containerWidth - thumbWidth / 2;\n\n    return percentage * adjustedWidth + thumbWidth / 2;\n};\n\ninterface GetThumbMaxWidthOptions {\n    maxNumber: number;\n    thumbLabelFormatter?: (value: number) => string;\n}\n\ninterface CalculatePopupPositionOptions {\n    sliderValue: number;\n    min: number;\n    max: number;\n    popupWidth: number;\n}\n\nexport const calculatePopupPosition = ({\n    sliderValue,\n    min,\n    max,\n    popupWidth,\n}: CalculatePopupPositionOptions) => {\n    // Berechnung des Prozentwerts des Sliders zwischen min und max\n    const percentage = (sliderValue - min) / (max - min);\n\n    // Berechnung des linken Versatzes bei 0% (-10px) und bei 100% (-popupWidth + 20px)\n    const leftAtMin = -10;\n    const leftAtMax = -popupWidth + 25;\n\n    // Berechnung des dynamischen Left-Werts basierend auf dem Slider-Prozentwert\n    return leftAtMin + percentage * (leftAtMax - leftAtMin);\n};\n\nexport const getThumbMaxWidth = ({ maxNumber, thumbLabelFormatter }: GetThumbMaxWidthOptions) => {\n    const element = document.createElement('span');\n\n    element.style.height = '20px';\n    element.style.display = 'flex';\n    element.style.padding = '16px';\n    element.style.whiteSpace = 'nowrap';\n    element.style.minWidth = '20px';\n    element.style.opacity = '0';\n    element.style.position = 'absolute';\n\n    element.textContent =\n        typeof thumbLabelFormatter === 'function'\n            ? thumbLabelFormatter(maxNumber)\n            : String(maxNumber);\n\n    document.body.appendChild(element);\n\n    const width = element.offsetWidth;\n\n    document.body.removeChild(element);\n\n    return width;\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"slider.js","names":["fillSlider","_ref","fromSlider","toSlider","theme","fromValue","toValue","rangeDistance","Number","max","min","fromPosition","value","toPosition","backgroundColor","trackColor","gradient","style","background","calculateGradientOffset","_ref2","thumbWidth","containerWidth","percentage","adjustedWidth","calculatePopupPosition","_ref3","sliderValue","popupWidth","leftAtMin","leftAtMax","getThumbMaxWidth","_ref4","maxNumber","thumbLabelFormatter","element","document","createElement","height","display","padding","whiteSpace","minWidth","opacity","position","textContent","String","body","appendChild","width","offsetWidth","removeChild"],"sources":["../../../src/utils/slider.ts"],"sourcesContent":["import type { Theme } from '../components/color-scheme-provider/ColorSchemeProvider';\n\nexport interface FillSlider {\n    fromSlider: HTMLInputElement;\n    toSlider: HTMLInputElement;\n    fromValue?: number;\n    toValue?: number;\n    theme: Theme;\n}\n\nexport const fillSlider = ({ fromSlider, toSlider, theme, fromValue, toValue }: FillSlider) => {\n    const rangeDistance = Number(toSlider.max) - Number(toSlider.min);\n    const fromPosition = Number(fromValue ?? fromSlider.value) - Number(toSlider.min);\n    const toPosition = Number(toValue ?? toSlider.value) - Number(toSlider.min);\n\n    const backgroundColor = theme['403'];\n    const trackColor = theme['409'];\n\n    if (!backgroundColor || !trackColor) {\n        return;\n    }\n\n    const gradient = `linear-gradient(\n      to right,\n      ${backgroundColor} 0%,\n      ${backgroundColor} ${(fromPosition / rangeDistance) * 100}%,\n      ${trackColor} ${(fromPosition / rangeDistance) * 100}%,\n      ${trackColor} ${(toPosition / rangeDistance) * 100}%,\n      ${backgroundColor} ${(toPosition / rangeDistance) * 100}%,\n      ${backgroundColor} 100%)`;\n\n    // Apply the gradient to the appropriate slider\n    // eslint-disable-next-line no-param-reassign\n    toSlider.style.background = gradient;\n    // eslint-disable-next-line no-param-reassign\n    fromSlider.style.background = gradient;\n};\n\ninterface CalculateGradientOffset {\n    value: number;\n    min: number;\n    max: number;\n    thumbWidth: number;\n    containerWidth: number;\n}\n\nexport const calculateGradientOffset = ({\n    value,\n    min,\n    max,\n    thumbWidth,\n    containerWidth,\n}: CalculateGradientOffset): number => {\n    const percentage = (value - min) / (max - min);\n\n    const adjustedWidth = containerWidth - thumbWidth / 2;\n\n    return percentage * adjustedWidth + thumbWidth / 2 + 5;\n};\n\ninterface GetThumbMaxWidthOptions {\n    maxNumber: number;\n    thumbLabelFormatter?: (value: number) => string;\n}\n\ninterface CalculatePopupPositionOptions {\n    sliderValue: number;\n    min: number;\n    max: number;\n    popupWidth: number;\n}\n\nexport const calculatePopupPosition = ({\n    sliderValue,\n    min,\n    max,\n    popupWidth,\n}: CalculatePopupPositionOptions) => {\n    // Berechnung des Prozentwerts des Sliders zwischen min und max\n    const percentage = (sliderValue - min) / (max - min);\n\n    // Berechnung des linken Versatzes bei 0% (-10px) und bei 100% (-popupWidth + 20px)\n    const leftAtMin = -10;\n    const leftAtMax = -popupWidth + 25;\n\n    // Berechnung des dynamischen Left-Werts basierend auf dem Slider-Prozentwert\n    return leftAtMin + percentage * (leftAtMax - leftAtMin);\n};\n\nexport const getThumbMaxWidth = ({ maxNumber, thumbLabelFormatter }: GetThumbMaxWidthOptions) => {\n    const element = document.createElement('span');\n\n    element.style.height = '20px';\n    element.style.display = 'flex';\n    element.style.padding = '16px';\n    element.style.whiteSpace = 'nowrap';\n    element.style.minWidth = '20px';\n    element.style.opacity = '0';\n    element.style.position = 'absolute';\n\n    element.textContent =\n        typeof thumbLabelFormatter === 'function'\n            ? thumbLabelFormatter(maxNumber)\n            : String(maxNumber);\n\n    document.body.appendChild(element);\n\n    const width = element.offsetWidth;\n\n    document.body.removeChild(element);\n\n    return width;\n};\n"],"mappings":"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","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@chayns-components/core",
-    "version": "5.0.0-beta.912",
+    "version": "5.0.0-beta.914",
     "description": "A set of beautiful React components for developing your own applications with chayns.",
     "sideEffects": false,
     "browserslist": [
@@ -87,5 +87,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "355b8f94975f612c923b0080b487ddf7b865e8e5"
+    "gitHead": "88788108773668405c628e5367ff97778ff93da8"
 }