@chayns-components/core 5.4.16 → 5.4.18

package/lib/cjs/components/combobox/ComboBox.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboBox.types.js","names":["ComboBoxSize","exports"],"sources":["../../../../src/components/combobox/ComboBox.types.ts"],"sourcesContent":["import { ChangeEventHandler, CSSProperties, FocusEventHandler, ReactHTML, ReactNode } from 'react';\nimport { CSSPropertiesWithVars } from 'styled-components/dist/types';\nimport { DropdownDirection } from '../../types/dropdown';\n\n/**\n * Ref interface for the `ComboBox` component.\n */\nexport interface ComboBoxRef {\n    /**\n     * Hides the dropdown content.\n     */\n    hide: VoidFunction;\n    /**\n     * Shows the dropdown content.\n     */\n    show: VoidFunction;\n}\n\n/**\n * A grouped list definition used by the `ComboBox` component.\n */\nexport interface IComboBoxItems {\n    /**\n     * Optional group label shown above the list.\n     */\n    groupName?: string;\n    /**\n     * The items that should be rendered inside the group.\n     */\n    list: Array<IComboBoxItem>;\n    /**\n     * Whether the items in this group should use round images.\n     */\n    shouldShowRoundImage?: boolean;\n}\n\n/**\n * Optional text styling configuration for a combobox item.\n */\nexport interface ComboBoxTextStyles {\n    /**\n     * The HTML tag that should be used for the text wrapper.\n     */\n    tagName?: keyof ReactHTML;\n    /**\n     * Additional inline styles applied to the text wrapper.\n     */\n    styles?: CSSPropertiesWithVars;\n    /**\n     * Additional class name applied to the text wrapper.\n     */\n    className?: string;\n}\n\n/**\n * Single selectable item configuration for the `ComboBox` component.\n */\nexport interface IComboBoxItem {\n    /**\n     * Optional icon classes rendered before the text.\n     */\n    icons?: string[];\n    /**\n     * Optional background style used for the image placeholder.\n     */\n    imageBackground?: CSSProperties['background'];\n    /**\n     * Optional image URL rendered for the item.\n     */\n    imageUrl?: string;\n    /**\n     * Whether the item should be disabled.\n     */\n    isDisabled?: boolean;\n    /**\n     * Optional element rendered on the right side of the item.\n     */\n    rightElement?: ReactNode;\n    /**\n     * Optional secondary text rendered below the main text.\n     */\n    subtext?: string;\n    /**\n     * Optional suffix element rendered after the text.\n     */\n    suffixElement?: ReactNode;\n    /**\n     * Main label of the item.\n     */\n    text: string;\n    /**\n     * Stable item value used for selection and matching.\n     */\n    value: string | number;\n    /**\n     * Optional text styling overrides for the item label.\n     */\n    textStyles?: ComboBoxTextStyles;\n}\n\n/**\n * Available size variants for the `ComboBox` header.\n */\nexport enum ComboBoxSize {\n    /**\n     * Standard height and spacing.\n     */\n    NORMAL = 'normal',\n    /**\n     * Compact height and spacing.\n     */\n    SMALL = 'small',\n}\n\n/**\n * Props for the `ComboBox` component.\n */\nexport type ComboBoxProps = {\n    /**\n     * The width of the body.\n     * @default undefined\n     */\n    bodyWidth?: number;\n    /**\n     * The element where the content of the `ComboBox` should be rendered via React Portal.\n     * @default undefined\n     */\n    container?: Element;\n    /**\n     * The direction in which the combobox should open.\n     * @default DropdownDirection.RIGHT\n     */\n    direction?: DropdownDirection;\n    /**\n     * The value of the optional input.\n     * @default undefined\n     */\n    inputValue?: string;\n    /**\n     * Whether the combobox should be disabled.\n     * @default false\n     */\n    isDisabled?: boolean;\n    /**\n     * The list of the items that should be displayed.\n     */\n    lists: IComboBoxItems[];\n    /**\n     * The maximum height of the combobox content.\n     * @default 280\n     */\n    maxHeight?: number;\n    /**\n     * Function to be executed when the value of the optional input is changed.\n     * @default undefined\n     */\n    onInputChange?: ChangeEventHandler<HTMLInputElement>;\n    /**\n     * Function to be executed when the optional input lost its focus.\n     * @default undefined\n     */\n    onInputBlur?: FocusEventHandler<HTMLInputElement>;\n    /**\n     * Function to be executed when the optional input gets its focus.\n     * @default undefined\n     */\n    onInputFocus?: FocusEventHandler<HTMLInputElement>;\n    /**\n     * Function that should be executed when an item is selected. If the function returns false, the item will not be selected.\n     * @default undefined\n     */\n    onSelect?: (comboboxItem?: IComboBoxItem) => Promise<boolean> | boolean | void;\n    /**\n     * Function to be executed when the content of the `ComboBox` is shown.\n     * @default undefined\n     */\n    onShow?: () => void;\n    /**\n     * Function to be executed when the content of the `ComboBox` is hidden.\n     * @default undefined\n     */\n    onHide?: () => void;\n    /**\n     * A text that should be displayed when no item is selected.\n     */\n    placeholder: string;\n    /**\n     * A prefix that should be displayed before the placeholder.\n     * @default undefined\n     */\n    prefix?: string;\n    /**\n     * An item that should be preselected.\n     * @default undefined\n     */\n    selectedItem?: IComboBoxItem;\n    /**\n     * If true, the images of the items are displayed in a bigger shape. This prop will automatically be set to true if the subtext of an item is given.\n     * @default false\n     */\n    shouldShowBigImage?: boolean;\n    /**\n     * If true, a clear icon is displayed at the end of the combo box if an item is selected.\n     * @default false\n     */\n    shouldShowClearIcon?: boolean;\n    /**\n     * Whether the background should be transparent.\n     * @default false\n     */\n    shouldShowTransparentBackground?: boolean;\n    /**\n     * If true, the images of the items are displayed in a round shape.\n     * @default false\n     */\n    shouldShowRoundImage?: boolean;\n    /**\n     * Whether the width of the ComboBox should be the width of the current item.\n     * @default false\n     */\n    shouldUseCurrentItemWidth?: boolean;\n    /**\n     * Whether the width of the 'ComboBox' should be the width of the parent or of the widest item.\n     * @default false\n     */\n    shouldUseFullWidth?: boolean;\n    /**\n     * If true, the dropdown will use the maximum width of the items.\n     * @default false\n     */\n    shouldDropDownUseMaxItemWidth?: boolean;\n    /**\n     * Whether the outside events should be captured.\n     * @default undefined\n     */\n    shouldCaptureEvents?: boolean;\n    /**\n     * The size of the ComboBox.\n     * @default ComboBoxSize.NORMAL\n     */\n    size?: ComboBoxSize;\n    /**\n     * Optional min width for the prefix element.\n     * @default undefined\n     */\n    prefixMinWidth?: number;\n};\n"],"mappings":";;;;;;AAIA;AACA;AACA;AAYA;AACA;AACA;AAgBA;AACA;AACA;AAgBA;AACA;AACA;AA4CA;AACA;AACA;AAFA,IAGYA,YAAY,GAAAC,OAAA,CAAAD,YAAA,0BAAZA,YAAY;EACpB;AACJ;AACA;EAHYA,YAAY;EAKpB;AACJ;AACA;EAPYA,YAAY;EAAA,OAAZA,YAAY;AAAA;AAWxB;AACA;AACA","ignoreList":[]}
+{"version":3,"file":"ComboBox.types.js","names":["ComboBoxSize","exports"],"sources":["../../../../src/components/combobox/ComboBox.types.ts"],"sourcesContent":["import { ChangeEventHandler, CSSProperties, FocusEventHandler, ReactNode, type JSX } from 'react';\nimport { CSSPropertiesWithVars } from 'styled-components/dist/types';\nimport { DropdownDirection } from '../../types/dropdown';\n\n/**\n * Ref interface for the `ComboBox` component.\n */\nexport interface ComboBoxRef {\n    /**\n     * Hides the dropdown content.\n     */\n    hide: VoidFunction;\n    /**\n     * Shows the dropdown content.\n     */\n    show: VoidFunction;\n}\n\n/**\n * A grouped list definition used by the `ComboBox` component.\n */\nexport interface IComboBoxItems {\n    /**\n     * Optional group label shown above the list.\n     */\n    groupName?: string;\n    /**\n     * The items that should be rendered inside the group.\n     */\n    list: Array<IComboBoxItem>;\n    /**\n     * Whether the items in this group should use round images.\n     */\n    shouldShowRoundImage?: boolean;\n}\n\n/**\n * Optional text styling configuration for a combobox item.\n */\nexport interface ComboBoxTextStyles {\n    /**\n     * The HTML tag that should be used for the text wrapper.\n     */\n    tagName?: keyof JSX.IntrinsicElements;\n    /**\n     * Additional inline styles applied to the text wrapper.\n     */\n    styles?: CSSPropertiesWithVars;\n    /**\n     * Additional class name applied to the text wrapper.\n     */\n    className?: string;\n}\n\n/**\n * Single selectable item configuration for the `ComboBox` component.\n */\nexport interface IComboBoxItem {\n    /**\n     * Optional icon classes rendered before the text.\n     */\n    icons?: string[];\n    /**\n     * Optional background style used for the image placeholder.\n     */\n    imageBackground?: CSSProperties['background'];\n    /**\n     * Optional image URL rendered for the item.\n     */\n    imageUrl?: string;\n    /**\n     * Whether the item should be disabled.\n     */\n    isDisabled?: boolean;\n    /**\n     * Optional element rendered on the right side of the item.\n     */\n    rightElement?: ReactNode;\n    /**\n     * Optional secondary text rendered below the main text.\n     */\n    subtext?: string;\n    /**\n     * Optional suffix element rendered after the text.\n     */\n    suffixElement?: ReactNode;\n    /**\n     * Main label of the item.\n     */\n    text: string;\n    /**\n     * Stable item value used for selection and matching.\n     */\n    value: string | number;\n    /**\n     * Optional text styling overrides for the item label.\n     */\n    textStyles?: ComboBoxTextStyles;\n}\n\n/**\n * Available size variants for the `ComboBox` header.\n */\nexport enum ComboBoxSize {\n    /**\n     * Standard height and spacing.\n     */\n    NORMAL = 'normal',\n    /**\n     * Compact height and spacing.\n     */\n    SMALL = 'small',\n}\n\n/**\n * Props for the `ComboBox` component.\n */\nexport type ComboBoxProps = {\n    /**\n     * The width of the body.\n     * @default undefined\n     */\n    bodyWidth?: number;\n    /**\n     * The element where the content of the `ComboBox` should be rendered via React Portal.\n     * @default undefined\n     */\n    container?: Element;\n    /**\n     * The direction in which the combobox should open.\n     * @default DropdownDirection.RIGHT\n     */\n    direction?: DropdownDirection;\n    /**\n     * The value of the optional input.\n     * @default undefined\n     */\n    inputValue?: string;\n    /**\n     * Whether the combobox should be disabled.\n     * @default false\n     */\n    isDisabled?: boolean;\n    /**\n     * The list of the items that should be displayed.\n     */\n    lists: IComboBoxItems[];\n    /**\n     * The maximum height of the combobox content.\n     * @default 280\n     */\n    maxHeight?: number;\n    /**\n     * Function to be executed when the value of the optional input is changed.\n     * @default undefined\n     */\n    onInputChange?: ChangeEventHandler<HTMLInputElement>;\n    /**\n     * Function to be executed when the optional input lost its focus.\n     * @default undefined\n     */\n    onInputBlur?: FocusEventHandler<HTMLInputElement>;\n    /**\n     * Function to be executed when the optional input gets its focus.\n     * @default undefined\n     */\n    onInputFocus?: FocusEventHandler<HTMLInputElement>;\n    /**\n     * Function that should be executed when an item is selected. If the function returns false, the item will not be selected.\n     * @default undefined\n     */\n    onSelect?: (comboboxItem?: IComboBoxItem) => Promise<boolean> | boolean | void;\n    /**\n     * Function to be executed when the content of the `ComboBox` is shown.\n     * @default undefined\n     */\n    onShow?: () => void;\n    /**\n     * Function to be executed when the content of the `ComboBox` is hidden.\n     * @default undefined\n     */\n    onHide?: () => void;\n    /**\n     * A text that should be displayed when no item is selected.\n     */\n    placeholder: string;\n    /**\n     * A prefix that should be displayed before the placeholder.\n     * @default undefined\n     */\n    prefix?: string;\n    /**\n     * An item that should be preselected.\n     * @default undefined\n     */\n    selectedItem?: IComboBoxItem;\n    /**\n     * If true, the images of the items are displayed in a bigger shape. This prop will automatically be set to true if the subtext of an item is given.\n     * @default false\n     */\n    shouldShowBigImage?: boolean;\n    /**\n     * If true, a clear icon is displayed at the end of the combo box if an item is selected.\n     * @default false\n     */\n    shouldShowClearIcon?: boolean;\n    /**\n     * Whether the background should be transparent.\n     * @default false\n     */\n    shouldShowTransparentBackground?: boolean;\n    /**\n     * If true, the images of the items are displayed in a round shape.\n     * @default false\n     */\n    shouldShowRoundImage?: boolean;\n    /**\n     * Whether the width of the ComboBox should be the width of the current item.\n     * @default false\n     */\n    shouldUseCurrentItemWidth?: boolean;\n    /**\n     * Whether the width of the 'ComboBox' should be the width of the parent or of the widest item.\n     * @default false\n     */\n    shouldUseFullWidth?: boolean;\n    /**\n     * If true, the dropdown will use the maximum width of the items.\n     * @default false\n     */\n    shouldDropDownUseMaxItemWidth?: boolean;\n    /**\n     * Whether the outside events should be captured.\n     * @default undefined\n     */\n    shouldCaptureEvents?: boolean;\n    /**\n     * The size of the ComboBox.\n     * @default ComboBoxSize.NORMAL\n     */\n    size?: ComboBoxSize;\n    /**\n     * Optional min width for the prefix element.\n     * @default undefined\n     */\n    prefixMinWidth?: number;\n};\n"],"mappings":";;;;;;AAIA;AACA;AACA;AAYA;AACA;AACA;AAgBA;AACA;AACA;AAgBA;AACA;AACA;AA4CA;AACA;AACA;AAFA,IAGYA,YAAY,GAAAC,OAAA,CAAAD,YAAA,0BAAZA,YAAY;EACpB;AACJ;AACA;EAHYA,YAAY;EAKpB;AACJ;AACA;EAPYA,YAAY;EAAA,OAAZA,YAAY;AAAA;AAWxB;AACA;AACA","ignoreList":[]}

package/lib/cjs/components/grouped-image/GroupedImage.js

@@ -11,7 +11,7 @@ var _uuid = require("../../hooks/uuid");
 var _SecondImageClipPath = _interopRequireDefault(require("./clip-paths/SecondImageClipPath"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const GROUPED_IMAGE_SERVICE_ORIGIN = 'https://tsimg.cloud';
-const IMAGE_SERVICE_PARAM_PATTERN = /^(?:m(?:scale|crop|shortedgescale)|[whsbd]\d+)$/i;
+const IMAGE_SERVICE_PARAM_PATTERN = /^(?:[whsbd]\d+|f(?:webp|avif|json|none)|c(?:c|f)|m(?:cr|sd|ct|pd|cv))$/i;
 const getGroupedImageDisplayUrl = (url, size) => {
   try {
     const urlObject = new URL(url);
@@ -26,11 +26,17 @@ const getGroupedImageDisplayUrl = (url, size) => {
     const extensionIndex = fileName.lastIndexOf('.');
     const extension = extensionIndex > -1 ? fileName.slice(extensionIndex) : '';
     const fileBaseName = extensionIndex > -1 ? fileName.slice(0, extensionIndex) : fileName;
-    const parameterSegment = fileBaseName.split('_').pop();
+    const parameterSegment = fileBaseName.split('_').pop() ?? '';
     const hasImageServiceParameters = Boolean(parameterSegment && parameterSegment !== fileBaseName && parameterSegment.split('-').every(parameter => IMAGE_SERVICE_PARAM_PATTERN.test(parameter)));
-    const normalizedFileBaseName = hasImageServiceParameters ? fileBaseName.slice(0, fileBaseName.lastIndexOf('_')) : fileBaseName;
     const normalizedSize = Math.max(1, Math.round(size));
-    pathSegments.push(`${normalizedFileBaseName}_w${normalizedSize}-h${normalizedSize}${extension}`);
+    if (hasImageServiceParameters) {
+      const fileBaseNameWithoutParams = fileBaseName.slice(0, fileBaseName.lastIndexOf('_'));
+      const preservedParams = parameterSegment.split('-').filter(p => !/^[whs]\d+$/i.test(p));
+      const newParams = [...preservedParams, `w${normalizedSize}`, `h${normalizedSize}`];
+      pathSegments.push(`${fileBaseNameWithoutParams}_${newParams.join('-')}${extension}`);
+    } else {
+      pathSegments.push(`${fileBaseName}_w${normalizedSize}-h${normalizedSize}${extension}`);
+    }
     urlObject.pathname = pathSegments.join('/');
     return urlObject.toString();
   } catch {

package/lib/cjs/components/grouped-image/GroupedImage.js.map

@@ -1 +1 @@
-{"version":3,"file":"GroupedImage.js","names":["_react","_interopRequireDefault","require","_GroupedImage","_CareOfClipPath","_uuid","_SecondImageClipPath","e","__esModule","default","GROUPED_IMAGE_SERVICE_ORIGIN","IMAGE_SERVICE_PARAM_PATTERN","getGroupedImageDisplayUrl","url","size","urlObject","URL","origin","pathSegments","pathname","split","fileName","pop","extensionIndex","lastIndexOf","extension","slice","fileBaseName","parameterSegment","hasImageServiceParameters","Boolean","every","parameter","test","normalizedFileBaseName","normalizedSize","Math","max","round","push","join","toString","GroupedImage","cornerImage","height","imageBackground","images","onClick","shouldPreventBackground","shouldShowRoundImage","cornerElement","onImageError","hasCornerImage","hasCornerElement","hasMultipleImages","length","uuid","useUuid","cornerImageDisplayUrl","undefined","imageElements","map","src","index","createElement","StyledGroupImageElement","$background","$isSecondImage","$hasCornerImage","$hasMultipleImages","$shouldPreventBackground","$shouldShowRoundImage","$uuid","key","width","viewBox","xmlns","preserveAspectRatio","alt","onError","event","StyledGroupedImage","$height","imageFactors","StyledCornerImage","StyledCornerElement","displayName","_default","exports"],"sources":["../../../../src/components/grouped-image/GroupedImage.tsx"],"sourcesContent":["import React, { CSSProperties, FC, MouseEventHandler, ReactNode, SyntheticEvent } from 'react';\nimport {\n    StyledCornerElement,\n    StyledCornerImage,\n    StyledGroupedImage,\n    StyledGroupImageElement,\n} from './GroupedImage.styles';\nimport CareOfClipPath from './clip-paths/CareOfClipPath';\nimport { useUuid } from '../../hooks/uuid';\nimport SecondImageClipPath from './clip-paths/SecondImageClipPath';\n\nconst GROUPED_IMAGE_SERVICE_ORIGIN = 'https://tsimg.cloud';\nconst IMAGE_SERVICE_PARAM_PATTERN = /^(?:m(?:scale|crop|shortedgescale)|[whsbd]\\d+)$/i;\n\ninterface GroupedImageProps {\n    /**\n     * Optional image to display in the bottom right corner of the grouped image.\n     */\n    cornerImage?: string;\n    /**\n     * Height of the grouped image container.\n     */\n    height?: number;\n    /**\n     * Background for the single images.\n     */\n    imageBackground?: CSSProperties['background'];\n    /**\n     * Array of image URLs to display in the grouped image. If only one image is provided, it will be displayed as a full image.\n     */\n    images: string[];\n    /**\n     * Optional click handler for the grouped image.\n     */\n    onClick?: MouseEventHandler<HTMLDivElement>;\n    /**\n     * Whether to prevent the background of the images from being set.\n     */\n    shouldPreventBackground?: boolean;\n    /**\n     * Whether to show the images in a round shape.\n     */\n    shouldShowRoundImage?: boolean;\n    /**\n     * Optional Element to display in the right corner of the image\n     */\n    cornerElement?: ReactNode;\n    /**\n     * Optional handler for image load errors.\n     */\n    onImageError?: (event: SyntheticEvent<HTMLImageElement, Event>, index: number) => void;\n}\n\nconst getGroupedImageDisplayUrl = (url: string, size: number): string => {\n    try {\n        const urlObject = new URL(url);\n\n        if (urlObject.origin !== GROUPED_IMAGE_SERVICE_ORIGIN) {\n            return url;\n        }\n\n        const pathSegments = urlObject.pathname.split('/');\n        const fileName = pathSegments.pop();\n\n        if (!fileName) {\n            return url;\n        }\n\n        const extensionIndex = fileName.lastIndexOf('.');\n        const extension = extensionIndex > -1 ? fileName.slice(extensionIndex) : '';\n        const fileBaseName = extensionIndex > -1 ? fileName.slice(0, extensionIndex) : fileName;\n        const parameterSegment = fileBaseName.split('_').pop();\n        const hasImageServiceParameters = Boolean(\n            parameterSegment &&\n            parameterSegment !== fileBaseName &&\n            parameterSegment\n                .split('-')\n                .every((parameter) => IMAGE_SERVICE_PARAM_PATTERN.test(parameter)),\n        );\n        const normalizedFileBaseName = hasImageServiceParameters\n            ? fileBaseName.slice(0, fileBaseName.lastIndexOf('_'))\n            : fileBaseName;\n        const normalizedSize = Math.max(1, Math.round(size));\n\n        pathSegments.push(\n            `${normalizedFileBaseName}_w${normalizedSize}-h${normalizedSize}${extension}`,\n        );\n        urlObject.pathname = pathSegments.join('/');\n\n        return urlObject.toString();\n    } catch {\n        return url;\n    }\n};\n\nconst GroupedImage: FC<GroupedImageProps> = ({\n    cornerImage,\n    height = 40,\n    imageBackground,\n    images,\n    onClick,\n    shouldPreventBackground = false,\n    shouldShowRoundImage = false,\n    cornerElement,\n    onImageError,\n}) => {\n    const hasCornerImage = Boolean(cornerImage);\n    const hasCornerElement = Boolean(cornerElement);\n    const hasMultipleImages = images.length > 1;\n    const uuid = useUuid();\n    const cornerImageDisplayUrl = cornerImage\n        ? getGroupedImageDisplayUrl(cornerImage, height)\n        : undefined;\n\n    const imageElements = images.slice(0, 2).map((src, index) => (\n        <StyledGroupImageElement\n            $background={imageBackground}\n            $isSecondImage={index === 1}\n            $hasCornerImage={hasCornerImage}\n            $hasMultipleImages={hasMultipleImages}\n            $shouldPreventBackground={shouldPreventBackground}\n            $shouldShowRoundImage={shouldShowRoundImage}\n            $uuid={uuid}\n            // eslint-disable-next-line react/no-array-index-key\n            key={index}\n        >\n            <svg\n                width=\"100%\"\n                height=\"100%\"\n                viewBox=\"0 0 40 40\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                preserveAspectRatio=\"xMidYMid slice\"\n            >\n                <foreignObject width=\"40\" height=\"40\">\n                    <img\n                        alt={`image--${index}`}\n                        src={getGroupedImageDisplayUrl(src, height)}\n                        onError={(event) =>\n                            typeof onImageError === 'function' && onImageError(event, index)\n                        }\n                    />\n                </foreignObject>\n            </svg>\n        </StyledGroupImageElement>\n    ));\n\n    return (\n        <StyledGroupedImage onClick={onClick} $height={height}>\n            {hasCornerImage && (\n                <CareOfClipPath\n                    height={height}\n                    uuid={uuid}\n                    imageFactors={hasMultipleImages ? [0.76, 0.8] : [1]}\n                />\n            )}\n            {hasMultipleImages && (\n                <SecondImageClipPath\n                    height={height}\n                    uuid={uuid}\n                    shouldShowRoundImage={shouldShowRoundImage}\n                />\n            )}\n\n            {imageElements}\n\n            {hasCornerImage && (\n                <StyledCornerImage\n                    $background={imageBackground}\n                    $shouldPreventBackground={shouldPreventBackground}\n                    $hasMultipleImages={hasMultipleImages}\n                    src={cornerImageDisplayUrl}\n                    key=\"corner-image\"\n                />\n            )}\n            {hasCornerElement && <StyledCornerElement>{cornerElement}</StyledCornerElement>}\n        </StyledGroupedImage>\n    );\n};\n\nGroupedImage.displayName = 'GroupedImage';\n\nexport default GroupedImage;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"GroupedImage.js","names":["_react","_interopRequireDefault","require","_GroupedImage","_CareOfClipPath","_uuid","_SecondImageClipPath","e","__esModule","default","GROUPED_IMAGE_SERVICE_ORIGIN","IMAGE_SERVICE_PARAM_PATTERN","getGroupedImageDisplayUrl","url","size","urlObject","URL","origin","pathSegments","pathname","split","fileName","pop","extensionIndex","lastIndexOf","extension","slice","fileBaseName","parameterSegment","hasImageServiceParameters","Boolean","every","parameter","test","normalizedSize","Math","max","round","fileBaseNameWithoutParams","preservedParams","filter","p","newParams","push","join","toString","GroupedImage","cornerImage","height","imageBackground","images","onClick","shouldPreventBackground","shouldShowRoundImage","cornerElement","onImageError","hasCornerImage","hasCornerElement","hasMultipleImages","length","uuid","useUuid","cornerImageDisplayUrl","undefined","imageElements","map","src","index","createElement","StyledGroupImageElement","$background","$isSecondImage","$hasCornerImage","$hasMultipleImages","$shouldPreventBackground","$shouldShowRoundImage","$uuid","key","width","viewBox","xmlns","preserveAspectRatio","alt","onError","event","StyledGroupedImage","$height","imageFactors","StyledCornerImage","StyledCornerElement","displayName","_default","exports"],"sources":["../../../../src/components/grouped-image/GroupedImage.tsx"],"sourcesContent":["import React, { CSSProperties, FC, MouseEventHandler, ReactNode, SyntheticEvent } from 'react';\nimport {\n    StyledCornerElement,\n    StyledCornerImage,\n    StyledGroupedImage,\n    StyledGroupImageElement,\n} from './GroupedImage.styles';\nimport CareOfClipPath from './clip-paths/CareOfClipPath';\nimport { useUuid } from '../../hooks/uuid';\nimport SecondImageClipPath from './clip-paths/SecondImageClipPath';\n\nconst GROUPED_IMAGE_SERVICE_ORIGIN = 'https://tsimg.cloud';\nconst IMAGE_SERVICE_PARAM_PATTERN =\n    /^(?:[whsbd]\\d+|f(?:webp|avif|json|none)|c(?:c|f)|m(?:cr|sd|ct|pd|cv))$/i;\n\ninterface GroupedImageProps {\n    /**\n     * Optional image to display in the bottom right corner of the grouped image.\n     */\n    cornerImage?: string;\n    /**\n     * Height of the grouped image container.\n     */\n    height?: number;\n    /**\n     * Background for the single images.\n     */\n    imageBackground?: CSSProperties['background'];\n    /**\n     * Array of image URLs to display in the grouped image. If only one image is provided, it will be displayed as a full image.\n     */\n    images: string[];\n    /**\n     * Optional click handler for the grouped image.\n     */\n    onClick?: MouseEventHandler<HTMLDivElement>;\n    /**\n     * Whether to prevent the background of the images from being set.\n     */\n    shouldPreventBackground?: boolean;\n    /**\n     * Whether to show the images in a round shape.\n     */\n    shouldShowRoundImage?: boolean;\n    /**\n     * Optional Element to display in the right corner of the image\n     */\n    cornerElement?: ReactNode;\n    /**\n     * Optional handler for image load errors.\n     */\n    onImageError?: (event: SyntheticEvent<HTMLImageElement, Event>, index: number) => void;\n}\n\nconst getGroupedImageDisplayUrl = (url: string, size: number): string => {\n    try {\n        const urlObject = new URL(url);\n\n        if (urlObject.origin !== GROUPED_IMAGE_SERVICE_ORIGIN) {\n            return url;\n        }\n\n        const pathSegments = urlObject.pathname.split('/');\n        const fileName = pathSegments.pop();\n\n        if (!fileName) {\n            return url;\n        }\n\n        const extensionIndex = fileName.lastIndexOf('.');\n        const extension = extensionIndex > -1 ? fileName.slice(extensionIndex) : '';\n        const fileBaseName = extensionIndex > -1 ? fileName.slice(0, extensionIndex) : fileName;\n        const parameterSegment = fileBaseName.split('_').pop() ?? '';\n        const hasImageServiceParameters = Boolean(\n            parameterSegment &&\n            parameterSegment !== fileBaseName &&\n            parameterSegment\n                .split('-')\n                .every((parameter) => IMAGE_SERVICE_PARAM_PATTERN.test(parameter)),\n        );\n        const normalizedSize = Math.max(1, Math.round(size));\n\n        if (hasImageServiceParameters) {\n            const fileBaseNameWithoutParams = fileBaseName.slice(0, fileBaseName.lastIndexOf('_'));\n            const preservedParams = parameterSegment\n                .split('-')\n                .filter((p) => !/^[whs]\\d+$/i.test(p));\n            const newParams = [...preservedParams, `w${normalizedSize}`, `h${normalizedSize}`];\n            pathSegments.push(`${fileBaseNameWithoutParams}_${newParams.join('-')}${extension}`);\n        } else {\n            pathSegments.push(`${fileBaseName}_w${normalizedSize}-h${normalizedSize}${extension}`);\n        }\n        urlObject.pathname = pathSegments.join('/');\n\n        return urlObject.toString();\n    } catch {\n        return url;\n    }\n};\n\nconst GroupedImage: FC<GroupedImageProps> = ({\n    cornerImage,\n    height = 40,\n    imageBackground,\n    images,\n    onClick,\n    shouldPreventBackground = false,\n    shouldShowRoundImage = false,\n    cornerElement,\n    onImageError,\n}) => {\n    const hasCornerImage = Boolean(cornerImage);\n    const hasCornerElement = Boolean(cornerElement);\n    const hasMultipleImages = images.length > 1;\n    const uuid = useUuid();\n    const cornerImageDisplayUrl = cornerImage\n        ? getGroupedImageDisplayUrl(cornerImage, height)\n        : undefined;\n\n    const imageElements = images.slice(0, 2).map((src, index) => (\n        <StyledGroupImageElement\n            $background={imageBackground}\n            $isSecondImage={index === 1}\n            $hasCornerImage={hasCornerImage}\n            $hasMultipleImages={hasMultipleImages}\n            $shouldPreventBackground={shouldPreventBackground}\n            $shouldShowRoundImage={shouldShowRoundImage}\n            $uuid={uuid}\n            // eslint-disable-next-line react/no-array-index-key\n            key={index}\n        >\n            <svg\n                width=\"100%\"\n                height=\"100%\"\n                viewBox=\"0 0 40 40\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                preserveAspectRatio=\"xMidYMid slice\"\n            >\n                <foreignObject width=\"40\" height=\"40\">\n                    <img\n                        alt={`image--${index}`}\n                        src={getGroupedImageDisplayUrl(src, height)}\n                        onError={(event) =>\n                            typeof onImageError === 'function' && onImageError(event, index)\n                        }\n                    />\n                </foreignObject>\n            </svg>\n        </StyledGroupImageElement>\n    ));\n\n    return (\n        <StyledGroupedImage onClick={onClick} $height={height}>\n            {hasCornerImage && (\n                <CareOfClipPath\n                    height={height}\n                    uuid={uuid}\n                    imageFactors={hasMultipleImages ? [0.76, 0.8] : [1]}\n                />\n            )}\n            {hasMultipleImages && (\n                <SecondImageClipPath\n                    height={height}\n                    uuid={uuid}\n                    shouldShowRoundImage={shouldShowRoundImage}\n                />\n            )}\n\n            {imageElements}\n\n            {hasCornerImage && (\n                <StyledCornerImage\n                    $background={imageBackground}\n                    $shouldPreventBackground={shouldPreventBackground}\n                    $hasMultipleImages={hasMultipleImages}\n                    src={cornerImageDisplayUrl}\n                    key=\"corner-image\"\n                />\n            )}\n            {hasCornerElement && <StyledCornerElement>{cornerElement}</StyledCornerElement>}\n        </StyledGroupedImage>\n    );\n};\n\nGroupedImage.displayName = 'GroupedImage';\n\nexport default GroupedImage;\n"],"mappings":";;;;;;AAAA,IAAAA,MAAA,GAAAC,sBAAA,CAAAC,OAAA;AACA,IAAAC,aAAA,GAAAD,OAAA;AAMA,IAAAE,eAAA,GAAAH,sBAAA,CAAAC,OAAA;AACA,IAAAG,KAAA,GAAAH,OAAA;AACA,IAAAI,oBAAA,GAAAL,sBAAA,CAAAC,OAAA;AAAmE,SAAAD,uBAAAM,CAAA,WAAAA,CAAA,IAAAA,CAAA,CAAAC,UAAA,GAAAD,CAAA,KAAAE,OAAA,EAAAF,CAAA;AAEnE,MAAMG,4BAA4B,GAAG,qBAAqB;AAC1D,MAAMC,2BAA2B,GAC7B,yEAAyE;AAyC7E,MAAMC,yBAAyB,GAAGA,CAACC,GAAW,EAAEC,IAAY,KAAa;EACrE,IAAI;IACA,MAAMC,SAAS,GAAG,IAAIC,GAAG,CAACH,GAAG,CAAC;IAE9B,IAAIE,SAAS,CAACE,MAAM,KAAKP,4BAA4B,EAAE;MACnD,OAAOG,GAAG;IACd;IAEA,MAAMK,YAAY,GAAGH,SAAS,CAACI,QAAQ,CAACC,KAAK,CAAC,GAAG,CAAC;IAClD,MAAMC,QAAQ,GAAGH,YAAY,CAACI,GAAG,CAAC,CAAC;IAEnC,IAAI,CAACD,QAAQ,EAAE;MACX,OAAOR,GAAG;IACd;IAEA,MAAMU,cAAc,GAAGF,QAAQ,CAACG,WAAW,CAAC,GAAG,CAAC;IAChD,MAAMC,SAAS,GAAGF,cAAc,GAAG,CAAC,CAAC,GAAGF,QAAQ,CAACK,KAAK,CAACH,cAAc,CAAC,GAAG,EAAE;IAC3E,MAAMI,YAAY,GAAGJ,cAAc,GAAG,CAAC,CAAC,GAAGF,QAAQ,CAACK,KAAK,CAAC,CAAC,EAAEH,cAAc,CAAC,GAAGF,QAAQ;IACvF,MAAMO,gBAAgB,GAAGD,YAAY,CAACP,KAAK,CAAC,GAAG,CAAC,CAACE,GAAG,CAAC,CAAC,IAAI,EAAE;IAC5D,MAAMO,yBAAyB,GAAGC,OAAO,CACrCF,gBAAgB,IAChBA,gBAAgB,KAAKD,YAAY,IACjCC,gBAAgB,CACXR,KAAK,CAAC,GAAG,CAAC,CACVW,KAAK,CAAEC,SAAS,IAAKrB,2BAA2B,CAACsB,IAAI,CAACD,SAAS,CAAC,CACzE,CAAC;IACD,MAAME,cAAc,GAAGC,IAAI,CAACC,GAAG,CAAC,CAAC,EAAED,IAAI,CAACE,KAAK,CAACvB,IAAI,CAAC,CAAC;IAEpD,IAAIe,yBAAyB,EAAE;MAC3B,MAAMS,yBAAyB,GAAGX,YAAY,CAACD,KAAK,CAAC,CAAC,EAAEC,YAAY,CAACH,WAAW,CAAC,GAAG,CAAC,CAAC;MACtF,MAAMe,eAAe,GAAGX,gBAAgB,CACnCR,KAAK,CAAC,GAAG,CAAC,CACVoB,MAAM,CAAEC,CAAC,IAAK,CAAC,aAAa,CAACR,IAAI,CAACQ,CAAC,CAAC,CAAC;MAC1C,MAAMC,SAAS,GAAG,CAAC,GAAGH,eAAe,EAAE,IAAIL,cAAc,EAAE,EAAE,IAAIA,cAAc,EAAE,CAAC;MAClFhB,YAAY,CAACyB,IAAI,CAAC,GAAGL,yBAAyB,IAAII,SAAS,CAACE,IAAI,CAAC,GAAG,CAAC,GAAGnB,SAAS,EAAE,CAAC;IACxF,CAAC,MAAM;MACHP,YAAY,CAACyB,IAAI,CAAC,GAAGhB,YAAY,KAAKO,cAAc,KAAKA,cAAc,GAAGT,SAAS,EAAE,CAAC;IAC1F;IACAV,SAAS,CAACI,QAAQ,GAAGD,YAAY,CAAC0B,IAAI,CAAC,GAAG,CAAC;IAE3C,OAAO7B,SAAS,CAAC8B,QAAQ,CAAC,CAAC;EAC/B,CAAC,CAAC,MAAM;IACJ,OAAOhC,GAAG;EACd;AACJ,CAAC;AAED,MAAMiC,YAAmC,GAAGA,CAAC;EACzCC,WAAW;EACXC,MAAM,GAAG,EAAE;EACXC,eAAe;EACfC,MAAM;EACNC,OAAO;EACPC,uBAAuB,GAAG,KAAK;EAC/BC,oBAAoB,GAAG,KAAK;EAC5BC,aAAa;EACbC;AACJ,CAAC,KAAK;EACF,MAAMC,cAAc,GAAG1B,OAAO,CAACiB,WAAW,CAAC;EAC3C,MAAMU,gBAAgB,GAAG3B,OAAO,CAACwB,aAAa,CAAC;EAC/C,MAAMI,iBAAiB,GAAGR,MAAM,CAACS,MAAM,GAAG,CAAC;EAC3C,MAAMC,IAAI,GAAG,IAAAC,aAAO,EAAC,CAAC;EACtB,MAAMC,qBAAqB,GAAGf,WAAW,GACnCnC,yBAAyB,CAACmC,WAAW,EAAEC,MAAM,CAAC,GAC9Ce,SAAS;EAEf,MAAMC,aAAa,GAAGd,MAAM,CAACxB,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,CAACuC,GAAG,CAAC,CAACC,GAAG,EAAEC,KAAK,kBACpDnE,MAAA,CAAAS,OAAA,CAAA2D,aAAA,CAACjE,aAAA,CAAAkE,uBAAuB;IACpBC,WAAW,EAAErB,eAAgB;IAC7BsB,cAAc,EAAEJ,KAAK,KAAK,CAAE;IAC5BK,eAAe,EAAEhB,cAAe;IAChCiB,kBAAkB,EAAEf,iBAAkB;IACtCgB,wBAAwB,EAAEtB,uBAAwB;IAClDuB,qBAAqB,EAAEtB,oBAAqB;IAC5CuB,KAAK,EAAEhB;IACP;IAAA;IACAiB,GAAG,EAAEV;EAAM,gBAEXnE,MAAA,CAAAS,OAAA,CAAA2D,aAAA;IACIU,KAAK,EAAC,MAAM;IACZ9B,MAAM,EAAC,MAAM;IACb+B,OAAO,EAAC,WAAW;IACnBC,KAAK,EAAC,4BAA4B;IAClCC,mBAAmB,EAAC;EAAgB,gBAEpCjF,MAAA,CAAAS,OAAA,CAAA2D,aAAA;IAAeU,KAAK,EAAC,IAAI;IAAC9B,MAAM,EAAC;EAAI,gBACjChD,MAAA,CAAAS,OAAA,CAAA2D,aAAA;IACIc,GAAG,EAAE,UAAUf,KAAK,EAAG;IACvBD,GAAG,EAAEtD,yBAAyB,CAACsD,GAAG,EAAElB,MAAM,CAAE;IAC5CmC,OAAO,EAAGC,KAAK,IACX,OAAO7B,YAAY,KAAK,UAAU,IAAIA,YAAY,CAAC6B,KAAK,EAAEjB,KAAK;EAClE,CACJ,CACU,CACd,CACgB,CAC5B,CAAC;EAEF,oBACInE,MAAA,CAAAS,OAAA,CAAA2D,aAAA,CAACjE,aAAA,CAAAkF,kBAAkB;IAAClC,OAAO,EAAEA,OAAQ;IAACmC,OAAO,EAAEtC;EAAO,GACjDQ,cAAc,iBACXxD,MAAA,CAAAS,OAAA,CAAA2D,aAAA,CAAChE,eAAA,CAAAK,OAAc;IACXuC,MAAM,EAAEA,MAAO;IACfY,IAAI,EAAEA,IAAK;IACX2B,YAAY,EAAE7B,iBAAiB,GAAG,CAAC,IAAI,EAAE,GAAG,CAAC,GAAG,CAAC,CAAC;EAAE,CACvD,CACJ,EACAA,iBAAiB,iBACd1D,MAAA,CAAAS,OAAA,CAAA2D,aAAA,CAAC9D,oBAAA,CAAAG,OAAmB;IAChBuC,MAAM,EAAEA,MAAO;IACfY,IAAI,EAAEA,IAAK;IACXP,oBAAoB,EAAEA;EAAqB,CAC9C,CACJ,EAEAW,aAAa,EAEbR,cAAc,iBACXxD,MAAA,CAAAS,OAAA,CAAA2D,aAAA,CAACjE,aAAA,CAAAqF,iBAAiB;IACdlB,WAAW,EAAErB,eAAgB;IAC7ByB,wBAAwB,EAAEtB,uBAAwB;IAClDqB,kBAAkB,EAAEf,iBAAkB;IACtCQ,GAAG,EAAEJ,qBAAsB;IAC3Be,GAAG,EAAC;EAAc,CACrB,CACJ,EACApB,gBAAgB,iBAAIzD,MAAA,CAAAS,OAAA,CAAA2D,aAAA,CAACjE,aAAA,CAAAsF,mBAAmB,QAAEnC,aAAmC,CAC9D,CAAC;AAE7B,CAAC;AAEDR,YAAY,CAAC4C,WAAW,GAAG,cAAc;AAAC,IAAAC,QAAA,GAAAC,OAAA,CAAAnF,OAAA,GAE3BqC,YAAY","ignoreList":[]}

package/lib/cjs/components/skeleton/base-skeleton/BaseSkeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseSkeleton.js","names":["_react","_interopRequireWildcard","require","_BaseSkeleton","_types","_SkeletonProvider","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","BaseSkeleton","exports","forwardRef","baseColor","highlightColor","animationType","height","style","width","className","borderRadius","as","children","ref","values","useSkeletonContext","animationStyle","useSkeletonAnimation","resolvedAnimationType","createElement","StyledBaseSkeleton","$backgroundColor","$borderRadius","$height","$width","$shouldUseNativeTag","SkeletonAnimationType","SHIMMER","StyledMotionBaseSkeletonShimmer","$color","PULSE","StyledMotionBaseSkeletonPulse","displayName","_default"],"sources":["../../../../../src/components/skeleton/base-skeleton/BaseSkeleton.tsx"],"sourcesContent":["import React, { forwardRef, ReactHTML, ReactNode } from 'react';\nimport {\n    StyledBaseSkeleton,\n    StyledMotionBaseSkeletonPulse,\n    StyledMotionBaseSkeletonShimmer,\n} from './BaseSkeleton.styles';\nimport { BaseSkeletonConfig, SkeletonAnimationType } from '../types';\nimport { useSkeletonAnimation, useSkeletonContext } from '../skeleton-provider/SkeletonProvider';\n\nexport interface BaseSkeletonProps extends BaseSkeletonConfig {\n    width: number | string;\n    height: number | string;\n    as?: keyof ReactHTML;\n    children?: ReactNode;\n}\n\nexport const BaseSkeleton = forwardRef<HTMLDivElement, BaseSkeletonProps>(\n    (\n        {\n            baseColor,\n            highlightColor,\n            animationType,\n            height,\n            style,\n            width,\n            className,\n            borderRadius,\n            as,\n            children,\n        },\n        ref,\n    ) => {\n        const values = useSkeletonContext();\n        const animationStyle = useSkeletonAnimation();\n\n        const resolvedAnimationType = animationType ?? values.animationType;\n\n        return (\n            <StyledBaseSkeleton\n                as={as}\n                ref={ref}\n                className={className}\n                style={style}\n                $backgroundColor={baseColor ?? values.baseColor}\n                $borderRadius={borderRadius ?? values.borderRadius}\n                $height={height}\n                $width={width}\n                $shouldUseNativeTag={!!as}\n            >\n                {resolvedAnimationType === SkeletonAnimationType.SHIMMER && (\n                    <StyledMotionBaseSkeletonShimmer\n                        $color={highlightColor ?? values.highlightColor}\n                        style={animationStyle}\n                    />\n                )}\n                {resolvedAnimationType === SkeletonAnimationType.PULSE && (\n                    <StyledMotionBaseSkeletonPulse\n                        $color={highlightColor ?? values.highlightColor}\n                        style={animationStyle}\n                    />\n                )}\n                {children}\n            </StyledBaseSkeleton>\n        );\n    },\n);\n\nBaseSkeleton.displayName = 'BaseSkeleton';\n\nexport default BaseSkeleton;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"BaseSkeleton.js","names":["_react","_interopRequireWildcard","require","_BaseSkeleton","_types","_SkeletonProvider","e","t","WeakMap","r","n","__esModule","o","i","f","__proto__","default","has","get","set","hasOwnProperty","call","Object","defineProperty","getOwnPropertyDescriptor","BaseSkeleton","exports","forwardRef","baseColor","highlightColor","animationType","height","style","width","className","borderRadius","as","children","ref","values","useSkeletonContext","animationStyle","useSkeletonAnimation","resolvedAnimationType","createElement","StyledBaseSkeleton","$backgroundColor","$borderRadius","$height","$width","$shouldUseNativeTag","SkeletonAnimationType","SHIMMER","StyledMotionBaseSkeletonShimmer","$color","PULSE","StyledMotionBaseSkeletonPulse","displayName","_default"],"sources":["../../../../../src/components/skeleton/base-skeleton/BaseSkeleton.tsx"],"sourcesContent":["import React, { forwardRef, ReactNode, type JSX } from 'react';\nimport {\n    StyledBaseSkeleton,\n    StyledMotionBaseSkeletonPulse,\n    StyledMotionBaseSkeletonShimmer,\n} from './BaseSkeleton.styles';\nimport { BaseSkeletonConfig, SkeletonAnimationType } from '../types';\nimport { useSkeletonAnimation, useSkeletonContext } from '../skeleton-provider/SkeletonProvider';\n\nexport interface BaseSkeletonProps extends BaseSkeletonConfig {\n    width: number | string;\n    height: number | string;\n    as?: keyof JSX.IntrinsicElements;\n    children?: ReactNode;\n}\n\nexport const BaseSkeleton = forwardRef<HTMLDivElement, BaseSkeletonProps>(\n    (\n        {\n            baseColor,\n            highlightColor,\n            animationType,\n            height,\n            style,\n            width,\n            className,\n            borderRadius,\n            as,\n            children,\n        },\n        ref,\n    ) => {\n        const values = useSkeletonContext();\n        const animationStyle = useSkeletonAnimation();\n\n        const resolvedAnimationType = animationType ?? values.animationType;\n\n        return (\n            <StyledBaseSkeleton\n                as={as}\n                ref={ref}\n                className={className}\n                style={style}\n                $backgroundColor={baseColor ?? values.baseColor}\n                $borderRadius={borderRadius ?? values.borderRadius}\n                $height={height}\n                $width={width}\n                $shouldUseNativeTag={!!as}\n            >\n                {resolvedAnimationType === SkeletonAnimationType.SHIMMER && (\n                    <StyledMotionBaseSkeletonShimmer\n                        $color={highlightColor ?? values.highlightColor}\n                        style={animationStyle}\n                    />\n                )}\n                {resolvedAnimationType === SkeletonAnimationType.PULSE && (\n                    <StyledMotionBaseSkeletonPulse\n                        $color={highlightColor ?? values.highlightColor}\n                        style={animationStyle}\n                    />\n                )}\n                {children}\n            </StyledBaseSkeleton>\n        );\n    },\n);\n\nBaseSkeleton.displayName = 'BaseSkeleton';\n\nexport default BaseSkeleton;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/combobox/ComboBox.types.js.map

@@ -1 +1 @@
-{"version":3,"file":"ComboBox.types.js","names":["ComboBoxSize"],"sources":["../../../../src/components/combobox/ComboBox.types.ts"],"sourcesContent":["import { ChangeEventHandler, CSSProperties, FocusEventHandler, ReactHTML, ReactNode } from 'react';\nimport { CSSPropertiesWithVars } from 'styled-components/dist/types';\nimport { DropdownDirection } from '../../types/dropdown';\n\n/**\n * Ref interface for the `ComboBox` component.\n */\nexport interface ComboBoxRef {\n    /**\n     * Hides the dropdown content.\n     */\n    hide: VoidFunction;\n    /**\n     * Shows the dropdown content.\n     */\n    show: VoidFunction;\n}\n\n/**\n * A grouped list definition used by the `ComboBox` component.\n */\nexport interface IComboBoxItems {\n    /**\n     * Optional group label shown above the list.\n     */\n    groupName?: string;\n    /**\n     * The items that should be rendered inside the group.\n     */\n    list: Array<IComboBoxItem>;\n    /**\n     * Whether the items in this group should use round images.\n     */\n    shouldShowRoundImage?: boolean;\n}\n\n/**\n * Optional text styling configuration for a combobox item.\n */\nexport interface ComboBoxTextStyles {\n    /**\n     * The HTML tag that should be used for the text wrapper.\n     */\n    tagName?: keyof ReactHTML;\n    /**\n     * Additional inline styles applied to the text wrapper.\n     */\n    styles?: CSSPropertiesWithVars;\n    /**\n     * Additional class name applied to the text wrapper.\n     */\n    className?: string;\n}\n\n/**\n * Single selectable item configuration for the `ComboBox` component.\n */\nexport interface IComboBoxItem {\n    /**\n     * Optional icon classes rendered before the text.\n     */\n    icons?: string[];\n    /**\n     * Optional background style used for the image placeholder.\n     */\n    imageBackground?: CSSProperties['background'];\n    /**\n     * Optional image URL rendered for the item.\n     */\n    imageUrl?: string;\n    /**\n     * Whether the item should be disabled.\n     */\n    isDisabled?: boolean;\n    /**\n     * Optional element rendered on the right side of the item.\n     */\n    rightElement?: ReactNode;\n    /**\n     * Optional secondary text rendered below the main text.\n     */\n    subtext?: string;\n    /**\n     * Optional suffix element rendered after the text.\n     */\n    suffixElement?: ReactNode;\n    /**\n     * Main label of the item.\n     */\n    text: string;\n    /**\n     * Stable item value used for selection and matching.\n     */\n    value: string | number;\n    /**\n     * Optional text styling overrides for the item label.\n     */\n    textStyles?: ComboBoxTextStyles;\n}\n\n/**\n * Available size variants for the `ComboBox` header.\n */\nexport enum ComboBoxSize {\n    /**\n     * Standard height and spacing.\n     */\n    NORMAL = 'normal',\n    /**\n     * Compact height and spacing.\n     */\n    SMALL = 'small',\n}\n\n/**\n * Props for the `ComboBox` component.\n */\nexport type ComboBoxProps = {\n    /**\n     * The width of the body.\n     * @default undefined\n     */\n    bodyWidth?: number;\n    /**\n     * The element where the content of the `ComboBox` should be rendered via React Portal.\n     * @default undefined\n     */\n    container?: Element;\n    /**\n     * The direction in which the combobox should open.\n     * @default DropdownDirection.RIGHT\n     */\n    direction?: DropdownDirection;\n    /**\n     * The value of the optional input.\n     * @default undefined\n     */\n    inputValue?: string;\n    /**\n     * Whether the combobox should be disabled.\n     * @default false\n     */\n    isDisabled?: boolean;\n    /**\n     * The list of the items that should be displayed.\n     */\n    lists: IComboBoxItems[];\n    /**\n     * The maximum height of the combobox content.\n     * @default 280\n     */\n    maxHeight?: number;\n    /**\n     * Function to be executed when the value of the optional input is changed.\n     * @default undefined\n     */\n    onInputChange?: ChangeEventHandler<HTMLInputElement>;\n    /**\n     * Function to be executed when the optional input lost its focus.\n     * @default undefined\n     */\n    onInputBlur?: FocusEventHandler<HTMLInputElement>;\n    /**\n     * Function to be executed when the optional input gets its focus.\n     * @default undefined\n     */\n    onInputFocus?: FocusEventHandler<HTMLInputElement>;\n    /**\n     * Function that should be executed when an item is selected. If the function returns false, the item will not be selected.\n     * @default undefined\n     */\n    onSelect?: (comboboxItem?: IComboBoxItem) => Promise<boolean> | boolean | void;\n    /**\n     * Function to be executed when the content of the `ComboBox` is shown.\n     * @default undefined\n     */\n    onShow?: () => void;\n    /**\n     * Function to be executed when the content of the `ComboBox` is hidden.\n     * @default undefined\n     */\n    onHide?: () => void;\n    /**\n     * A text that should be displayed when no item is selected.\n     */\n    placeholder: string;\n    /**\n     * A prefix that should be displayed before the placeholder.\n     * @default undefined\n     */\n    prefix?: string;\n    /**\n     * An item that should be preselected.\n     * @default undefined\n     */\n    selectedItem?: IComboBoxItem;\n    /**\n     * If true, the images of the items are displayed in a bigger shape. This prop will automatically be set to true if the subtext of an item is given.\n     * @default false\n     */\n    shouldShowBigImage?: boolean;\n    /**\n     * If true, a clear icon is displayed at the end of the combo box if an item is selected.\n     * @default false\n     */\n    shouldShowClearIcon?: boolean;\n    /**\n     * Whether the background should be transparent.\n     * @default false\n     */\n    shouldShowTransparentBackground?: boolean;\n    /**\n     * If true, the images of the items are displayed in a round shape.\n     * @default false\n     */\n    shouldShowRoundImage?: boolean;\n    /**\n     * Whether the width of the ComboBox should be the width of the current item.\n     * @default false\n     */\n    shouldUseCurrentItemWidth?: boolean;\n    /**\n     * Whether the width of the 'ComboBox' should be the width of the parent or of the widest item.\n     * @default false\n     */\n    shouldUseFullWidth?: boolean;\n    /**\n     * If true, the dropdown will use the maximum width of the items.\n     * @default false\n     */\n    shouldDropDownUseMaxItemWidth?: boolean;\n    /**\n     * Whether the outside events should be captured.\n     * @default undefined\n     */\n    shouldCaptureEvents?: boolean;\n    /**\n     * The size of the ComboBox.\n     * @default ComboBoxSize.NORMAL\n     */\n    size?: ComboBoxSize;\n    /**\n     * Optional min width for the prefix element.\n     * @default undefined\n     */\n    prefixMinWidth?: number;\n};\n"],"mappings":"AAIA;AACA;AACA;;AAYA;AACA;AACA;;AAgBA;AACA;AACA;;AAgBA;AACA;AACA;;AA4CA;AACA;AACA;AACA,WAAYA,YAAY,0BAAZA,YAAY;EACpB;AACJ;AACA;EAHYA,YAAY;EAKpB;AACJ;AACA;EAPYA,YAAY;EAAA,OAAZA,YAAY;AAAA;;AAWxB;AACA;AACA","ignoreList":[]}
+{"version":3,"file":"ComboBox.types.js","names":["ComboBoxSize"],"sources":["../../../../src/components/combobox/ComboBox.types.ts"],"sourcesContent":["import { ChangeEventHandler, CSSProperties, FocusEventHandler, ReactNode, type JSX } from 'react';\nimport { CSSPropertiesWithVars } from 'styled-components/dist/types';\nimport { DropdownDirection } from '../../types/dropdown';\n\n/**\n * Ref interface for the `ComboBox` component.\n */\nexport interface ComboBoxRef {\n    /**\n     * Hides the dropdown content.\n     */\n    hide: VoidFunction;\n    /**\n     * Shows the dropdown content.\n     */\n    show: VoidFunction;\n}\n\n/**\n * A grouped list definition used by the `ComboBox` component.\n */\nexport interface IComboBoxItems {\n    /**\n     * Optional group label shown above the list.\n     */\n    groupName?: string;\n    /**\n     * The items that should be rendered inside the group.\n     */\n    list: Array<IComboBoxItem>;\n    /**\n     * Whether the items in this group should use round images.\n     */\n    shouldShowRoundImage?: boolean;\n}\n\n/**\n * Optional text styling configuration for a combobox item.\n */\nexport interface ComboBoxTextStyles {\n    /**\n     * The HTML tag that should be used for the text wrapper.\n     */\n    tagName?: keyof JSX.IntrinsicElements;\n    /**\n     * Additional inline styles applied to the text wrapper.\n     */\n    styles?: CSSPropertiesWithVars;\n    /**\n     * Additional class name applied to the text wrapper.\n     */\n    className?: string;\n}\n\n/**\n * Single selectable item configuration for the `ComboBox` component.\n */\nexport interface IComboBoxItem {\n    /**\n     * Optional icon classes rendered before the text.\n     */\n    icons?: string[];\n    /**\n     * Optional background style used for the image placeholder.\n     */\n    imageBackground?: CSSProperties['background'];\n    /**\n     * Optional image URL rendered for the item.\n     */\n    imageUrl?: string;\n    /**\n     * Whether the item should be disabled.\n     */\n    isDisabled?: boolean;\n    /**\n     * Optional element rendered on the right side of the item.\n     */\n    rightElement?: ReactNode;\n    /**\n     * Optional secondary text rendered below the main text.\n     */\n    subtext?: string;\n    /**\n     * Optional suffix element rendered after the text.\n     */\n    suffixElement?: ReactNode;\n    /**\n     * Main label of the item.\n     */\n    text: string;\n    /**\n     * Stable item value used for selection and matching.\n     */\n    value: string | number;\n    /**\n     * Optional text styling overrides for the item label.\n     */\n    textStyles?: ComboBoxTextStyles;\n}\n\n/**\n * Available size variants for the `ComboBox` header.\n */\nexport enum ComboBoxSize {\n    /**\n     * Standard height and spacing.\n     */\n    NORMAL = 'normal',\n    /**\n     * Compact height and spacing.\n     */\n    SMALL = 'small',\n}\n\n/**\n * Props for the `ComboBox` component.\n */\nexport type ComboBoxProps = {\n    /**\n     * The width of the body.\n     * @default undefined\n     */\n    bodyWidth?: number;\n    /**\n     * The element where the content of the `ComboBox` should be rendered via React Portal.\n     * @default undefined\n     */\n    container?: Element;\n    /**\n     * The direction in which the combobox should open.\n     * @default DropdownDirection.RIGHT\n     */\n    direction?: DropdownDirection;\n    /**\n     * The value of the optional input.\n     * @default undefined\n     */\n    inputValue?: string;\n    /**\n     * Whether the combobox should be disabled.\n     * @default false\n     */\n    isDisabled?: boolean;\n    /**\n     * The list of the items that should be displayed.\n     */\n    lists: IComboBoxItems[];\n    /**\n     * The maximum height of the combobox content.\n     * @default 280\n     */\n    maxHeight?: number;\n    /**\n     * Function to be executed when the value of the optional input is changed.\n     * @default undefined\n     */\n    onInputChange?: ChangeEventHandler<HTMLInputElement>;\n    /**\n     * Function to be executed when the optional input lost its focus.\n     * @default undefined\n     */\n    onInputBlur?: FocusEventHandler<HTMLInputElement>;\n    /**\n     * Function to be executed when the optional input gets its focus.\n     * @default undefined\n     */\n    onInputFocus?: FocusEventHandler<HTMLInputElement>;\n    /**\n     * Function that should be executed when an item is selected. If the function returns false, the item will not be selected.\n     * @default undefined\n     */\n    onSelect?: (comboboxItem?: IComboBoxItem) => Promise<boolean> | boolean | void;\n    /**\n     * Function to be executed when the content of the `ComboBox` is shown.\n     * @default undefined\n     */\n    onShow?: () => void;\n    /**\n     * Function to be executed when the content of the `ComboBox` is hidden.\n     * @default undefined\n     */\n    onHide?: () => void;\n    /**\n     * A text that should be displayed when no item is selected.\n     */\n    placeholder: string;\n    /**\n     * A prefix that should be displayed before the placeholder.\n     * @default undefined\n     */\n    prefix?: string;\n    /**\n     * An item that should be preselected.\n     * @default undefined\n     */\n    selectedItem?: IComboBoxItem;\n    /**\n     * If true, the images of the items are displayed in a bigger shape. This prop will automatically be set to true if the subtext of an item is given.\n     * @default false\n     */\n    shouldShowBigImage?: boolean;\n    /**\n     * If true, a clear icon is displayed at the end of the combo box if an item is selected.\n     * @default false\n     */\n    shouldShowClearIcon?: boolean;\n    /**\n     * Whether the background should be transparent.\n     * @default false\n     */\n    shouldShowTransparentBackground?: boolean;\n    /**\n     * If true, the images of the items are displayed in a round shape.\n     * @default false\n     */\n    shouldShowRoundImage?: boolean;\n    /**\n     * Whether the width of the ComboBox should be the width of the current item.\n     * @default false\n     */\n    shouldUseCurrentItemWidth?: boolean;\n    /**\n     * Whether the width of the 'ComboBox' should be the width of the parent or of the widest item.\n     * @default false\n     */\n    shouldUseFullWidth?: boolean;\n    /**\n     * If true, the dropdown will use the maximum width of the items.\n     * @default false\n     */\n    shouldDropDownUseMaxItemWidth?: boolean;\n    /**\n     * Whether the outside events should be captured.\n     * @default undefined\n     */\n    shouldCaptureEvents?: boolean;\n    /**\n     * The size of the ComboBox.\n     * @default ComboBoxSize.NORMAL\n     */\n    size?: ComboBoxSize;\n    /**\n     * Optional min width for the prefix element.\n     * @default undefined\n     */\n    prefixMinWidth?: number;\n};\n"],"mappings":"AAIA;AACA;AACA;;AAYA;AACA;AACA;;AAgBA;AACA;AACA;;AAgBA;AACA;AACA;;AA4CA;AACA;AACA;AACA,WAAYA,YAAY,0BAAZA,YAAY;EACpB;AACJ;AACA;EAHYA,YAAY;EAKpB;AACJ;AACA;EAPYA,YAAY;EAAA,OAAZA,YAAY;AAAA;;AAWxB;AACA;AACA","ignoreList":[]}

package/lib/esm/components/grouped-image/GroupedImage.js

@@ -4,7 +4,7 @@ import CareOfClipPath from './clip-paths/CareOfClipPath';
 import { useUuid } from '../../hooks/uuid';
 import SecondImageClipPath from './clip-paths/SecondImageClipPath';
 const GROUPED_IMAGE_SERVICE_ORIGIN = 'https://tsimg.cloud';
-const IMAGE_SERVICE_PARAM_PATTERN = /^(?:m(?:scale|crop|shortedgescale)|[whsbd]\d+)$/i;
+const IMAGE_SERVICE_PARAM_PATTERN = /^(?:[whsbd]\d+|f(?:webp|avif|json|none)|c(?:c|f)|m(?:cr|sd|ct|pd|cv))$/i;
 const getGroupedImageDisplayUrl = (url, size) => {
   try {
     const urlObject = new URL(url);
@@ -19,11 +19,17 @@ const getGroupedImageDisplayUrl = (url, size) => {
     const extensionIndex = fileName.lastIndexOf('.');
     const extension = extensionIndex > -1 ? fileName.slice(extensionIndex) : '';
     const fileBaseName = extensionIndex > -1 ? fileName.slice(0, extensionIndex) : fileName;
-    const parameterSegment = fileBaseName.split('_').pop();
+    const parameterSegment = fileBaseName.split('_').pop() ?? '';
     const hasImageServiceParameters = Boolean(parameterSegment && parameterSegment !== fileBaseName && parameterSegment.split('-').every(parameter => IMAGE_SERVICE_PARAM_PATTERN.test(parameter)));
-    const normalizedFileBaseName = hasImageServiceParameters ? fileBaseName.slice(0, fileBaseName.lastIndexOf('_')) : fileBaseName;
     const normalizedSize = Math.max(1, Math.round(size));
-    pathSegments.push(`${normalizedFileBaseName}_w${normalizedSize}-h${normalizedSize}${extension}`);
+    if (hasImageServiceParameters) {
+      const fileBaseNameWithoutParams = fileBaseName.slice(0, fileBaseName.lastIndexOf('_'));
+      const preservedParams = parameterSegment.split('-').filter(p => !/^[whs]\d+$/i.test(p));
+      const newParams = [...preservedParams, `w${normalizedSize}`, `h${normalizedSize}`];
+      pathSegments.push(`${fileBaseNameWithoutParams}_${newParams.join('-')}${extension}`);
+    } else {
+      pathSegments.push(`${fileBaseName}_w${normalizedSize}-h${normalizedSize}${extension}`);
+    }
     urlObject.pathname = pathSegments.join('/');
     return urlObject.toString();
   } catch {

package/lib/esm/components/grouped-image/GroupedImage.js.map

@@ -1 +1 @@
-{"version":3,"file":"GroupedImage.js","names":["React","StyledCornerElement","StyledCornerImage","StyledGroupedImage","StyledGroupImageElement","CareOfClipPath","useUuid","SecondImageClipPath","GROUPED_IMAGE_SERVICE_ORIGIN","IMAGE_SERVICE_PARAM_PATTERN","getGroupedImageDisplayUrl","url","size","urlObject","URL","origin","pathSegments","pathname","split","fileName","pop","extensionIndex","lastIndexOf","extension","slice","fileBaseName","parameterSegment","hasImageServiceParameters","Boolean","every","parameter","test","normalizedFileBaseName","normalizedSize","Math","max","round","push","join","toString","GroupedImage","cornerImage","height","imageBackground","images","onClick","shouldPreventBackground","shouldShowRoundImage","cornerElement","onImageError","hasCornerImage","hasCornerElement","hasMultipleImages","length","uuid","cornerImageDisplayUrl","undefined","imageElements","map","src","index","createElement","$background","$isSecondImage","$hasCornerImage","$hasMultipleImages","$shouldPreventBackground","$shouldShowRoundImage","$uuid","key","width","viewBox","xmlns","preserveAspectRatio","alt","onError","event","$height","imageFactors","displayName"],"sources":["../../../../src/components/grouped-image/GroupedImage.tsx"],"sourcesContent":["import React, { CSSProperties, FC, MouseEventHandler, ReactNode, SyntheticEvent } from 'react';\nimport {\n    StyledCornerElement,\n    StyledCornerImage,\n    StyledGroupedImage,\n    StyledGroupImageElement,\n} from './GroupedImage.styles';\nimport CareOfClipPath from './clip-paths/CareOfClipPath';\nimport { useUuid } from '../../hooks/uuid';\nimport SecondImageClipPath from './clip-paths/SecondImageClipPath';\n\nconst GROUPED_IMAGE_SERVICE_ORIGIN = 'https://tsimg.cloud';\nconst IMAGE_SERVICE_PARAM_PATTERN = /^(?:m(?:scale|crop|shortedgescale)|[whsbd]\\d+)$/i;\n\ninterface GroupedImageProps {\n    /**\n     * Optional image to display in the bottom right corner of the grouped image.\n     */\n    cornerImage?: string;\n    /**\n     * Height of the grouped image container.\n     */\n    height?: number;\n    /**\n     * Background for the single images.\n     */\n    imageBackground?: CSSProperties['background'];\n    /**\n     * Array of image URLs to display in the grouped image. If only one image is provided, it will be displayed as a full image.\n     */\n    images: string[];\n    /**\n     * Optional click handler for the grouped image.\n     */\n    onClick?: MouseEventHandler<HTMLDivElement>;\n    /**\n     * Whether to prevent the background of the images from being set.\n     */\n    shouldPreventBackground?: boolean;\n    /**\n     * Whether to show the images in a round shape.\n     */\n    shouldShowRoundImage?: boolean;\n    /**\n     * Optional Element to display in the right corner of the image\n     */\n    cornerElement?: ReactNode;\n    /**\n     * Optional handler for image load errors.\n     */\n    onImageError?: (event: SyntheticEvent<HTMLImageElement, Event>, index: number) => void;\n}\n\nconst getGroupedImageDisplayUrl = (url: string, size: number): string => {\n    try {\n        const urlObject = new URL(url);\n\n        if (urlObject.origin !== GROUPED_IMAGE_SERVICE_ORIGIN) {\n            return url;\n        }\n\n        const pathSegments = urlObject.pathname.split('/');\n        const fileName = pathSegments.pop();\n\n        if (!fileName) {\n            return url;\n        }\n\n        const extensionIndex = fileName.lastIndexOf('.');\n        const extension = extensionIndex > -1 ? fileName.slice(extensionIndex) : '';\n        const fileBaseName = extensionIndex > -1 ? fileName.slice(0, extensionIndex) : fileName;\n        const parameterSegment = fileBaseName.split('_').pop();\n        const hasImageServiceParameters = Boolean(\n            parameterSegment &&\n            parameterSegment !== fileBaseName &&\n            parameterSegment\n                .split('-')\n                .every((parameter) => IMAGE_SERVICE_PARAM_PATTERN.test(parameter)),\n        );\n        const normalizedFileBaseName = hasImageServiceParameters\n            ? fileBaseName.slice(0, fileBaseName.lastIndexOf('_'))\n            : fileBaseName;\n        const normalizedSize = Math.max(1, Math.round(size));\n\n        pathSegments.push(\n            `${normalizedFileBaseName}_w${normalizedSize}-h${normalizedSize}${extension}`,\n        );\n        urlObject.pathname = pathSegments.join('/');\n\n        return urlObject.toString();\n    } catch {\n        return url;\n    }\n};\n\nconst GroupedImage: FC<GroupedImageProps> = ({\n    cornerImage,\n    height = 40,\n    imageBackground,\n    images,\n    onClick,\n    shouldPreventBackground = false,\n    shouldShowRoundImage = false,\n    cornerElement,\n    onImageError,\n}) => {\n    const hasCornerImage = Boolean(cornerImage);\n    const hasCornerElement = Boolean(cornerElement);\n    const hasMultipleImages = images.length > 1;\n    const uuid = useUuid();\n    const cornerImageDisplayUrl = cornerImage\n        ? getGroupedImageDisplayUrl(cornerImage, height)\n        : undefined;\n\n    const imageElements = images.slice(0, 2).map((src, index) => (\n        <StyledGroupImageElement\n            $background={imageBackground}\n            $isSecondImage={index === 1}\n            $hasCornerImage={hasCornerImage}\n            $hasMultipleImages={hasMultipleImages}\n            $shouldPreventBackground={shouldPreventBackground}\n            $shouldShowRoundImage={shouldShowRoundImage}\n            $uuid={uuid}\n            // eslint-disable-next-line react/no-array-index-key\n            key={index}\n        >\n            <svg\n                width=\"100%\"\n                height=\"100%\"\n                viewBox=\"0 0 40 40\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                preserveAspectRatio=\"xMidYMid slice\"\n            >\n                <foreignObject width=\"40\" height=\"40\">\n                    <img\n                        alt={`image--${index}`}\n                        src={getGroupedImageDisplayUrl(src, height)}\n                        onError={(event) =>\n                            typeof onImageError === 'function' && onImageError(event, index)\n                        }\n                    />\n                </foreignObject>\n            </svg>\n        </StyledGroupImageElement>\n    ));\n\n    return (\n        <StyledGroupedImage onClick={onClick} $height={height}>\n            {hasCornerImage && (\n                <CareOfClipPath\n                    height={height}\n                    uuid={uuid}\n                    imageFactors={hasMultipleImages ? [0.76, 0.8] : [1]}\n                />\n            )}\n            {hasMultipleImages && (\n                <SecondImageClipPath\n                    height={height}\n                    uuid={uuid}\n                    shouldShowRoundImage={shouldShowRoundImage}\n                />\n            )}\n\n            {imageElements}\n\n            {hasCornerImage && (\n                <StyledCornerImage\n                    $background={imageBackground}\n                    $shouldPreventBackground={shouldPreventBackground}\n                    $hasMultipleImages={hasMultipleImages}\n                    src={cornerImageDisplayUrl}\n                    key=\"corner-image\"\n                />\n            )}\n            {hasCornerElement && <StyledCornerElement>{cornerElement}</StyledCornerElement>}\n        </StyledGroupedImage>\n    );\n};\n\nGroupedImage.displayName = 'GroupedImage';\n\nexport default GroupedImage;\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"file":"GroupedImage.js","names":["React","StyledCornerElement","StyledCornerImage","StyledGroupedImage","StyledGroupImageElement","CareOfClipPath","useUuid","SecondImageClipPath","GROUPED_IMAGE_SERVICE_ORIGIN","IMAGE_SERVICE_PARAM_PATTERN","getGroupedImageDisplayUrl","url","size","urlObject","URL","origin","pathSegments","pathname","split","fileName","pop","extensionIndex","lastIndexOf","extension","slice","fileBaseName","parameterSegment","hasImageServiceParameters","Boolean","every","parameter","test","normalizedSize","Math","max","round","fileBaseNameWithoutParams","preservedParams","filter","p","newParams","push","join","toString","GroupedImage","cornerImage","height","imageBackground","images","onClick","shouldPreventBackground","shouldShowRoundImage","cornerElement","onImageError","hasCornerImage","hasCornerElement","hasMultipleImages","length","uuid","cornerImageDisplayUrl","undefined","imageElements","map","src","index","createElement","$background","$isSecondImage","$hasCornerImage","$hasMultipleImages","$shouldPreventBackground","$shouldShowRoundImage","$uuid","key","width","viewBox","xmlns","preserveAspectRatio","alt","onError","event","$height","imageFactors","displayName"],"sources":["../../../../src/components/grouped-image/GroupedImage.tsx"],"sourcesContent":["import React, { CSSProperties, FC, MouseEventHandler, ReactNode, SyntheticEvent } from 'react';\nimport {\n    StyledCornerElement,\n    StyledCornerImage,\n    StyledGroupedImage,\n    StyledGroupImageElement,\n} from './GroupedImage.styles';\nimport CareOfClipPath from './clip-paths/CareOfClipPath';\nimport { useUuid } from '../../hooks/uuid';\nimport SecondImageClipPath from './clip-paths/SecondImageClipPath';\n\nconst GROUPED_IMAGE_SERVICE_ORIGIN = 'https://tsimg.cloud';\nconst IMAGE_SERVICE_PARAM_PATTERN =\n    /^(?:[whsbd]\\d+|f(?:webp|avif|json|none)|c(?:c|f)|m(?:cr|sd|ct|pd|cv))$/i;\n\ninterface GroupedImageProps {\n    /**\n     * Optional image to display in the bottom right corner of the grouped image.\n     */\n    cornerImage?: string;\n    /**\n     * Height of the grouped image container.\n     */\n    height?: number;\n    /**\n     * Background for the single images.\n     */\n    imageBackground?: CSSProperties['background'];\n    /**\n     * Array of image URLs to display in the grouped image. If only one image is provided, it will be displayed as a full image.\n     */\n    images: string[];\n    /**\n     * Optional click handler for the grouped image.\n     */\n    onClick?: MouseEventHandler<HTMLDivElement>;\n    /**\n     * Whether to prevent the background of the images from being set.\n     */\n    shouldPreventBackground?: boolean;\n    /**\n     * Whether to show the images in a round shape.\n     */\n    shouldShowRoundImage?: boolean;\n    /**\n     * Optional Element to display in the right corner of the image\n     */\n    cornerElement?: ReactNode;\n    /**\n     * Optional handler for image load errors.\n     */\n    onImageError?: (event: SyntheticEvent<HTMLImageElement, Event>, index: number) => void;\n}\n\nconst getGroupedImageDisplayUrl = (url: string, size: number): string => {\n    try {\n        const urlObject = new URL(url);\n\n        if (urlObject.origin !== GROUPED_IMAGE_SERVICE_ORIGIN) {\n            return url;\n        }\n\n        const pathSegments = urlObject.pathname.split('/');\n        const fileName = pathSegments.pop();\n\n        if (!fileName) {\n            return url;\n        }\n\n        const extensionIndex = fileName.lastIndexOf('.');\n        const extension = extensionIndex > -1 ? fileName.slice(extensionIndex) : '';\n        const fileBaseName = extensionIndex > -1 ? fileName.slice(0, extensionIndex) : fileName;\n        const parameterSegment = fileBaseName.split('_').pop() ?? '';\n        const hasImageServiceParameters = Boolean(\n            parameterSegment &&\n            parameterSegment !== fileBaseName &&\n            parameterSegment\n                .split('-')\n                .every((parameter) => IMAGE_SERVICE_PARAM_PATTERN.test(parameter)),\n        );\n        const normalizedSize = Math.max(1, Math.round(size));\n\n        if (hasImageServiceParameters) {\n            const fileBaseNameWithoutParams = fileBaseName.slice(0, fileBaseName.lastIndexOf('_'));\n            const preservedParams = parameterSegment\n                .split('-')\n                .filter((p) => !/^[whs]\\d+$/i.test(p));\n            const newParams = [...preservedParams, `w${normalizedSize}`, `h${normalizedSize}`];\n            pathSegments.push(`${fileBaseNameWithoutParams}_${newParams.join('-')}${extension}`);\n        } else {\n            pathSegments.push(`${fileBaseName}_w${normalizedSize}-h${normalizedSize}${extension}`);\n        }\n        urlObject.pathname = pathSegments.join('/');\n\n        return urlObject.toString();\n    } catch {\n        return url;\n    }\n};\n\nconst GroupedImage: FC<GroupedImageProps> = ({\n    cornerImage,\n    height = 40,\n    imageBackground,\n    images,\n    onClick,\n    shouldPreventBackground = false,\n    shouldShowRoundImage = false,\n    cornerElement,\n    onImageError,\n}) => {\n    const hasCornerImage = Boolean(cornerImage);\n    const hasCornerElement = Boolean(cornerElement);\n    const hasMultipleImages = images.length > 1;\n    const uuid = useUuid();\n    const cornerImageDisplayUrl = cornerImage\n        ? getGroupedImageDisplayUrl(cornerImage, height)\n        : undefined;\n\n    const imageElements = images.slice(0, 2).map((src, index) => (\n        <StyledGroupImageElement\n            $background={imageBackground}\n            $isSecondImage={index === 1}\n            $hasCornerImage={hasCornerImage}\n            $hasMultipleImages={hasMultipleImages}\n            $shouldPreventBackground={shouldPreventBackground}\n            $shouldShowRoundImage={shouldShowRoundImage}\n            $uuid={uuid}\n            // eslint-disable-next-line react/no-array-index-key\n            key={index}\n        >\n            <svg\n                width=\"100%\"\n                height=\"100%\"\n                viewBox=\"0 0 40 40\"\n                xmlns=\"http://www.w3.org/2000/svg\"\n                preserveAspectRatio=\"xMidYMid slice\"\n            >\n                <foreignObject width=\"40\" height=\"40\">\n                    <img\n                        alt={`image--${index}`}\n                        src={getGroupedImageDisplayUrl(src, height)}\n                        onError={(event) =>\n                            typeof onImageError === 'function' && onImageError(event, index)\n                        }\n                    />\n                </foreignObject>\n            </svg>\n        </StyledGroupImageElement>\n    ));\n\n    return (\n        <StyledGroupedImage onClick={onClick} $height={height}>\n            {hasCornerImage && (\n                <CareOfClipPath\n                    height={height}\n                    uuid={uuid}\n                    imageFactors={hasMultipleImages ? [0.76, 0.8] : [1]}\n                />\n            )}\n            {hasMultipleImages && (\n                <SecondImageClipPath\n                    height={height}\n                    uuid={uuid}\n                    shouldShowRoundImage={shouldShowRoundImage}\n                />\n            )}\n\n            {imageElements}\n\n            {hasCornerImage && (\n                <StyledCornerImage\n                    $background={imageBackground}\n                    $shouldPreventBackground={shouldPreventBackground}\n                    $hasMultipleImages={hasMultipleImages}\n                    src={cornerImageDisplayUrl}\n                    key=\"corner-image\"\n                />\n            )}\n            {hasCornerElement && <StyledCornerElement>{cornerElement}</StyledCornerElement>}\n        </StyledGroupedImage>\n    );\n};\n\nGroupedImage.displayName = 'GroupedImage';\n\nexport default GroupedImage;\n"],"mappings":"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","ignoreList":[]}

package/lib/esm/components/skeleton/base-skeleton/BaseSkeleton.js.map

@@ -1 +1 @@
-{"version":3,"file":"BaseSkeleton.js","names":["React","forwardRef","StyledBaseSkeleton","StyledMotionBaseSkeletonPulse","StyledMotionBaseSkeletonShimmer","SkeletonAnimationType","useSkeletonAnimation","useSkeletonContext","BaseSkeleton","baseColor","highlightColor","animationType","height","style","width","className","borderRadius","as","children","ref","values","animationStyle","resolvedAnimationType","createElement","$backgroundColor","$borderRadius","$height","$width","$shouldUseNativeTag","SHIMMER","$color","PULSE","displayName"],"sources":["../../../../../src/components/skeleton/base-skeleton/BaseSkeleton.tsx"],"sourcesContent":["import React, { forwardRef, ReactHTML, ReactNode } from 'react';\nimport {\n    StyledBaseSkeleton,\n    StyledMotionBaseSkeletonPulse,\n    StyledMotionBaseSkeletonShimmer,\n} from './BaseSkeleton.styles';\nimport { BaseSkeletonConfig, SkeletonAnimationType } from '../types';\nimport { useSkeletonAnimation, useSkeletonContext } from '../skeleton-provider/SkeletonProvider';\n\nexport interface BaseSkeletonProps extends BaseSkeletonConfig {\n    width: number | string;\n    height: number | string;\n    as?: keyof ReactHTML;\n    children?: ReactNode;\n}\n\nexport const BaseSkeleton = forwardRef<HTMLDivElement, BaseSkeletonProps>(\n    (\n        {\n            baseColor,\n            highlightColor,\n            animationType,\n            height,\n            style,\n            width,\n            className,\n            borderRadius,\n            as,\n            children,\n        },\n        ref,\n    ) => {\n        const values = useSkeletonContext();\n        const animationStyle = useSkeletonAnimation();\n\n        const resolvedAnimationType = animationType ?? values.animationType;\n\n        return (\n            <StyledBaseSkeleton\n                as={as}\n                ref={ref}\n                className={className}\n                style={style}\n                $backgroundColor={baseColor ?? values.baseColor}\n                $borderRadius={borderRadius ?? values.borderRadius}\n                $height={height}\n                $width={width}\n                $shouldUseNativeTag={!!as}\n            >\n                {resolvedAnimationType === SkeletonAnimationType.SHIMMER && (\n                    <StyledMotionBaseSkeletonShimmer\n                        $color={highlightColor ?? values.highlightColor}\n                        style={animationStyle}\n                    />\n                )}\n                {resolvedAnimationType === SkeletonAnimationType.PULSE && (\n                    <StyledMotionBaseSkeletonPulse\n                        $color={highlightColor ?? values.highlightColor}\n                        style={animationStyle}\n                    />\n                )}\n                {children}\n            </StyledBaseSkeleton>\n        );\n    },\n);\n\nBaseSkeleton.displayName = 'BaseSkeleton';\n\nexport default BaseSkeleton;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,UAAU,QAA8B,OAAO;AAC/D,SACIC,kBAAkB,EAClBC,6BAA6B,EAC7BC,+BAA+B,QAC5B,uBAAuB;AAC9B,SAA6BC,qBAAqB,QAAQ,UAAU;AACpE,SAASC,oBAAoB,EAAEC,kBAAkB,QAAQ,uCAAuC;AAShG,OAAO,MAAMC,YAAY,gBAAGP,UAAU,CAClC,CACI;EACIQ,SAAS;EACTC,cAAc;EACdC,aAAa;EACbC,MAAM;EACNC,KAAK;EACLC,KAAK;EACLC,SAAS;EACTC,YAAY;EACZC,EAAE;EACFC;AACJ,CAAC,EACDC,GAAG,KACF;EACD,MAAMC,MAAM,GAAGb,kBAAkB,CAAC,CAAC;EACnC,MAAMc,cAAc,GAAGf,oBAAoB,CAAC,CAAC;EAE7C,MAAMgB,qBAAqB,GAAGX,aAAa,IAAIS,MAAM,CAACT,aAAa;EAEnE,oBACIX,KAAA,CAAAuB,aAAA,CAACrB,kBAAkB;IACfe,EAAE,EAAEA,EAAG;IACPE,GAAG,EAAEA,GAAI;IACTJ,SAAS,EAAEA,SAAU;IACrBF,KAAK,EAAEA,KAAM;IACbW,gBAAgB,EAAEf,SAAS,IAAIW,MAAM,CAACX,SAAU;IAChDgB,aAAa,EAAET,YAAY,IAAII,MAAM,CAACJ,YAAa;IACnDU,OAAO,EAAEd,MAAO;IAChBe,MAAM,EAAEb,KAAM;IACdc,mBAAmB,EAAE,CAAC,CAACX;EAAG,GAEzBK,qBAAqB,KAAKjB,qBAAqB,CAACwB,OAAO,iBACpD7B,KAAA,CAAAuB,aAAA,CAACnB,+BAA+B;IAC5B0B,MAAM,EAAEpB,cAAc,IAAIU,MAAM,CAACV,cAAe;IAChDG,KAAK,EAAEQ;EAAe,CACzB,CACJ,EACAC,qBAAqB,KAAKjB,qBAAqB,CAAC0B,KAAK,iBAClD/B,KAAA,CAAAuB,aAAA,CAACpB,6BAA6B;IAC1B2B,MAAM,EAAEpB,cAAc,IAAIU,MAAM,CAACV,cAAe;IAChDG,KAAK,EAAEQ;EAAe,CACzB,CACJ,EACAH,QACe,CAAC;AAE7B,CACJ,CAAC;AAEDV,YAAY,CAACwB,WAAW,GAAG,cAAc;AAEzC,eAAexB,YAAY","ignoreList":[]}
+{"version":3,"file":"BaseSkeleton.js","names":["React","forwardRef","StyledBaseSkeleton","StyledMotionBaseSkeletonPulse","StyledMotionBaseSkeletonShimmer","SkeletonAnimationType","useSkeletonAnimation","useSkeletonContext","BaseSkeleton","baseColor","highlightColor","animationType","height","style","width","className","borderRadius","as","children","ref","values","animationStyle","resolvedAnimationType","createElement","$backgroundColor","$borderRadius","$height","$width","$shouldUseNativeTag","SHIMMER","$color","PULSE","displayName"],"sources":["../../../../../src/components/skeleton/base-skeleton/BaseSkeleton.tsx"],"sourcesContent":["import React, { forwardRef, ReactNode, type JSX } from 'react';\nimport {\n    StyledBaseSkeleton,\n    StyledMotionBaseSkeletonPulse,\n    StyledMotionBaseSkeletonShimmer,\n} from './BaseSkeleton.styles';\nimport { BaseSkeletonConfig, SkeletonAnimationType } from '../types';\nimport { useSkeletonAnimation, useSkeletonContext } from '../skeleton-provider/SkeletonProvider';\n\nexport interface BaseSkeletonProps extends BaseSkeletonConfig {\n    width: number | string;\n    height: number | string;\n    as?: keyof JSX.IntrinsicElements;\n    children?: ReactNode;\n}\n\nexport const BaseSkeleton = forwardRef<HTMLDivElement, BaseSkeletonProps>(\n    (\n        {\n            baseColor,\n            highlightColor,\n            animationType,\n            height,\n            style,\n            width,\n            className,\n            borderRadius,\n            as,\n            children,\n        },\n        ref,\n    ) => {\n        const values = useSkeletonContext();\n        const animationStyle = useSkeletonAnimation();\n\n        const resolvedAnimationType = animationType ?? values.animationType;\n\n        return (\n            <StyledBaseSkeleton\n                as={as}\n                ref={ref}\n                className={className}\n                style={style}\n                $backgroundColor={baseColor ?? values.baseColor}\n                $borderRadius={borderRadius ?? values.borderRadius}\n                $height={height}\n                $width={width}\n                $shouldUseNativeTag={!!as}\n            >\n                {resolvedAnimationType === SkeletonAnimationType.SHIMMER && (\n                    <StyledMotionBaseSkeletonShimmer\n                        $color={highlightColor ?? values.highlightColor}\n                        style={animationStyle}\n                    />\n                )}\n                {resolvedAnimationType === SkeletonAnimationType.PULSE && (\n                    <StyledMotionBaseSkeletonPulse\n                        $color={highlightColor ?? values.highlightColor}\n                        style={animationStyle}\n                    />\n                )}\n                {children}\n            </StyledBaseSkeleton>\n        );\n    },\n);\n\nBaseSkeleton.displayName = 'BaseSkeleton';\n\nexport default BaseSkeleton;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,UAAU,QAA6B,OAAO;AAC9D,SACIC,kBAAkB,EAClBC,6BAA6B,EAC7BC,+BAA+B,QAC5B,uBAAuB;AAC9B,SAA6BC,qBAAqB,QAAQ,UAAU;AACpE,SAASC,oBAAoB,EAAEC,kBAAkB,QAAQ,uCAAuC;AAShG,OAAO,MAAMC,YAAY,gBAAGP,UAAU,CAClC,CACI;EACIQ,SAAS;EACTC,cAAc;EACdC,aAAa;EACbC,MAAM;EACNC,KAAK;EACLC,KAAK;EACLC,SAAS;EACTC,YAAY;EACZC,EAAE;EACFC;AACJ,CAAC,EACDC,GAAG,KACF;EACD,MAAMC,MAAM,GAAGb,kBAAkB,CAAC,CAAC;EACnC,MAAMc,cAAc,GAAGf,oBAAoB,CAAC,CAAC;EAE7C,MAAMgB,qBAAqB,GAAGX,aAAa,IAAIS,MAAM,CAACT,aAAa;EAEnE,oBACIX,KAAA,CAAAuB,aAAA,CAACrB,kBAAkB;IACfe,EAAE,EAAEA,EAAG;IACPE,GAAG,EAAEA,GAAI;IACTJ,SAAS,EAAEA,SAAU;IACrBF,KAAK,EAAEA,KAAM;IACbW,gBAAgB,EAAEf,SAAS,IAAIW,MAAM,CAACX,SAAU;IAChDgB,aAAa,EAAET,YAAY,IAAII,MAAM,CAACJ,YAAa;IACnDU,OAAO,EAAEd,MAAO;IAChBe,MAAM,EAAEb,KAAM;IACdc,mBAAmB,EAAE,CAAC,CAACX;EAAG,GAEzBK,qBAAqB,KAAKjB,qBAAqB,CAACwB,OAAO,iBACpD7B,KAAA,CAAAuB,aAAA,CAACnB,+BAA+B;IAC5B0B,MAAM,EAAEpB,cAAc,IAAIU,MAAM,CAACV,cAAe;IAChDG,KAAK,EAAEQ;EAAe,CACzB,CACJ,EACAC,qBAAqB,KAAKjB,qBAAqB,CAAC0B,KAAK,iBAClD/B,KAAA,CAAAuB,aAAA,CAACpB,6BAA6B;IAC1B2B,MAAM,EAAEpB,cAAc,IAAIU,MAAM,CAACV,cAAe;IAChDG,KAAK,EAAEQ;EAAe,CACzB,CACJ,EACAH,QACe,CAAC;AAE7B,CACJ,CAAC;AAEDV,YAAY,CAACwB,WAAW,GAAG,cAAc;AAEzC,eAAexB,YAAY","ignoreList":[]}

package/lib/types/components/combobox/ComboBox.types.d.ts

@@ -1,4 +1,4 @@
-import { ChangeEventHandler, CSSProperties, FocusEventHandler, ReactHTML, ReactNode } from 'react';
+import { ChangeEventHandler, CSSProperties, FocusEventHandler, ReactNode, type JSX } from 'react';
 import { CSSPropertiesWithVars } from 'styled-components/dist/types';
 import { DropdownDirection } from '../../types/dropdown';
 /**
@@ -38,7 +38,7 @@ export interface ComboBoxTextStyles {
     /**
      * The HTML tag that should be used for the text wrapper.
      */
-    tagName?: keyof ReactHTML;
+    tagName?: keyof JSX.IntrinsicElements;
     /**
      * Additional inline styles applied to the text wrapper.
      */

package/lib/types/components/skeleton/base-skeleton/BaseSkeleton.d.ts

@@ -1,9 +1,9 @@
-import React, { ReactHTML, ReactNode } from 'react';
+import React, { ReactNode, type JSX } from 'react';
 import { BaseSkeletonConfig } from '../types';
 export interface BaseSkeletonProps extends BaseSkeletonConfig {
     width: number | string;
     height: number | string;
-    as?: keyof ReactHTML;
+    as?: keyof JSX.IntrinsicElements;
     children?: ReactNode;
 }
 export declare const BaseSkeleton: React.ForwardRefExoticComponent<BaseSkeletonProps & React.RefAttributes<HTMLDivElement>>;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@chayns-components/core",
-    "version": "5.4.16",
+    "version": "5.4.18",
     "description": "A set of beautiful React components for developing your own applications with chayns.",
     "sideEffects": false,
     "browserslist": [
@@ -71,7 +71,7 @@
         "typescript": "^5.9.3"
     },
     "dependencies": {
-        "@chayns-components/textstring": "^5.4.16",
+        "@chayns-components/textstring": "^5.4.17",
         "@chayns/colors": "^2.0.2",
         "@chayns/uac-service": "~0.0.62",
         "clsx": "^2.1.1",
@@ -88,5 +88,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "14eafb6d12f36a1788ac032ed2dffa8e700b2cc9"
+    "gitHead": "299097370936bd0a7b1c8872ed479947b0c2c693"
 }