npm - @skodaflow/web-library - Versions diffs - 7.15.1 → 7.16.1 - Mend

@skodaflow/web-library 7.15.1 → 7.16.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (3915) hide show

package/cjs/organisms/cardOwnedVehicle/cardOwnedVehicleComponent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"cardOwnedVehicleComponent.js","sources":["../../../../../src/organisms/cardOwnedVehicle/cardOwnedVehicleComponent.tsx"],"sourcesContent":["import { FC } from 'react';\nimport { Indicator } from '../../components/indicator';\nimport { CardOwnedVehicleProps } from './cardOwnedVehicle';\nimport MenuCardComponent from '../common/menuCardComponent/menuCardComponent';\nimport ButtonCardComponent from '../common/buttonCardComponent/buttonCardComponent';\nimport { Card as MuiCard, CardProps as MuiCardProps, Theme, styled } from '@mui/material';\nimport { handleMaxChars } from '../../utils/utilities';\nimport ImageComponent from '../../components/common/imageComponent';\nimport { Label } from '@/src/components/label';\n\nexport const CardOwnedVehicleComponent: FC<CardOwnedVehicleProps> = ({\n label,\n labelVariant,\n vehicleName,\n equipment,\n vehicleStatus,\n vehicleStatusVariant,\n image,\n fallbackImage,\n altDescriptionImage,\n mandatoryButtonObject,\n optionalButtonObject,\n darkOpacityLayer,\n lightOpacityLayer,\n menuCardComponentProps,\n isMenuDropdown,\n vehicleSpecs,\n vehicleSpecsObject,\n isCompact,\n size,\n}) => {\n return (\n <CardOwnVehicleComponentStyled\n size={size}\n darkOpacityLayer={darkOpacityLayer}\n lightOpacityLayer={lightOpacityLayer}\n >\n <div className=\"CardImageOverlayTheme\"></div>\n <div className=\"ownedVehicleContainer\">\n <div className=\"ownedVehicleContainerContent\">\n <div className=\"vehicleTitleContainer\">\n {label &&\n (labelVariant === 'feature' ? (\n <Label type=\"feature\" className=\"CardImageLabelFeature\" variant=\"primary\">\n {handleMaxChars(label, 30)}\n </Label>\n ) : (\n <Label className=\"CardImageLabel\" label={handleMaxChars(label, 30)}></Label>\n ))}\n {vehicleName && (\n <h2 style={{ margin: 0 }} className=\"vehicleName\">\n {handleMaxChars(vehicleName, 20)}\n </h2>\n )}\n {equipment && (\n <h4 style={{ margin: 0 }} className=\"vehicleEquipment\">\n {handleMaxChars(equipment, 20)}\n </h4>\n )}\n {vehicleStatus && <Indicator className=\"disclamer\" label={vehicleStatus} color={vehicleStatusVariant} />}\n </div>\n <div className=\"ownedVehicleImage\">\n <ImageComponent image={image} alt={altDescriptionImage} fallbackImage={fallbackImage} />\n </div>\n <div className=\"ownedVehicleSpecsContainer\">\n <div className=\"ownedVehicleButtons\">\n {mandatoryButtonObject?.label && (\n <ButtonCardComponent\n className=\"button-component\"\n buttonObject={mandatoryButtonObject}\n compact={isCompact}\n />\n )}\n {optionalButtonObject?.label && (\n <ButtonCardComponent\n className=\"button-component\"\n buttonObject={optionalButtonObject}\n compact={isCompact}\n />\n )}\n </div>\n {vehicleSpecs && (\n <div className=\"ownedVehicleSpecs\">\n {vehicleSpecsObject.map((item) => {\n return (\n <div key={item.value}>\n {item.subtitle && <p>{item.subtitle}</p>}\n {item.value && (\n <p>\n <b>{item.value}</b>\n </p>\n )}\n </div>\n );\n })}\n </div>\n )}\n </div>\n {isMenuDropdown && <MenuCardComponent {...menuCardComponentProps} />}\n </div>\n </div>\n </CardOwnVehicleComponentStyled>\n );\n};\nexport default CardOwnedVehicleComponent;\n\nconst handleOpacity = (darkOpacityLayer?: string, lightOpacityLayer?: string): string => {\n let opacity = '';\n\n switch (lightOpacityLayer) {\n case 'opacity25':\n opacity = 'linear-gradient(269.68deg, rgba(255, 255, 255, 0) 0.28%, rgba(255, 255, 255, 0.25) 99.72%)';\n break;\n case 'opacity50':\n opacity = 'linear-gradient(269.68deg, rgba(255, 255, 255, 0) 0.28%, rgba(255, 255, 255, 0.5) 99.72%)';\n break;\n case 'opacity75':\n opacity = 'linear-gradient(269.68deg, rgba(255, 255, 255, 0) 0.28%, rgba(255, 255, 255, 0.75) 99.72%)';\n break;\n }\n switch (darkOpacityLayer) {\n case 'opacity25':\n opacity = 'linear-gradient(269.68deg, rgba(0, 0, 0, 0) 0.28%, rgba(0, 0, 0, 0.25) 99.72%)';\n break;\n case 'opacity50':\n opacity = 'linear-gradient(269.68deg, rgba(0, 0, 0, 0) 0.28%, rgba(0, 0, 0, 0.5) 99.72%)';\n break;\n case 'opacity75':\n opacity = 'linear-gradient(269.68deg, rgba(0, 0, 0, 0) 0.28%, rgba(0, 0, 0, 0.75) 99.72%)';\n break;\n }\n\n return opacity;\n};\n\nconst handleTextColor = (darkOpacityLayer?: string, lightOpacityLayer?: string, theme?: Theme): string => {\n let color = '';\n\n if (lightOpacityLayer !== 'opacity0' && darkOpacityLayer === 'opacity0') {\n color = theme.palette.onSurface.os900;\n }\n if (darkOpacityLayer !== 'opacity0') {\n color = theme.palette.onSurface.os0;\n } else color = theme.palette.onSurface.os900;\n\n return color;\n};\n\n/*\n @description cardOwnedVehicleComponent styling definition based on props\n */\nconst CardOwnVehicleComponentStyled = styled(MuiCard, {\n shouldForwardProp: (prop) => prop !== 'darkOpacityLayer' && prop !== 'lightOpacityLayer' && prop !== 'size',\n})<MuiCardProps & { darkOpacityLayer?: string; lightOpacityLayer?: string; size?: string }>(({ theme, ...props }) => {\n const opacityLayer = handleOpacity(props.darkOpacityLayer, props.lightOpacityLayer);\n const textColor = handleTextColor(props.darkOpacityLayer, props.lightOpacityLayer, theme);\n let style = {};\n style = {\n position: 'relative',\n width: '100%',\n padding: '24px',\n backgroundColor: theme.palette.transparent.primary,\n color: textColor,\n '& .ownedVehicleImage': {\n marginTop: '-45px',\n position: 'relative',\n [theme.breakpoints.up('md')]: {\n position: props.size === 'fixed' ? 'absolute' : 'relative',\n marginTop: props.size === 'fixed' ? 0 : '-45px',\n },\n\n zIndex: 0,\n width: '100%',\n height: '100%',\n display: 'flex',\n justifyContent: 'center',\n ' & > img': {\n minHeight: '176px',\n maxWidth: '100%',\n maxHeight: '100%',\n position: 'relative',\n objectFit: 'contain',\n },\n },\n '& .disclamer': {\n fontSize: '14px',\n lineHeight: '20px',\n marginTop: '4px',\n color: textColor,\n },\n '& .ownedVehicleContainer': {\n position: 'relative',\n height: '100%',\n width: '100%',\n },\n '& .ownedVehicleContainerContent': {\n overflow: 'hidden',\n height: '100%',\n width: '100%',\n display: 'flex',\n flexDirection: 'column',\n justifyContent: props.size === 'fixed' ? 'space-between' : 'normal',\n boxSizing: 'border-box',\n ' & > .vehicleTitleContainer': {\n zIndex: 2,\n width: '100%',\n '& > .vehicleName': {\n fontSize: '23px',\n [theme.breakpoints.up('md')]: {\n fontSize: '24px',\n },\n lineHeight: '28px',\n },\n '& > .vehicleEquipment': {\n fontSize: '16px',\n [theme.breakpoints.up('md')]: {\n fontSize: '18px',\n },\n lineHeight: '24px',\n },\n '& > .CardImageLabelFeature': {\n marginLeft: '0px !important',\n marginBottom: '8px',\n },\n '& > .CardImageLabel': {\n lineHeight: '12px !important',\n marginBottom: '8px',\n },\n },\n '& > .ownedVehicleSpecsContainer': {\n marginTop: '-25px',\n fontSize: '14px',\n lineHeight: '20px',\n display: 'flex',\n flexDirection: 'column-reverse',\n flexWrap: 'wrap-reverse',\n width: '100%',\n justifyContent: 'space-between',\n zIndex: 2,\n [theme.breakpoints.up('md')]: {\n flexDirection: 'row',\n marginTop: props.size === 'fixed' ? 0 : '-25px',\n },\n '& > .ownedVehicleButtons': {\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'end',\n flexWrap: 'wrap',\n gap: '12px 16px',\n marginTop: '8px',\n '& > .button-component': {\n width: '100%',\n [theme.breakpoints.up('md')]: {\n width: 'auto',\n padding: '0 0 2px 2px',\n },\n ' > div': {\n width: '100%',\n },\n },\n '& .MuiButton-root': {\n width: '100%',\n },\n [theme.breakpoints.up('md')]: {\n flexDirection: 'row',\n '& > a': {\n '& + a': {\n marginTop: '0',\n },\n },\n },\n },\n ' & > .ownedVehicleSpecs': {\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'end',\n marginBottom: theme.breakpoints.values.md ? 0 : '12px',\n\n ' & > div:first-of-type': {\n marginRight: '24px',\n },\n ' & > div > p': {\n margin: 0,\n },\n },\n },\n\n ' & >.menuCardComponent': {\n top: '-7px',\n right: '-5px',\n },\n },\n ' & >.CardImageOverlayTheme': {\n background: opacityLayer,\n },\n };\n\n return style;\n});\n"],"names":["CardOwnedVehicleComponent","label","labelVariant","vehicleName","equipment","vehicleStatus","vehicleStatusVariant","image","fallbackImage","altDescriptionImage","mandatoryButtonObject","optionalButtonObject","darkOpacityLayer","lightOpacityLayer","menuCardComponentProps","isMenuDropdown","vehicleSpecs","vehicleSpecsObject","isCompact","size","_jsxs","CardOwnVehicleComponentStyled","_jsx","className","children","Label","type","variant","handleMaxChars","style","margin","Indicator","color","ImageComponent","alt","ButtonCardComponent","buttonObject","compact","map","item","subtitle","value","MenuCardComponent","Object","assign","styled","MuiCard","shouldForwardProp","prop","_a","theme","props","__rest","opacityLayer","opacity","handleOpacity","textColor","palette","onSurface","os900","os0","handleTextColor","position","width","padding","backgroundColor","transparent","primary","marginTop","breakpoints","up","zIndex","height","display","justifyContent","minHeight","maxWidth","maxHeight","objectFit","fontSize","lineHeight","overflow","flexDirection","boxSizing","marginLeft","marginBottom","flexWrap","alignItems","gap","values","md","marginRight","top","right","background"],"mappings":"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"}
1	+ {"version":3,"file":"cardOwnedVehicleComponent.js","sources":["../../../../../src/organisms/cardOwnedVehicle/cardOwnedVehicleComponent.tsx"],"sourcesContent":["import { FC } from 'react';\nimport { Indicator } from '../../components/indicator';\nimport { CardOwnedVehicleProps } from './cardOwnedVehicle';\nimport MenuCardComponent from '../common/menuCardComponent/menuCardComponent';\nimport ButtonCardComponent from '../common/buttonCardComponent/buttonCardComponent';\nimport { Card as MuiCard, CardProps as MuiCardProps, Theme, styled } from '@mui/material';\nimport { handleMaxChars } from '../../utils/utilities';\nimport ImageComponent from '../../components/common/imageComponent';\nimport { Label } from '@/src/components/label';\n\nexport const CardOwnedVehicleComponent: FC<CardOwnedVehicleProps> = ({\n label,\n labelVariant,\n vehicleName,\n equipment,\n vehicleStatus,\n vehicleStatusVariant,\n image,\n fallbackImage,\n altDescriptionImage,\n mandatoryButtonObject,\n optionalButtonObject,\n darkOpacityLayer,\n lightOpacityLayer,\n menuCardComponentProps,\n isMenuDropdown,\n vehicleSpecs,\n vehicleSpecsObject,\n isCompact,\n size,\n}) => {\n return (\n <CardOwnVehicleComponentStyled\n size={size}\n darkOpacityLayer={darkOpacityLayer}\n lightOpacityLayer={lightOpacityLayer}\n >\n <div className=\"CardImageOverlayTheme\"></div>\n <div className=\"ownedVehicleContainer\">\n <div className=\"ownedVehicleContainerContent\">\n <div className=\"vehicleTitleContainer\">\n {label &&\n (labelVariant === 'feature' ? (\n <Label type=\"feature\" className=\"CardImageLabelFeature\" variant=\"primary\">\n {handleMaxChars(label, 30)}\n </Label>\n ) : (\n <Label className=\"CardImageLabel\" label={handleMaxChars(label, 30)}></Label>\n ))}\n {vehicleName && (\n <h2 style={{ margin: 0 }} className=\"vehicleName\">\n {handleMaxChars(vehicleName, 20)}\n </h2>\n )}\n {equipment && (\n <h4 style={{ margin: 0 }} className=\"vehicleEquipment\">\n {handleMaxChars(equipment, 20)}\n </h4>\n )}\n {vehicleStatus && <Indicator className=\"disclamer\" label={vehicleStatus} color={vehicleStatusVariant} />}\n </div>\n <div className=\"ownedVehicleImage\">\n <ImageComponent image={image} alt={altDescriptionImage} fallbackImage={fallbackImage} />\n </div>\n <div className=\"ownedVehicleSpecsContainer\">\n <div className=\"ownedVehicleButtons\">\n {mandatoryButtonObject?.label && (\n <ButtonCardComponent\n className=\"button-component\"\n buttonObject={mandatoryButtonObject}\n compact={isCompact}\n />\n )}\n {optionalButtonObject?.label && (\n <ButtonCardComponent\n className=\"button-component\"\n buttonObject={optionalButtonObject}\n compact={isCompact}\n />\n )}\n </div>\n {vehicleSpecs && (\n <div className=\"ownedVehicleSpecs\">\n {vehicleSpecsObject.map((item) => {\n return (\n <div key={item.value}>\n {item.subtitle && <p>{item.subtitle}</p>}\n {item.value && (\n <p>\n <b>{item.value}</b>\n </p>\n )}\n </div>\n );\n })}\n </div>\n )}\n </div>\n {isMenuDropdown && <MenuCardComponent {...menuCardComponentProps} />}\n </div>\n </div>\n </CardOwnVehicleComponentStyled>\n );\n};\nexport default CardOwnedVehicleComponent;\n\nconst handleOpacity = (darkOpacityLayer?: string, lightOpacityLayer?: string): string => {\n let opacity = '';\n\n switch (lightOpacityLayer) {\n case 'opacity25':\n opacity = 'linear-gradient(269.68deg, rgba(255, 255, 255, 0) 0.28%, rgba(255, 255, 255, 0.25) 99.72%)';\n break;\n case 'opacity50':\n opacity = 'linear-gradient(269.68deg, rgba(255, 255, 255, 0) 0.28%, rgba(255, 255, 255, 0.5) 99.72%)';\n break;\n case 'opacity75':\n opacity = 'linear-gradient(269.68deg, rgba(255, 255, 255, 0) 0.28%, rgba(255, 255, 255, 0.75) 99.72%)';\n break;\n }\n switch (darkOpacityLayer) {\n case 'opacity25':\n opacity = 'linear-gradient(269.68deg, rgba(0, 0, 0, 0) 0.28%, rgba(0, 0, 0, 0.25) 99.72%)';\n break;\n case 'opacity50':\n opacity = 'linear-gradient(269.68deg, rgba(0, 0, 0, 0) 0.28%, rgba(0, 0, 0, 0.5) 99.72%)';\n break;\n case 'opacity75':\n opacity = 'linear-gradient(269.68deg, rgba(0, 0, 0, 0) 0.28%, rgba(0, 0, 0, 0.75) 99.72%)';\n break;\n }\n\n return opacity;\n};\n\nconst handleTextColor = (darkOpacityLayer?: string, lightOpacityLayer?: string, theme?: Theme): string => {\n let color = '';\n\n if (lightOpacityLayer !== 'opacity0' && darkOpacityLayer === 'opacity0') {\n color = theme.palette.onSurface.os900;\n }\n if (darkOpacityLayer !== 'opacity0') {\n color = theme.palette.onSurface.os0;\n } else color = theme.palette.onSurface.os900;\n\n return color;\n};\n\n/*\n @description cardOwnedVehicleComponent styling definition based on props\n */\nconst CardOwnVehicleComponentStyled = styled(MuiCard, {\n shouldForwardProp: (prop) => prop !== 'darkOpacityLayer' && prop !== 'lightOpacityLayer' && prop !== 'size',\n})<MuiCardProps & { darkOpacityLayer?: string; lightOpacityLayer?: string; size?: string }>(({ theme, ...props }) => {\n const opacityLayer = handleOpacity(props.darkOpacityLayer, props.lightOpacityLayer);\n const textColor = handleTextColor(props.darkOpacityLayer, props.lightOpacityLayer, theme);\n let style = {};\n style = {\n position: 'relative',\n width: '100%',\n padding: '24px',\n backgroundColor: theme.palette.transparent.primary,\n color: textColor,\n '& .ownedVehicleImage': {\n marginTop: '-45px',\n position: 'relative',\n [theme.breakpoints.up('md')]: {\n position: props.size === 'fixed' ? 'absolute' : 'relative',\n marginTop: props.size === 'fixed' ? 0 : '-45px',\n },\n\n zIndex: 0,\n width: '100%',\n height: '100%',\n display: 'flex',\n justifyContent: 'center',\n ' & > img': {\n minHeight: '176px',\n maxWidth: '100%',\n maxHeight: '100%',\n position: 'relative',\n objectFit: 'contain',\n },\n },\n '& .disclamer': {\n fontSize: '14px',\n lineHeight: '20px',\n marginTop: '4px',\n color: textColor,\n },\n '& .ownedVehicleContainer': {\n position: 'relative',\n height: '100%',\n width: '100%',\n },\n '& .ownedVehicleContainerContent': {\n overflow: 'hidden',\n height: '100%',\n width: '100%',\n display: 'flex',\n flexDirection: 'column',\n justifyContent: props.size === 'fixed' ? 'space-between' : 'normal',\n boxSizing: 'border-box',\n ' & > .vehicleTitleContainer': {\n zIndex: 2,\n width: '100%',\n '& > .vehicleName': {\n fontSize: '23px',\n [theme.breakpoints.up('md')]: {\n fontSize: '24px',\n },\n lineHeight: '28px',\n },\n '& > .vehicleEquipment': {\n fontSize: '16px',\n [theme.breakpoints.up('md')]: {\n fontSize: '18px',\n },\n lineHeight: '24px',\n },\n '& > .CardImageLabelFeature': {\n marginLeft: '0px !important',\n marginBottom: '8px',\n },\n '& > .CardImageLabel': {\n lineHeight: '12px !important',\n marginBottom: '8px',\n },\n },\n '& > .ownedVehicleSpecsContainer': {\n marginTop: '-25px',\n fontSize: '14px',\n lineHeight: '20px',\n display: 'flex',\n flexDirection: 'column-reverse',\n flexWrap: 'wrap-reverse',\n width: '100%',\n justifyContent: 'space-between',\n zIndex: 2,\n [theme.breakpoints.up('md')]: {\n flexDirection: 'row',\n marginTop: props.size === 'fixed' ? 0 : '-25px',\n },\n '& > .ownedVehicleButtons': {\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'end',\n flexWrap: 'wrap',\n gap: '12px 16px',\n marginTop: '8px',\n '& > .button-component': {\n width: '100%',\n [theme.breakpoints.up('md')]: {\n width: 'auto',\n padding: '0 0 2px 2px',\n },\n ' > div': {\n width: '100%',\n },\n },\n '& .MuiButton-root': {\n width: '100%',\n },\n [theme.breakpoints.up('md')]: {\n flexDirection: 'row',\n '& > a': {\n '& + a': {\n marginTop: '0',\n },\n },\n },\n },\n ' & > .ownedVehicleSpecs': {\n display: 'flex',\n flexDirection: 'row',\n alignItems: 'end',\n marginBottom: theme.breakpoints.values.md ? 0 : '12px',\n\n ' & > div:first-of-type': {\n marginRight: '24px',\n },\n ' & > div > p': {\n margin: 0,\n },\n },\n },\n\n ' & >.menuCardComponent': {\n top: '-7px',\n right: '-5px',\n },\n },\n ' & >.CardImageOverlayTheme': {\n background: opacityLayer,\n },\n };\n\n return style;\n});\n"],"names":["CardOwnedVehicleComponent","label","labelVariant","vehicleName","equipment","vehicleStatus","vehicleStatusVariant","image","fallbackImage","altDescriptionImage","mandatoryButtonObject","optionalButtonObject","darkOpacityLayer","lightOpacityLayer","menuCardComponentProps","isMenuDropdown","vehicleSpecs","vehicleSpecsObject","isCompact","size","_jsxs","CardOwnVehicleComponentStyled","_jsx","className","children","Label","type","variant","handleMaxChars","style","margin","Indicator","color","ImageComponent","alt","ButtonCardComponent","buttonObject","compact","map","item","subtitle","value","MenuCardComponent","Object","assign","styled","MuiCard","shouldForwardProp","prop","_a","theme","props","__rest","opacityLayer","opacity","handleOpacity","textColor","palette","onSurface","os900","os0","handleTextColor","position","width","padding","backgroundColor","transparent","primary","marginTop","breakpoints","up","zIndex","height","display","justifyContent","minHeight","maxWidth","maxHeight","objectFit","fontSize","lineHeight","overflow","flexDirection","boxSizing","marginLeft","marginBottom","flexWrap","alignItems","gap","values","md","marginRight","top","right","background"],"mappings":"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"}

package/cjs/organisms/cardPhotoAdjustable/cardPhotoAdjustable.js CHANGED Viewed

@@ -1,4 +1,4 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("react"),i=require("@mui/material"),a=require("./cardPhotoAdjustableComponent.js"),r=require("../../utils/utilities.js");const o=t.forwardRef(((t,i)=>e.jsx(n,{ref:i,children:e.jsx(a.default,Object.assign({},t))}))),n=i.styled(i.Card)`
+"use strict";var e=require("react/jsx-runtime"),t=require("react"),i=require("@mui/material"),a=require("./cardPhotoAdjustableComponent.js"),r=require("../../utils/utilities.js");const o=t.forwardRef((t,i)=>e.jsx(n,{ref:i,children:e.jsx(a.default,Object.assign({},t))})),n=i.styled(i.Card)`
   height: ${e=>{switch(e.children.props.heightSize){case"small":return"180px";case"medium":case"normal":return"400px";default:return""}}};
   @media (min-width: ${e=>e.theme.breakpoints.values.sm}px) {

package/cjs/organisms/cardPhotoAdjustable/cardPhotoAdjustable.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"cardPhotoAdjustable.js","sources":["../../../../../src/organisms/cardPhotoAdjustable/cardPhotoAdjustable.tsx"],"sourcesContent":["import React, { HTMLAttributes, forwardRef } from 'react';\nimport { Card as MuiCard, CardProps as MuiCardProps, styled } from '@mui/material';\nimport CardPhotoFixedComponent from './cardPhotoAdjustableComponent';\nimport { DarkOpacity, LightOpacity } from '../common/cardOpacitylayer/cardOpacityTyping';\nimport { ButtonVariants } from '../..';\nimport { opacityLayerSwitchDarkStatement, opacityLayerSwitchLightStatement } from '../../utils/utilities';\n/*\n @interface ChipProps\n * @description Base definition of SkodaFlow Chip independent on core implementation.\n * Properties are inherited from HTML div element\n /\nexport interface CardPhotoAdjustableProps extends HTMLAttributes<HTMLDivElement> {\n /\n Label text\n /\n labelText?: string;\n\n /\n If labelVariant is feature, it is possible to select a variant of the Feature Label\n /\n labelVariants?: 'primary' \| 'neutral' \| 'secondary';\n\n /\n Title text\n /\n title?: string;\n\n /\n Description text\n /\n subtitle?: string;\n\n /\n Mandatory Button link.\n /\n buttonLink?: string;\n\n /\n Mandatory Button label\n /\n buttonLabel?: string;\n\n /\n Mandatory Button variant.\n /\n buttonVariant?: ButtonVariants;\n\n /\n If true, button is showing\n /\n optionalButton?: boolean;\n\n /\n Optional Button label. Button displays only if it has a label text\n /\n optionalButtonLabel?: string;\n\n /\n Optional Button link.\n /\n optionalButtonLink?: string;\n\n /\n Optional Button variant.\n /\n optionalButtonVariant?: ButtonVariants;\n\n /\n Height of the component\n /\n heightSize?: 'small' \| 'medium' \| 'normal';\n\n /\n If true borderRadius was added to entire card\n /\n isBorderRadius?: boolean;\n\n /\n An image of the component\n /\n cardImage?: string;\n\n /\n alt HTML tag apply to the image\n /\n altImageDescription?: string;\n\n /\n A dark gradient layer was added\n /\n darkOpacity?: DarkOpacity;\n\n /\n A light gradient layer was added\n /\n lightOpacity?: LightOpacity;\n\n /\n Callback for analytics\n /\n analyticsCallback?: (payload?: any) => void;\n}\n\n/\n @description SkodaFlow CardPhotoFixed component.\n * Properties are inherited from HTML Div element.\n * @param props CardPhotoFixedProps\n * @returns React Functional Component\n * @deprecated\n /\nexport const CardPhotoAdjustable = forwardRef<HTMLDivElement, CardPhotoAdjustableProps>((props, ref) => {\n return (\n <CardPhotoAdjustableStyled ref={ref}>\n <CardPhotoFixedComponent {...props} />\n </CardPhotoAdjustableStyled>\n );\n});\n\n/\n @description Card Photo Fixed styling definition based on props\n */\n\nconst CardPhotoAdjustableStyled = styled(MuiCard)<MuiCardProps & { children?: any; theme?: any }>`\n height: ${(props) => {\n switch (props.children.props.heightSize) {\n case 'small':\n return '180px';\n\n case 'medium':\n return '400px';\n\n case 'normal':\n return '400px';\n\n default:\n return '';\n }\n }};\n\n @media (min-width: ${(props) => props.theme.breakpoints.values.sm}px) {\n height: ${(props) => {\n switch (props.children.props.heightSize) {\n case 'small':\n return '150px';\n\n case 'medium':\n return '240px';\n\n case 'normal':\n return '300px';\n\n default:\n return '';\n }\n }};\n }\n\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n height: ${(props) => {\n switch (props.children.props.heightSize) {\n case 'small':\n return '200px';\n\n case 'medium':\n return '300px';\n\n case 'normal':\n return '400px';\n\n default:\n return '';\n }\n }};\n }\n\n padding: 0;\n .CardImagePicture {\n display: block;\n }\n background-color: ${(props) => {\n return props.theme.palette.onSurface.os0;\n }};\n\n color: ${(props) => {\n if (\n (props.children.props.lightOpacity !== 'opacity0' && props.children.props.darkOpacity === 'opacity0') \|\|\n props.children.props.cardType === 'configurator'\n ) {\n return props.theme.palette.text.primary;\n }\n if (props.children.props.darkOpacity !== 'opacity0' && props.children.props.cardType === 'configurator') {\n return props.theme.palette.onSurface.os0;\n } else return props.theme.palette.onSurface.os0;\n }};\n ${(props) => {\n if (props.theme.shape.borderRadius) {\n return 'border-radius: 0;';\n }\n }}\n\n ${(props) => {\n if (props.children.props.isBorderRadius) {\n return 'border-radius: 8px;';\n }\n }}\n\n\t.CardImageHeader {\n width: 100%;\n }\n .CardImageHeader {\n .Label {\n margin: 0;\n }\n color: ${(props) => {\n if (props.children.props.lightOpacity !== 'opacity0' && props.children.props.darkOpacity === 'opacity0') {\n return props.theme.palette.text.primary;\n }\n if (props.children.props.darkOpacity !== 'opacity0') {\n return props.theme.palette.onSurface.os0;\n }\n }};\n }\n .CardImageMedia {\n position: relative;\n height: auto;\n }\n .CardImageTextContainer {\n padding: 24px;\n display: flex;\n justify-content: space-between;\n flex-direction: column;\n height: 100%;\n width: 100%;\n box-sizing: border-box;\n }\n .CardImageText {\n position: absolute;\n .CardImageSubtitle {\n font-weight: bold;\n font-size: 16px;\n line-height: 24px;\n @media (min-width: ${(props) => props.theme.breakpoints.values.lg}px) {\n font-size: 18px;\n line-height: 28px;\n }\n }\n .CardImageTitle {\n font-size: 27px;\n line-height: 32px;\n @media (min-width: ${(props) => props.theme.breakpoints.values.xl}px) {\n font-size: 30px;\n line-height: 36px;\n }\n }\n }\n .CardImageButtonsContainerContent {\n display: flex;\n justify-content: space-between;\n width: 100%;\n flex-direction: column-reverse;\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n flex-direction: row;\n }\n }\n .CardImageButtonsContainer {\n display: flex;\n justify-content: space-between;\n width: 100%;\n }\n .CardImageButtons {\n gap: 12px 16px;\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n flex-direction: row;\n flex-wrap: wrap;\n }\n .cta-button {\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n width: auto;\n }\n }\n .cta-button button {\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n width: auto;\n font-size: 14px;\n }\n }\n }\n .LabelsOptional {\n display: flex;\n flex-wrap: wrap;\n margin-top: 8px;\n span:first-of-type {\n margin-bottom: 4px;\n }\n @media (min-width: ${(props) => props.theme.breakpoints.values.sm}px) {\n span:first-of-type {\n margin-bottom: 0;\n }\n }\n }\n .InfoVehicle {\n font-size: 14px;\n line-height: 20px;\n margin-bottom: 12px;\n text-align: left;\n width: 100%;\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n margin-bottom: 0;\n text-align: right;\n }\n margin-bottom: 16px;\n .InfoVehicleTotal {\n font-weight: bold;\n }\n .infoVehicleDealerInfoContainer {\n display: inline-flex;\n width: 100%;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n @media (min-width: ${(props) => props.theme.breakpoints.values.sm}px) {\n text-align: right;\n margin-bottom: 0;\n width: auto;\n }\n }\n .infoVehicleDealerInfo {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n .CardImageOverlayTheme {\n ${(props) => {\n return opacityLayerSwitchLightStatement(props.children.props.lightOpacity, 'background');\n }};\n\n ${(props) => {\n return opacityLayerSwitchDarkStatement(props.children.props.darkOpacity, 'background');\n }}\n }\n`;\n"],"names":["CardPhotoAdjustable","forwardRef","props","ref","_jsx","CardPhotoAdjustableStyled","children","CardPhotoFixedComponent","Object","assign","styled","MuiCard","heightSize","theme","breakpoints","values","sm","md","palette","onSurface","os0","lightOpacity","darkOpacity","cardType","text","primary","shape","borderRadius","isBorderRadius","lg","xl","opacityLayerSwitchLightStatement","opacityLayerSwitchDarkStatement"],"mappings":"mLA8GO,MAAMA,EAAsBC,EAAAA,YAAqD,CAACC,EAAOC,IAE5FC,EAAAA,IAACC,EAAyB,CAACF,IAAKA,EAAGG,SACjCF,EAAAA,IAACG,EAAAA,QAAuBC,OAAAC,OAAA,CAAA,EAAKP,QAS7BG,EAA4BK,EAAAA,OAAOC,EAAAA,KAAwD;YACpFT,IACT,OAAQA,EAAMI,SAASJ,MAAMU,YAC3B,IAAK,QACH,MAAO,QAET,IAAK,SAGL,IAAK,SACH,MAAO,QAET,QACE,MAAO;;uBAISV,GAAUA,EAAMW,MAAMC,YAAYC,OAAOC;cAClDd,IACT,OAAQA,EAAMI,SAASJ,MAAMU,YAC3B,IAAK,QACH,MAAO,QAET,IAAK,SACH,MAAO,QAET,IAAK,SACH,MAAO,QAET,QACE,MAAO;;;uBAKOV,GAAUA,EAAMW,MAAMC,YAAYC,OAAOE;cAClDf,IACT,OAAQA,EAAMI,SAASJ,MAAMU,YAC3B,IAAK,QACH,MAAO,QAET,IAAK,SACH,MAAO,QAET,IAAK,SACH,MAAO,QAET,QACE,MAAO;;;;;;;sBASMV,GACZA,EAAMW,MAAMK,QAAQC,UAAUC;;WAG7BlB,GAEiC,aAAtCA,EAAMI,SAASJ,MAAMmB,cAAoE,aAArCnB,EAAMI,SAASJ,MAAMoB,aACxC,iBAAlCpB,EAAMI,SAASJ,MAAMqB,SAEdrB,EAAMW,MAAMK,QAAQM,KAAKC,SAEO,aAArCvB,EAAMI,SAASJ,MAAMoB,aAA8BpB,EAAMI,SAASJ,MAAMqB,SACnErB,EAAMW,MAAMK,QAAQC,UAAUC;IAGtClB,IACD,GAAIA,EAAMW,MAAMa,MAAMC,aACpB,MAAO,mBACT;;IAGCzB,IACD,GAAIA,EAAMI,SAASJ,MAAM0B,eACvB,MAAO,qBACT;;;;;;;;;aAUU1B,GACkC,aAAtCA,EAAMI,SAASJ,MAAMmB,cAAoE,aAArCnB,EAAMI,SAASJ,MAAMoB,YACpEpB,EAAMW,MAAMK,QAAQM,KAAKC,QAEO,aAArCvB,EAAMI,SAASJ,MAAMoB,YAChBpB,EAAMW,MAAMK,QAAQC,UAAUC,SADvC;;;;;;;;;;;;;;;;;;;;;2BAwBsBlB,GAAUA,EAAMW,MAAMC,YAAYC,OAAOc;;;;;;;;2BAQzC3B,GAAUA,EAAMW,MAAMC,YAAYC,OAAOe;;;;;;;;;;;yBAW3C5B,GAAUA,EAAMW,MAAMC,YAAYC,OAAOE;;;;;;;;;;;yBAWzCf,GAAUA,EAAMW,MAAMC,YAAYC,OAAOE;;;;;2BAKvCf,GAAUA,EAAMW,MAAMC,YAAYC,OAAOE;;;;;2BAKzCf,GAAUA,EAAMW,MAAMC,YAAYC,OAAOE;;;;;;;;;;;;;yBAa3Cf,GAAUA,EAAMW,MAAMC,YAAYC,OAAOC;;;;;;;;;;;;yBAYzCd,GAAUA,EAAMW,MAAMC,YAAYC,OAAOE;;;;;;;;;;;;;;2BAcvCf,GAAUA,EAAMW,MAAMC,YAAYC,OAAOC;;;;;;;;;;;;;MAa9Dd,GACM6B,EAAAA,iCAAiC7B,EAAMI,SAASJ,MAAMmB,aAAc;;MAG1EnB,GACM8B,EAAAA,gCAAgC9B,EAAMI,SAASJ,MAAMoB,YAAa;;"}
1	+ {"version":3,"file":"cardPhotoAdjustable.js","sources":["../../../../../src/organisms/cardPhotoAdjustable/cardPhotoAdjustable.tsx"],"sourcesContent":["import React, { HTMLAttributes, forwardRef } from 'react';\nimport { Card as MuiCard, CardProps as MuiCardProps, styled } from '@mui/material';\nimport CardPhotoFixedComponent from './cardPhotoAdjustableComponent';\nimport { DarkOpacity, LightOpacity } from '../common/cardOpacitylayer/cardOpacityTyping';\nimport { ButtonVariants } from '../..';\nimport { opacityLayerSwitchDarkStatement, opacityLayerSwitchLightStatement } from '../../utils/utilities';\n/*\n @interface ChipProps\n * @description Base definition of SkodaFlow Chip independent on core implementation.\n * Properties are inherited from HTML div element\n /\nexport interface CardPhotoAdjustableProps extends HTMLAttributes<HTMLDivElement> {\n /\n Label text\n /\n labelText?: string;\n\n /\n If labelVariant is feature, it is possible to select a variant of the Feature Label\n /\n labelVariants?: 'primary' \| 'neutral' \| 'secondary';\n\n /\n Title text\n /\n title?: string;\n\n /\n Description text\n /\n subtitle?: string;\n\n /\n Mandatory Button link.\n /\n buttonLink?: string;\n\n /\n Mandatory Button label\n /\n buttonLabel?: string;\n\n /\n Mandatory Button variant.\n /\n buttonVariant?: ButtonVariants;\n\n /\n If true, button is showing\n /\n optionalButton?: boolean;\n\n /\n Optional Button label. Button displays only if it has a label text\n /\n optionalButtonLabel?: string;\n\n /\n Optional Button link.\n /\n optionalButtonLink?: string;\n\n /\n Optional Button variant.\n /\n optionalButtonVariant?: ButtonVariants;\n\n /\n Height of the component\n /\n heightSize?: 'small' \| 'medium' \| 'normal';\n\n /\n If true borderRadius was added to entire card\n /\n isBorderRadius?: boolean;\n\n /\n An image of the component\n /\n cardImage?: string;\n\n /\n alt HTML tag apply to the image\n /\n altImageDescription?: string;\n\n /\n A dark gradient layer was added\n /\n darkOpacity?: DarkOpacity;\n\n /\n A light gradient layer was added\n /\n lightOpacity?: LightOpacity;\n\n /\n Callback for analytics\n /\n analyticsCallback?: (payload?: any) => void;\n}\n\n/\n @description SkodaFlow CardPhotoFixed component.\n * Properties are inherited from HTML Div element.\n * @param props CardPhotoFixedProps\n * @returns React Functional Component\n * @deprecated\n /\nexport const CardPhotoAdjustable = forwardRef<HTMLDivElement, CardPhotoAdjustableProps>((props, ref) => {\n return (\n <CardPhotoAdjustableStyled ref={ref}>\n <CardPhotoFixedComponent {...props} />\n </CardPhotoAdjustableStyled>\n );\n});\n\n/\n @description Card Photo Fixed styling definition based on props\n */\n\nconst CardPhotoAdjustableStyled = styled(MuiCard)<MuiCardProps & { children?: any; theme?: any }>`\n height: ${(props) => {\n switch (props.children.props.heightSize) {\n case 'small':\n return '180px';\n\n case 'medium':\n return '400px';\n\n case 'normal':\n return '400px';\n\n default:\n return '';\n }\n }};\n\n @media (min-width: ${(props) => props.theme.breakpoints.values.sm}px) {\n height: ${(props) => {\n switch (props.children.props.heightSize) {\n case 'small':\n return '150px';\n\n case 'medium':\n return '240px';\n\n case 'normal':\n return '300px';\n\n default:\n return '';\n }\n }};\n }\n\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n height: ${(props) => {\n switch (props.children.props.heightSize) {\n case 'small':\n return '200px';\n\n case 'medium':\n return '300px';\n\n case 'normal':\n return '400px';\n\n default:\n return '';\n }\n }};\n }\n\n padding: 0;\n .CardImagePicture {\n display: block;\n }\n background-color: ${(props) => {\n return props.theme.palette.onSurface.os0;\n }};\n\n color: ${(props) => {\n if (\n (props.children.props.lightOpacity !== 'opacity0' && props.children.props.darkOpacity === 'opacity0') \|\|\n props.children.props.cardType === 'configurator'\n ) {\n return props.theme.palette.text.primary;\n }\n if (props.children.props.darkOpacity !== 'opacity0' && props.children.props.cardType === 'configurator') {\n return props.theme.palette.onSurface.os0;\n } else return props.theme.palette.onSurface.os0;\n }};\n ${(props) => {\n if (props.theme.shape.borderRadius) {\n return 'border-radius: 0;';\n }\n }}\n\n ${(props) => {\n if (props.children.props.isBorderRadius) {\n return 'border-radius: 8px;';\n }\n }}\n\n\t.CardImageHeader {\n width: 100%;\n }\n .CardImageHeader {\n .Label {\n margin: 0;\n }\n color: ${(props) => {\n if (props.children.props.lightOpacity !== 'opacity0' && props.children.props.darkOpacity === 'opacity0') {\n return props.theme.palette.text.primary;\n }\n if (props.children.props.darkOpacity !== 'opacity0') {\n return props.theme.palette.onSurface.os0;\n }\n }};\n }\n .CardImageMedia {\n position: relative;\n height: auto;\n }\n .CardImageTextContainer {\n padding: 24px;\n display: flex;\n justify-content: space-between;\n flex-direction: column;\n height: 100%;\n width: 100%;\n box-sizing: border-box;\n }\n .CardImageText {\n position: absolute;\n .CardImageSubtitle {\n font-weight: bold;\n font-size: 16px;\n line-height: 24px;\n @media (min-width: ${(props) => props.theme.breakpoints.values.lg}px) {\n font-size: 18px;\n line-height: 28px;\n }\n }\n .CardImageTitle {\n font-size: 27px;\n line-height: 32px;\n @media (min-width: ${(props) => props.theme.breakpoints.values.xl}px) {\n font-size: 30px;\n line-height: 36px;\n }\n }\n }\n .CardImageButtonsContainerContent {\n display: flex;\n justify-content: space-between;\n width: 100%;\n flex-direction: column-reverse;\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n flex-direction: row;\n }\n }\n .CardImageButtonsContainer {\n display: flex;\n justify-content: space-between;\n width: 100%;\n }\n .CardImageButtons {\n gap: 12px 16px;\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n flex-direction: row;\n flex-wrap: wrap;\n }\n .cta-button {\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n width: auto;\n }\n }\n .cta-button button {\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n width: auto;\n font-size: 14px;\n }\n }\n }\n .LabelsOptional {\n display: flex;\n flex-wrap: wrap;\n margin-top: 8px;\n span:first-of-type {\n margin-bottom: 4px;\n }\n @media (min-width: ${(props) => props.theme.breakpoints.values.sm}px) {\n span:first-of-type {\n margin-bottom: 0;\n }\n }\n }\n .InfoVehicle {\n font-size: 14px;\n line-height: 20px;\n margin-bottom: 12px;\n text-align: left;\n width: 100%;\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n margin-bottom: 0;\n text-align: right;\n }\n margin-bottom: 16px;\n .InfoVehicleTotal {\n font-weight: bold;\n }\n .infoVehicleDealerInfoContainer {\n display: inline-flex;\n width: 100%;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n @media (min-width: ${(props) => props.theme.breakpoints.values.sm}px) {\n text-align: right;\n margin-bottom: 0;\n width: auto;\n }\n }\n .infoVehicleDealerInfo {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n .CardImageOverlayTheme {\n ${(props) => {\n return opacityLayerSwitchLightStatement(props.children.props.lightOpacity, 'background');\n }};\n\n ${(props) => {\n return opacityLayerSwitchDarkStatement(props.children.props.darkOpacity, 'background');\n }}\n }\n`;\n"],"names":["CardPhotoAdjustable","forwardRef","props","ref","_jsx","CardPhotoAdjustableStyled","children","CardPhotoFixedComponent","Object","assign","styled","MuiCard","heightSize","theme","breakpoints","values","sm","md","palette","onSurface","os0","lightOpacity","darkOpacity","cardType","text","primary","shape","borderRadius","isBorderRadius","lg","xl","opacityLayerSwitchLightStatement","opacityLayerSwitchDarkStatement"],"mappings":"mLA8GO,MAAMA,EAAsBC,EAAAA,WAAqD,CAACC,EAAOC,IAE5FC,EAAAA,IAACC,EAAyB,CAACF,IAAKA,EAAGG,SACjCF,EAAAA,IAACG,EAAAA,QAAuBC,OAAAC,OAAA,CAAA,EAAKP,OAS7BG,EAA4BK,EAAAA,OAAOC,EAAAA,KAAwD;YACpFT,IACT,OAAQA,EAAMI,SAASJ,MAAMU,YAC3B,IAAK,QACH,MAAO,QAET,IAAK,SAGL,IAAK,SACH,MAAO,QAET,QACE,MAAO;;uBAISV,GAAUA,EAAMW,MAAMC,YAAYC,OAAOC;cAClDd,IACT,OAAQA,EAAMI,SAASJ,MAAMU,YAC3B,IAAK,QACH,MAAO,QAET,IAAK,SACH,MAAO,QAET,IAAK,SACH,MAAO,QAET,QACE,MAAO;;;uBAKOV,GAAUA,EAAMW,MAAMC,YAAYC,OAAOE;cAClDf,IACT,OAAQA,EAAMI,SAASJ,MAAMU,YAC3B,IAAK,QACH,MAAO,QAET,IAAK,SACH,MAAO,QAET,IAAK,SACH,MAAO,QAET,QACE,MAAO;;;;;;;sBASMV,GACZA,EAAMW,MAAMK,QAAQC,UAAUC;;WAG7BlB,GAEiC,aAAtCA,EAAMI,SAASJ,MAAMmB,cAAoE,aAArCnB,EAAMI,SAASJ,MAAMoB,aACxC,iBAAlCpB,EAAMI,SAASJ,MAAMqB,SAEdrB,EAAMW,MAAMK,QAAQM,KAAKC,SAEO,aAArCvB,EAAMI,SAASJ,MAAMoB,aAA8BpB,EAAMI,SAASJ,MAAMqB,SACnErB,EAAMW,MAAMK,QAAQC,UAAUC;IAGtClB,IACD,GAAIA,EAAMW,MAAMa,MAAMC,aACpB,MAAO;;IAIRzB,IACD,GAAIA,EAAMI,SAASJ,MAAM0B,eACvB,MAAO;;;;;;;;;aAWC1B,GACkC,aAAtCA,EAAMI,SAASJ,MAAMmB,cAAoE,aAArCnB,EAAMI,SAASJ,MAAMoB,YACpEpB,EAAMW,MAAMK,QAAQM,KAAKC,QAEO,aAArCvB,EAAMI,SAASJ,MAAMoB,YAChBpB,EAAMW,MAAMK,QAAQC,UAAUC,SADvC;;;;;;;;;;;;;;;;;;;;;2BAwBsBlB,GAAUA,EAAMW,MAAMC,YAAYC,OAAOc;;;;;;;;2BAQzC3B,GAAUA,EAAMW,MAAMC,YAAYC,OAAOe;;;;;;;;;;;yBAW3C5B,GAAUA,EAAMW,MAAMC,YAAYC,OAAOE;;;;;;;;;;;yBAWzCf,GAAUA,EAAMW,MAAMC,YAAYC,OAAOE;;;;;2BAKvCf,GAAUA,EAAMW,MAAMC,YAAYC,OAAOE;;;;;2BAKzCf,GAAUA,EAAMW,MAAMC,YAAYC,OAAOE;;;;;;;;;;;;;yBAa3Cf,GAAUA,EAAMW,MAAMC,YAAYC,OAAOC;;;;;;;;;;;;yBAYzCd,GAAUA,EAAMW,MAAMC,YAAYC,OAAOE;;;;;;;;;;;;;;2BAcvCf,GAAUA,EAAMW,MAAMC,YAAYC,OAAOC;;;;;;;;;;;;;MAa9Dd,GACM6B,EAAAA,iCAAiC7B,EAAMI,SAASJ,MAAMmB,aAAc;;MAG1EnB,GACM8B,EAAAA,gCAAgC9B,EAAMI,SAASJ,MAAMoB,YAAa;;"}

package/cjs/organisms/cardPhotoAdjustable/cardPhotoAdjustableComponent.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var a=require("react/jsx-runtime"),e=require("react"),t=require("../../components/button/button.js"),s=require("../../utils/utilities.js"),n=require("../../components/label/label.js");exports.default=({cardImage:l,altImageDescription:r,labelText:i,labelVariants:c,title:o,subtitle:d,buttonLink:u,buttonLabel:m,buttonVariant:x,optionalButton:h,optionalButtonLink:b,optionalButtonLabel:j,optionalButtonVariant:C,analyticsCallback:I})=>{const v=e.useCallback((a=>{null==I||I(a)}),[I]);return a.jsxs(a.Fragment,{children:[a.jsx("div",{className:"CardImageOverlayTheme"}),a.jsx("div",{className:"CardImageText",children:a.jsxs("div",{className:"CardImageTextContainer",children:[a.jsxs("div",{className:"CardImageHeader",children:[i&&a.jsx(n.Label,{type:"feature",className:"Label",variant:c,label:s.handleMaxChars(i,30)}),o&&a.jsx("h2",{className:"h4",children:s.handleMaxChars(o,30)}),d&&a.jsx("span",{className:"CardImageSubtitle",children:s.handleMaxChars(d,30)})]}),a.jsx("div",{className:"CardImageButtonsContainer",children:a.jsx("div",{className:"CardImageButtonsContainerContent",children:a.jsxs("div",{className:"CardImageButtons",children:[a.jsx("a",{tabIndex:-1,className:"cta-button",href:encodeURI(u),style:{textDecoration:"none"},children:a.jsx(t.Button,{label:s.handleMaxChars(m,30),variant:x,compact:!0,onClick:()=>v(m)})}),h&&j&&b&&a.jsx("a",{tabIndex:-1,className:"cta-button",href:encodeURI(b),style:{textDecoration:"none"},children:a.jsx(t.Button,{label:s.handleMaxChars(j,30),variant:C,compact:!0,onClick:()=>v(j)})})]})})})]})}),a.jsx("div",{className:"CardImageMedia",children:a.jsx("div",{className:"CardImagePicture",children:a.jsx("img",{src:l,alt:r})})})]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var a=require("react/jsx-runtime"),e=require("react"),t=require("../../components/button/button.js"),s=require("../../utils/utilities.js"),n=require("../../components/label/label.js");exports.default=({cardImage:l,altImageDescription:r,labelText:i,labelVariants:c,title:o,subtitle:d,buttonLink:u,buttonLabel:m,buttonVariant:x,optionalButton:h,optionalButtonLink:b,optionalButtonLabel:j,optionalButtonVariant:C,analyticsCallback:I})=>{const v=e.useCallback(a=>{null==I||I(a)},[I]);return a.jsxs(a.Fragment,{children:[a.jsx("div",{className:"CardImageOverlayTheme"}),a.jsx("div",{className:"CardImageText",children:a.jsxs("div",{className:"CardImageTextContainer",children:[a.jsxs("div",{className:"CardImageHeader",children:[i&&a.jsx(n.Label,{type:"feature",className:"Label",variant:c,label:s.handleMaxChars(i,30)}),o&&a.jsx("h2",{className:"h4",children:s.handleMaxChars(o,30)}),d&&a.jsx("span",{className:"CardImageSubtitle",children:s.handleMaxChars(d,30)})]}),a.jsx("div",{className:"CardImageButtonsContainer",children:a.jsx("div",{className:"CardImageButtonsContainerContent",children:a.jsxs("div",{className:"CardImageButtons",children:[a.jsx("a",{tabIndex:-1,className:"cta-button",href:encodeURI(u),style:{textDecoration:"none"},children:a.jsx(t.Button,{label:s.handleMaxChars(m,30),variant:x,compact:!0,onClick:()=>v(m)})}),h&&j&&b&&a.jsx("a",{tabIndex:-1,className:"cta-button",href:encodeURI(b),style:{textDecoration:"none"},children:a.jsx(t.Button,{label:s.handleMaxChars(j,30),variant:C,compact:!0,onClick:()=>v(j)})})]})})})]})}),a.jsx("div",{className:"CardImageMedia",children:a.jsx("div",{className:"CardImagePicture",children:a.jsx("img",{src:l,alt:r})})})]})};
 //# sourceMappingURL=cardPhotoAdjustableComponent.js.map

package/cjs/organisms/cardPhotoAdjustable/cardPhotoAdjustableComponent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"cardPhotoAdjustableComponent.js","sources":["../../../../../src/organisms/cardPhotoAdjustable/cardPhotoAdjustableComponent.tsx"],"sourcesContent":["import { FC, useCallback } from 'react';\nimport { CardPhotoAdjustableProps } from '.';\nimport { Button } from '../../components/button';\nimport { handleMaxChars } from '../../utils/utilities';\nimport { Label } from '@/src/components/label';\n\nconst CardPhotoFixedComponent: FC<CardPhotoAdjustableProps> = ({\n cardImage,\n altImageDescription,\n labelText,\n labelVariants,\n title,\n subtitle,\n buttonLink,\n buttonLabel,\n buttonVariant,\n optionalButton,\n optionalButtonLink,\n optionalButtonLabel,\n optionalButtonVariant,\n analyticsCallback,\n}) => {\n const handleOnClick = useCallback(\n (e: string) => {\n analyticsCallback?.(e);\n },\n [analyticsCallback],\n );\n return (\n <>\n <div className=\"CardImageOverlayTheme\"></div>\n <div className=\"CardImageText\">\n <div className=\"CardImageTextContainer\">\n <div className=\"CardImageHeader\">\n {labelText && (\n <Label type=\"feature\" className=\"Label\" variant={labelVariants} label={handleMaxChars(labelText, 30)} />\n )}\n {title && <h2 className=\"h4\">{handleMaxChars(title, 30)}</h2>}\n {subtitle && <span className=\"CardImageSubtitle\">{handleMaxChars(subtitle, 30)}</span>}\n </div>\n <div className=\"CardImageButtonsContainer\">\n <div className=\"CardImageButtonsContainerContent\">\n <div className=\"CardImageButtons\">\n <a tabIndex={-1} className=\"cta-button\" href={encodeURI(buttonLink)} style={{ textDecoration: 'none' }}>\n <Button\n label={handleMaxChars(buttonLabel, 30)}\n variant={buttonVariant}\n compact={true}\n onClick={() => handleOnClick(buttonLabel)}\n />\n </a>\n {optionalButton && optionalButtonLabel && optionalButtonLink && (\n <a\n tabIndex={-1}\n className=\"cta-button\"\n href={encodeURI(optionalButtonLink)}\n style={{ textDecoration: 'none' }}\n >\n <Button\n label={handleMaxChars(optionalButtonLabel, 30)}\n variant={optionalButtonVariant}\n compact={true}\n onClick={() => handleOnClick(optionalButtonLabel)}\n />\n </a>\n )}\n </div>\n </div>\n </div>\n </div>\n </div>\n <div className=\"CardImageMedia\">\n <div className=\"CardImagePicture\">\n <img src={cardImage} alt={altImageDescription} />\n </div>\n </div>\n </>\n );\n};\nexport default CardPhotoFixedComponent;\n"],"names":["cardImage","altImageDescription","labelText","labelVariants","title","subtitle","buttonLink","buttonLabel","buttonVariant","optionalButton","optionalButtonLink","optionalButtonLabel","optionalButtonVariant","analyticsCallback","handleOnClick","useCallback","e","_jsxs","_Fragment","children","_jsx","className","Label","type","variant","label","handleMaxChars","tabIndex","href","encodeURI","style","textDecoration","Button","compact","onClick","src","alt"],"mappings":"4QAM8D,EAC5DA,YACAC,sBACAC,YACAC,gBACAC,QACAC,WACAC,aACAC,cACAC,gBACAC,iBACAC,qBACAC,sBACAC,wBACAC,wBAEA,MAAMC,EAAgBC,~~eACnBC~~,IACCH,SAAAA,EAAoBG,~~EAAE~~,~~GAExB,~~CAACH,IAEH,OACEI,EAAAA,KAAAC,WAAA,CAAAC,SAAA,CACEC,EAAAA,IAAA,MAAA,CAAKC,UAAU,0BACfD,EAAAA,IAAA,MAAA,CAAKC,UAAU,gBAAeF,SAC5BF,OAAA,MAAA,CAAKI,UAAU,yBAAwBF,SAAA,CACrCF,EAAAA,KAAA,MAAA,CAAKI,UAAU,kBAAiBF,SAAA,CAC7BjB,GACCkB,EAAAA,IAACE,QAAK,CAACC,KAAK,UAAUF,UAAU,QAAQG,QAASrB,EAAesB,MAAOC,iBAAexB,EAAW,MAElGE,GAASgB,EAAAA,IAAA,KAAA,CAAIC,UAAU,KAAIF,SAAEO,EAAAA,eAAetB,EAAO,MACnDC,GAAYe,EAAAA,IAAA,OAAA,CAAMC,UAAU,oBAAmBF,SAAEO,iBAAerB,EAAU,SAE7Ee,EAAAA,IAAA,MAAA,CAAKC,UAAU,4BAA2BF,SACxCC,EAAAA,IAAA,MAAA,CAAKC,UAAU,mCAAkCF,SAC/CF,EAAAA,KAAA,MAAA,CAAKI,UAAU,mBAAkBF,SAAA,CAC/BC,EAAAA,IAAA,IAAA,CAAGO,UAAU,EAAIN,UAAU,aAAaO,KAAMC,UAAUvB,GAAawB,MAAO,CAAEC,eAAgB,QAAQZ,SACpGC,MAACY,EAAAA,OAAM,CACLP,MAAOC,EAAAA,eAAenB,EAAa,IACnCiB,QAAShB,EACTyB,SAAS,EACTC,QAAS,IAAMpB,EAAcP,OAGhCE,GAAkBE,GAAuBD,GACxCU,EAAAA,IAAA,IAAA,CACEO,UAAU,EACVN,UAAU,aACVO,KAAMC,UAAUnB,GAChBoB,MAAO,CAAEC,eAAgB,QAAQZ,SAEjCC,EAAAA,IAACY,EAAAA,OAAM,CACLP,MAAOC,EAAAA,eAAef,EAAqB,IAC3Ca,QAASZ,EACTqB,SAAS,EACTC,QAAS,IAAMpB,EAAcH,mBAS7CS,EAAAA,IAAA,MAAA,CAAKC,UAAU,iBAAgBF,SAC7BC,EAAAA,IAAA,MAAA,CAAKC,UAAU,mBAAkBF,SAC/BC,EAAAA,IAAA,MAAA,CAAKe,IAAKnC,EAAWoC,IAAKnC~~,UAG7B~~"}
1	+ {"version":3,"file":"cardPhotoAdjustableComponent.js","sources":["../../../../../src/organisms/cardPhotoAdjustable/cardPhotoAdjustableComponent.tsx"],"sourcesContent":["import { FC, useCallback } from 'react';\nimport { CardPhotoAdjustableProps } from '.';\nimport { Button } from '../../components/button';\nimport { handleMaxChars } from '../../utils/utilities';\nimport { Label } from '@/src/components/label';\n\nconst CardPhotoFixedComponent: FC<CardPhotoAdjustableProps> = ({\n cardImage,\n altImageDescription,\n labelText,\n labelVariants,\n title,\n subtitle,\n buttonLink,\n buttonLabel,\n buttonVariant,\n optionalButton,\n optionalButtonLink,\n optionalButtonLabel,\n optionalButtonVariant,\n analyticsCallback,\n}) => {\n const handleOnClick = useCallback(\n (e: string) => {\n analyticsCallback?.(e);\n },\n [analyticsCallback],\n );\n return (\n <>\n <div className=\"CardImageOverlayTheme\"></div>\n <div className=\"CardImageText\">\n <div className=\"CardImageTextContainer\">\n <div className=\"CardImageHeader\">\n {labelText && (\n <Label type=\"feature\" className=\"Label\" variant={labelVariants} label={handleMaxChars(labelText, 30)} />\n )}\n {title && <h2 className=\"h4\">{handleMaxChars(title, 30)}</h2>}\n {subtitle && <span className=\"CardImageSubtitle\">{handleMaxChars(subtitle, 30)}</span>}\n </div>\n <div className=\"CardImageButtonsContainer\">\n <div className=\"CardImageButtonsContainerContent\">\n <div className=\"CardImageButtons\">\n <a tabIndex={-1} className=\"cta-button\" href={encodeURI(buttonLink)} style={{ textDecoration: 'none' }}>\n <Button\n label={handleMaxChars(buttonLabel, 30)}\n variant={buttonVariant}\n compact={true}\n onClick={() => handleOnClick(buttonLabel)}\n />\n </a>\n {optionalButton && optionalButtonLabel && optionalButtonLink && (\n <a\n tabIndex={-1}\n className=\"cta-button\"\n href={encodeURI(optionalButtonLink)}\n style={{ textDecoration: 'none' }}\n >\n <Button\n label={handleMaxChars(optionalButtonLabel, 30)}\n variant={optionalButtonVariant}\n compact={true}\n onClick={() => handleOnClick(optionalButtonLabel)}\n />\n </a>\n )}\n </div>\n </div>\n </div>\n </div>\n </div>\n <div className=\"CardImageMedia\">\n <div className=\"CardImagePicture\">\n <img src={cardImage} alt={altImageDescription} />\n </div>\n </div>\n </>\n );\n};\nexport default CardPhotoFixedComponent;\n"],"names":["cardImage","altImageDescription","labelText","labelVariants","title","subtitle","buttonLink","buttonLabel","buttonVariant","optionalButton","optionalButtonLink","optionalButtonLabel","optionalButtonVariant","analyticsCallback","handleOnClick","useCallback","e","_jsxs","_Fragment","children","_jsx","className","Label","type","variant","label","handleMaxChars","tabIndex","href","encodeURI","style","textDecoration","Button","compact","onClick","src","alt"],"mappings":"4QAM8D,EAC5DA,YACAC,sBACAC,YACAC,gBACAC,QACAC,WACAC,aACAC,cACAC,gBACAC,iBACAC,qBACAC,sBACAC,wBACAC,wBAEA,MAAMC,EAAgBC,cACnBC,IACCH,SAAAA,EAAoBG,IAEtB,CAACH,IAEH,OACEI,EAAAA,KAAAC,WAAA,CAAAC,SAAA,CACEC,EAAAA,IAAA,MAAA,CAAKC,UAAU,0BACfD,EAAAA,IAAA,MAAA,CAAKC,UAAU,gBAAeF,SAC5BF,OAAA,MAAA,CAAKI,UAAU,yBAAwBF,SAAA,CACrCF,EAAAA,KAAA,MAAA,CAAKI,UAAU,kBAAiBF,SAAA,CAC7BjB,GACCkB,EAAAA,IAACE,QAAK,CAACC,KAAK,UAAUF,UAAU,QAAQG,QAASrB,EAAesB,MAAOC,iBAAexB,EAAW,MAElGE,GAASgB,EAAAA,IAAA,KAAA,CAAIC,UAAU,KAAIF,SAAEO,EAAAA,eAAetB,EAAO,MACnDC,GAAYe,EAAAA,IAAA,OAAA,CAAMC,UAAU,oBAAmBF,SAAEO,iBAAerB,EAAU,SAE7Ee,EAAAA,IAAA,MAAA,CAAKC,UAAU,4BAA2BF,SACxCC,EAAAA,IAAA,MAAA,CAAKC,UAAU,mCAAkCF,SAC/CF,EAAAA,KAAA,MAAA,CAAKI,UAAU,mBAAkBF,SAAA,CAC/BC,EAAAA,IAAA,IAAA,CAAGO,UAAU,EAAIN,UAAU,aAAaO,KAAMC,UAAUvB,GAAawB,MAAO,CAAEC,eAAgB,QAAQZ,SACpGC,MAACY,EAAAA,OAAM,CACLP,MAAOC,EAAAA,eAAenB,EAAa,IACnCiB,QAAShB,EACTyB,SAAS,EACTC,QAAS,IAAMpB,EAAcP,OAGhCE,GAAkBE,GAAuBD,GACxCU,EAAAA,IAAA,IAAA,CACEO,UAAU,EACVN,UAAU,aACVO,KAAMC,UAAUnB,GAChBoB,MAAO,CAAEC,eAAgB,QAAQZ,SAEjCC,EAAAA,IAACY,EAAAA,OAAM,CACLP,MAAOC,EAAAA,eAAef,EAAqB,IAC3Ca,QAASZ,EACTqB,SAAS,EACTC,QAAS,IAAMpB,EAAcH,mBAS7CS,EAAAA,IAAA,MAAA,CAAKC,UAAU,iBAAgBF,SAC7BC,EAAAA,IAAA,MAAA,CAAKC,UAAU,mBAAkBF,SAC/BC,EAAAA,IAAA,MAAA,CAAKe,IAAKnC,EAAWoC,IAAKnC"}

package/cjs/organisms/cardPhotoFixed/cardPhotoFixed.js CHANGED Viewed

@@ -1,4 +1,4 @@
-"use strict";var e=require("react/jsx-runtime"),i=require("react"),t=require("@mui/material/styles"),a=require("@mui/material"),r=require("./cardPhotoFixedComponent.js"),p=require("../../utils/utilities.js");const o=i.forwardRef(((i,t)=>{const p=a.useTheme(),o=a.useMediaQuery(p.breakpoints.up("md"));return e.jsx(n,{ref:t,children:e.jsx(r.default,Object.assign({isCompact:o},i))})})),n=t.styled(a.Card)`
+"use strict";var e=require("react/jsx-runtime"),i=require("react"),t=require("@mui/material/styles"),a=require("@mui/material"),r=require("./cardPhotoFixedComponent.js"),p=require("../../utils/utilities.js");const o=i.forwardRef((i,t)=>{const p=a.useTheme(),o=a.useMediaQuery(p.breakpoints.up("md"));return e.jsx(n,{ref:t,children:e.jsx(r.default,Object.assign({isCompact:o},i))})}),n=t.styled(a.Card)`
   background-color: ${e=>e.theme.palette.common.white};
   color: ${e=>"opacity0"!==e.children.props.lightOpacity&&"opacity0"===e.children.props.darkOpacity||"configurator"===e.children.props.cardType?e.theme.palette.common.black:("opacity0"!==e.children.props.darkOpacity&&e.children.props.cardType,e.theme.palette.common.white)};

package/cjs/organisms/cardPhotoFixed/cardPhotoFixed.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"cardPhotoFixed.js","sources":["../../../../../src/organisms/cardPhotoFixed/cardPhotoFixed.tsx"],"sourcesContent":["import React, { HTMLAttributes, forwardRef } from 'react';\nimport { styled } from '@mui/material/styles';\nimport { Card as MuiCard, CardProps as MuiCardProps, useTheme, useMediaQuery } from '@mui/material';\nimport CardPhotoFixedComponent from './cardPhotoFixedComponent';\nimport { DarkOpacity, LightOpacity } from '../common/cardOpacitylayer/cardOpacityTyping';\nimport { ButtonVariants } from '../..';\nimport { opacityLayerSwitchDarkStatement, opacityLayerSwitchLightStatement } from '../../utils/utilities';\n/*\n @interface CardPhotoFixedProps\n * @description Properties are inherited from HTML div element\n /\nexport interface CardPhotoFixedProps extends HTMLAttributes<HTMLDivElement> {\n /\n Label text\n /\n label?: string;\n /\n Title name text\n /\n title?: string;\n /\n Subtitle text\n /\n subTitle?: string;\n /\n Description text\n /\n description?: string;\n /\n if true, first label is showing\n /\n labelInfoFirst?: boolean;\n /\n First label information label text\n /\n labelInfoFirstText?: string;\n /\n First label variant\n /\n labelInfoFirstVariant?: 'primary' \| 'neutral';\n /\n if true, second optional label is showing\n /\n labelInfoSecond?: boolean;\n /\n Second label text\n /\n labelInfoSecondText?: string;\n /\n Second label variant\n /\n labelInfoSecondVariant?: 'primary' \| 'neutral';\n /\n An image of the component\n /\n cardImage?: string;\n /\n alt HTML tag apply to the image\n /\n altImageDescription?: string;\n /\n Mandatory Button link.\n /\n buttonLink?: string;\n\n /\n Mandatory Button label. Button displays only if it has a label text\n /\n buttonLabel?: string;\n\n /\n Mandatory Button variant.\n /\n buttonVariant?: ButtonVariants;\n /\n If true, button is showing\n /\n optionalButton?: boolean;\n /\n Optional Button label. Button displays only if it has a label text\n /\n optionalButtonLabel?: string;\n /\n Optional Button link.\n /\n optionalButtonLink?: string;\n /\n Mandatory Button variant.\n /\n optionalButtonVariant?: ButtonVariants;\n /\n If true borderRadius was added to entire card\n /\n isBorderRadius?: boolean;\n /\n Info text\n /\n infoText?: string;\n /\n Info text second position text\n /\n infoTextSecond?: string;\n /\n info text third position text\n /\n infoTextThird?: string;\n /\n A dark gradient layer was added\n /\n darkOpacity?: DarkOpacity;\n\n /\n A light gradient layer was added\n /\n lightOpacity?: LightOpacity;\n\n /\n Uses for setting button size based on screensize\n /\n isCompact?: boolean;\n /\n Callback for analytics\n /\n analyticsCallback?: (payload?: any) => void;\n}\n\n/\n @description SkodaFlow CardPhotoFixed component.\n * Properties are inherited from HTML Div element.\n * @param props CardPhotoFixedProps\n * @returns React Functional Component\n * @deprecated\n /\nexport const CardPhotoFixed = forwardRef<HTMLDivElement, CardPhotoFixedProps>((props, ref) => {\n const themeBreakpoint = useTheme();\n const isCompact = useMediaQuery(themeBreakpoint.breakpoints.up('md'));\n return (\n <CardPhotoFixedsStyled ref={ref}>\n <CardPhotoFixedComponent isCompact={isCompact} {...props} />\n </CardPhotoFixedsStyled>\n );\n});\n\n/\n @description Card Photo Fixed styling definition based on props\n /\n\nconst CardPhotoFixedsStyled = styled(MuiCard)<MuiCardProps & { children?: any; theme?: any }>`\n background-color: ${(props) => {\n return props.theme.palette.common.white;\n }};\n\n color: ${(props) => {\n if (\n (props.children.props.lightOpacity !== 'opacity0' && props.children.props.darkOpacity === 'opacity0') \|\|\n props.children.props.cardType === 'configurator'\n ) {\n return props.theme.palette.common.black;\n }\n if (props.children.props.darkOpacity !== 'opacity0' && props.children.props.cardType === 'configurator') {\n return props.theme.palette.common.white;\n } else return props.theme.palette.common.white;\n }};\n\n ${(props) => {\n if (props.theme.shape.borderRadius) {\n return 'border-radius: 0;';\n }\n }}\n\n / Height of the component */\n height: 500px;\n @media (min-width: ${(props) => props.theme.breakpoints.values.sm}px) {\n height: 440px;\n }\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n height: 400px;\n }\n @media (min-width: ${(props) => props.theme.breakpoints.values.lg}px) {\n height: 440px;\n }\n\n ${(props) => {\n if (props.children.props.isBorderRadius) {\n return 'border-radius: 8px;';\n }\n }}\n\n .CardImageHeader {\n width: 100%;\n @media (min-width: ${(props) => props.theme.breakpoints.values.sm}px) {\n max-width: 560px;\n }\n @media (min-width: ${(props) => props.theme.breakpoints.values.xl}px) {\n max-width: 640px;\n }\n }\n\n .CardImageHeader {\n .VehicleEquipment {\n margin: 0;\n font-size: 16px;\n line-height: 24px;\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n font-size: 23px;\n line-height: 28px;\n }\n }\n color: ${(props) => {\n if (props.children.props.lightOpacity !== 'opacity0' && props.children.props.darkOpacity === 'opacity0') {\n return props.theme.palette.text.primary;\n }\n if (props.children.props.darkOpacity !== 'opacity0') {\n return props.theme.palette.onSurface.os0;\n }\n }};\n }\n\n .CardImageText {\n .CardImageSubtitleContainer {\n display: inline-flex;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n width: 100%;\n }\n .CardImageSubtitle {\n font-size: 16px;\n line-height: 24px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n\n @media (min-width: ${(props) => props.theme.breakpoints.values.lg}px) {\n font-size: 18px;\n line-height: 28px;\n }\n }\n .CardImageTitle {\n font-size: 23px;\n line-height: 28px;\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n font-size: 32px;\n line-height: 38px;\n ${(props) => {\n if (props.children.props.cardSize === 'small') {\n return 'font-size: 27px; line-height: 32px';\n }\n }};\n }\n @media (min-width: ${(props) => props.theme.breakpoints.values.xl}px) {\n font-size: 36px;\n line-height: 44px;\n ${(props) => {\n if (props.children.props.cardSize === 'small') {\n return 'font-size: 30px; line-height: 36px';\n }\n }};\n }\n }\n }\n .CardImageButtonsContainer {\n display: flex;\n justify-content: space-between;\n flex-direction: column-reverse;\n flex-wrap: wrap-reverse;\n width: 100%;\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n flex-direction: row;\n }\n }\n .CardImageButtonsGroup {\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n width: 100%;\n gap: 12px 16px;\n @media (min-width: ${(props) => props.theme.breakpoints.values.sm}px) {\n flex-direction: row;\n flex-wrap: wrap;\n width: auto;\n }\n .cta-button {\n text-decoration: none;\n @media (min-width: ${(props) => props.theme.breakpoints.values.sm}px) {\n width: auto;\n }\n div {\n width: 100%;\n }\n button {\n width: 100%;\n @media (min-width: ${(props) => props.theme.breakpoints.values.sm}px) {\n width: auto;\n font-size: 14px;\n }\n }\n }\n }\n\n .LabelsOptional {\n display: flex;\n flex-wrap: wrap;\n margin-top: 6px;\n }\n .infoText {\n font-size: 14px;\n margin-bottom: 12px;\n margin-bottom: 12px;\n width: 100%;\n align-self: end;\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n width: auto;\n margin-bottom: 0;\n }\n .infoTextFirst {\n font-weight: bold;\n span {\n font-weight: 300;\n }\n }\n .infoTextThirdContainer {\n display: inline-flex;\n width: 100%;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n @media (min-width: ${(props) => props.theme.breakpoints.values.sm}px) {\n display: inline;\n text-align: right;\n margin-bottom: 0;\n width: auto;\n }\n }\n .infoTextThird {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n .CardImageOverlayTheme {\n ${(props) => {\n return opacityLayerSwitchLightStatement(props.children.props.lightOpacity, 'background');\n }};\n\n ${(props) => {\n return opacityLayerSwitchDarkStatement(props.children.props.darkOpacity, 'background');\n }}\n }\n`;\n"],"names":["CardPhotoFixed","forwardRef","props","ref","themeBreakpoint","useTheme","isCompact","useMediaQuery","breakpoints","up","_jsx","CardPhotoFixedsStyled","children","CardPhotoFixedComponent","Object","assign","styled","MuiCard","theme","palette","common","white","lightOpacity","darkOpacity","cardType","black","shape","borderRadius","values","sm","md","lg","isBorderRadius","xl","text","primary","onSurface","os0","cardSize","opacityLayerSwitchLightStatement","opacityLayerSwitchDarkStatement"],"mappings":"gNAqIO,MAAMA,EAAiBC,EAAAA,YAAgD,CAACC,EAAOC,KACpF,MAAMC,EAAkBC,EAAAA,WAClBC,EAAYC,EAAAA,cAAcH,EAAgBI,YAAYC,GAAG,OAC/D,OACEC,EAAAA,IAACC,GAAsBR,IAAKA,EAAGS,SAC7BF,MAACG,EAAAA,QAAuBC,OAAAC,OAAA,CAACT,UAAWA,GAAeJ,KAC7B,IAQtBS,EAAwBK,EAAAA,OAAOC,EAAAA,KAAwD;sBACtEf,GACZA,EAAMgB,MAAMC,QAAQC,OAAOC;;WAG1BnB,GAEiC,aAAtCA,EAAMU,SAASV,MAAMoB,cAAoE,aAArCpB,EAAMU,SAASV,MAAMqB,aACxC,iBAAlCrB,EAAMU,SAASV,MAAMsB,SAEdtB,EAAMgB,MAAMC,QAAQC,OAAOK,OAEK,aAArCvB,EAAMU,SAASV,MAAMqB,aAA8BrB,EAAMU,SAASV,MAAMsB,SACnEtB,EAAMgB,MAAMC,QAAQC,OAAOC;;IAInCnB,IACD,GAAIA,EAAMgB,MAAMQ,MAAMC,aACpB,MAAO,mBACT;;;;uBAKoBzB,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOC;;;uBAGzC3B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOE;;;uBAGzC5B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOG;;;;IAI5D7B,IACD,GAAIA,EAAMU,SAASV,MAAM8B,eACvB,MAAO,qBACT;;;;yBAKsB9B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOC;;;yBAGzC3B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOK;;;;;;;;;;2BAUvC/B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOE;;;;;aAKvD5B,GACkC,aAAtCA,EAAMU,SAASV,MAAMoB,cAAoE,aAArCpB,EAAMU,SAASV,MAAMqB,YACpErB,EAAMgB,MAAMC,QAAQe,KAAKC,QAEO,aAArCjC,EAAMU,SAASV,MAAMqB,YAChBrB,EAAMgB,MAAMC,QAAQiB,UAAUC,SADvC;;;;;;;;;;;;;;;;;;2BAqBsBnC,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOG;;;;;;;;2BAQzC7B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOE;;;UAG1D5B,IACD,GAAsC,UAAlCA,EAAMU,SAASV,MAAMoC,SACvB,MAAO,oCACT;;2BAGkBpC,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOK;;;UAG1D/B,IACD,GAAsC,UAAlCA,EAAMU,SAASV,MAAMoC,SACvB,MAAO,oCACT;;;;;;;;;;yBAWgBpC,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOE;;;;;;;;;;yBAUzC5B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOC;;;;;;;2BAOvC3B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOC;;;;;;;;6BAQvC3B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOC;;;;;;;;;;;;;;;;;;;yBAmB7C3B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOE;;;;;;;;;;;;;;;;2BAgBvC5B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOC;;;;;;;;;;;;;;MAc9D3B,GACMqC,EAAAA,iCAAiCrC,EAAMU,SAASV,MAAMoB,aAAc;;MAG1EpB,GACMsC,EAAAA,gCAAgCtC,EAAMU,SAASV,MAAMqB,YAAa;;"}
1	+ {"version":3,"file":"cardPhotoFixed.js","sources":["../../../../../src/organisms/cardPhotoFixed/cardPhotoFixed.tsx"],"sourcesContent":["import React, { HTMLAttributes, forwardRef } from 'react';\nimport { styled } from '@mui/material/styles';\nimport { Card as MuiCard, CardProps as MuiCardProps, useTheme, useMediaQuery } from '@mui/material';\nimport CardPhotoFixedComponent from './cardPhotoFixedComponent';\nimport { DarkOpacity, LightOpacity } from '../common/cardOpacitylayer/cardOpacityTyping';\nimport { ButtonVariants } from '../..';\nimport { opacityLayerSwitchDarkStatement, opacityLayerSwitchLightStatement } from '../../utils/utilities';\n/*\n @interface CardPhotoFixedProps\n * @description Properties are inherited from HTML div element\n /\nexport interface CardPhotoFixedProps extends HTMLAttributes<HTMLDivElement> {\n /\n Label text\n /\n label?: string;\n /\n Title name text\n /\n title?: string;\n /\n Subtitle text\n /\n subTitle?: string;\n /\n Description text\n /\n description?: string;\n /\n if true, first label is showing\n /\n labelInfoFirst?: boolean;\n /\n First label information label text\n /\n labelInfoFirstText?: string;\n /\n First label variant\n /\n labelInfoFirstVariant?: 'primary' \| 'neutral';\n /\n if true, second optional label is showing\n /\n labelInfoSecond?: boolean;\n /\n Second label text\n /\n labelInfoSecondText?: string;\n /\n Second label variant\n /\n labelInfoSecondVariant?: 'primary' \| 'neutral';\n /\n An image of the component\n /\n cardImage?: string;\n /\n alt HTML tag apply to the image\n /\n altImageDescription?: string;\n /\n Mandatory Button link.\n /\n buttonLink?: string;\n\n /\n Mandatory Button label. Button displays only if it has a label text\n /\n buttonLabel?: string;\n\n /\n Mandatory Button variant.\n /\n buttonVariant?: ButtonVariants;\n /\n If true, button is showing\n /\n optionalButton?: boolean;\n /\n Optional Button label. Button displays only if it has a label text\n /\n optionalButtonLabel?: string;\n /\n Optional Button link.\n /\n optionalButtonLink?: string;\n /\n Mandatory Button variant.\n /\n optionalButtonVariant?: ButtonVariants;\n /\n If true borderRadius was added to entire card\n /\n isBorderRadius?: boolean;\n /\n Info text\n /\n infoText?: string;\n /\n Info text second position text\n /\n infoTextSecond?: string;\n /\n info text third position text\n /\n infoTextThird?: string;\n /\n A dark gradient layer was added\n /\n darkOpacity?: DarkOpacity;\n\n /\n A light gradient layer was added\n /\n lightOpacity?: LightOpacity;\n\n /\n Uses for setting button size based on screensize\n /\n isCompact?: boolean;\n /\n Callback for analytics\n /\n analyticsCallback?: (payload?: any) => void;\n}\n\n/\n @description SkodaFlow CardPhotoFixed component.\n * Properties are inherited from HTML Div element.\n * @param props CardPhotoFixedProps\n * @returns React Functional Component\n * @deprecated\n /\nexport const CardPhotoFixed = forwardRef<HTMLDivElement, CardPhotoFixedProps>((props, ref) => {\n const themeBreakpoint = useTheme();\n const isCompact = useMediaQuery(themeBreakpoint.breakpoints.up('md'));\n return (\n <CardPhotoFixedsStyled ref={ref}>\n <CardPhotoFixedComponent isCompact={isCompact} {...props} />\n </CardPhotoFixedsStyled>\n );\n});\n\n/\n @description Card Photo Fixed styling definition based on props\n /\n\nconst CardPhotoFixedsStyled = styled(MuiCard)<MuiCardProps & { children?: any; theme?: any }>`\n background-color: ${(props) => {\n return props.theme.palette.common.white;\n }};\n\n color: ${(props) => {\n if (\n (props.children.props.lightOpacity !== 'opacity0' && props.children.props.darkOpacity === 'opacity0') \|\|\n props.children.props.cardType === 'configurator'\n ) {\n return props.theme.palette.common.black;\n }\n if (props.children.props.darkOpacity !== 'opacity0' && props.children.props.cardType === 'configurator') {\n return props.theme.palette.common.white;\n } else return props.theme.palette.common.white;\n }};\n\n ${(props) => {\n if (props.theme.shape.borderRadius) {\n return 'border-radius: 0;';\n }\n }}\n\n / Height of the component */\n height: 500px;\n @media (min-width: ${(props) => props.theme.breakpoints.values.sm}px) {\n height: 440px;\n }\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n height: 400px;\n }\n @media (min-width: ${(props) => props.theme.breakpoints.values.lg}px) {\n height: 440px;\n }\n\n ${(props) => {\n if (props.children.props.isBorderRadius) {\n return 'border-radius: 8px;';\n }\n }}\n\n .CardImageHeader {\n width: 100%;\n @media (min-width: ${(props) => props.theme.breakpoints.values.sm}px) {\n max-width: 560px;\n }\n @media (min-width: ${(props) => props.theme.breakpoints.values.xl}px) {\n max-width: 640px;\n }\n }\n\n .CardImageHeader {\n .VehicleEquipment {\n margin: 0;\n font-size: 16px;\n line-height: 24px;\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n font-size: 23px;\n line-height: 28px;\n }\n }\n color: ${(props) => {\n if (props.children.props.lightOpacity !== 'opacity0' && props.children.props.darkOpacity === 'opacity0') {\n return props.theme.palette.text.primary;\n }\n if (props.children.props.darkOpacity !== 'opacity0') {\n return props.theme.palette.onSurface.os0;\n }\n }};\n }\n\n .CardImageText {\n .CardImageSubtitleContainer {\n display: inline-flex;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n width: 100%;\n }\n .CardImageSubtitle {\n font-size: 16px;\n line-height: 24px;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n\n @media (min-width: ${(props) => props.theme.breakpoints.values.lg}px) {\n font-size: 18px;\n line-height: 28px;\n }\n }\n .CardImageTitle {\n font-size: 23px;\n line-height: 28px;\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n font-size: 32px;\n line-height: 38px;\n ${(props) => {\n if (props.children.props.cardSize === 'small') {\n return 'font-size: 27px; line-height: 32px';\n }\n }};\n }\n @media (min-width: ${(props) => props.theme.breakpoints.values.xl}px) {\n font-size: 36px;\n line-height: 44px;\n ${(props) => {\n if (props.children.props.cardSize === 'small') {\n return 'font-size: 30px; line-height: 36px';\n }\n }};\n }\n }\n }\n .CardImageButtonsContainer {\n display: flex;\n justify-content: space-between;\n flex-direction: column-reverse;\n flex-wrap: wrap-reverse;\n width: 100%;\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n flex-direction: row;\n }\n }\n .CardImageButtonsGroup {\n display: flex;\n flex-direction: column;\n flex-wrap: wrap;\n width: 100%;\n gap: 12px 16px;\n @media (min-width: ${(props) => props.theme.breakpoints.values.sm}px) {\n flex-direction: row;\n flex-wrap: wrap;\n width: auto;\n }\n .cta-button {\n text-decoration: none;\n @media (min-width: ${(props) => props.theme.breakpoints.values.sm}px) {\n width: auto;\n }\n div {\n width: 100%;\n }\n button {\n width: 100%;\n @media (min-width: ${(props) => props.theme.breakpoints.values.sm}px) {\n width: auto;\n font-size: 14px;\n }\n }\n }\n }\n\n .LabelsOptional {\n display: flex;\n flex-wrap: wrap;\n margin-top: 6px;\n }\n .infoText {\n font-size: 14px;\n margin-bottom: 12px;\n margin-bottom: 12px;\n width: 100%;\n align-self: end;\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n width: auto;\n margin-bottom: 0;\n }\n .infoTextFirst {\n font-weight: bold;\n span {\n font-weight: 300;\n }\n }\n .infoTextThirdContainer {\n display: inline-flex;\n width: 100%;\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n @media (min-width: ${(props) => props.theme.breakpoints.values.sm}px) {\n display: inline;\n text-align: right;\n margin-bottom: 0;\n width: auto;\n }\n }\n .infoTextThird {\n white-space: nowrap;\n overflow: hidden;\n text-overflow: ellipsis;\n }\n }\n .CardImageOverlayTheme {\n ${(props) => {\n return opacityLayerSwitchLightStatement(props.children.props.lightOpacity, 'background');\n }};\n\n ${(props) => {\n return opacityLayerSwitchDarkStatement(props.children.props.darkOpacity, 'background');\n }}\n }\n`;\n"],"names":["CardPhotoFixed","forwardRef","props","ref","themeBreakpoint","useTheme","isCompact","useMediaQuery","breakpoints","up","_jsx","CardPhotoFixedsStyled","children","CardPhotoFixedComponent","Object","assign","styled","MuiCard","theme","palette","common","white","lightOpacity","darkOpacity","cardType","black","shape","borderRadius","values","sm","md","lg","isBorderRadius","xl","text","primary","onSurface","os0","cardSize","opacityLayerSwitchLightStatement","opacityLayerSwitchDarkStatement"],"mappings":"gNAqIO,MAAMA,EAAiBC,EAAAA,WAAgD,CAACC,EAAOC,KACpF,MAAMC,EAAkBC,EAAAA,WAClBC,EAAYC,EAAAA,cAAcH,EAAgBI,YAAYC,GAAG,OAC/D,OACEC,EAAAA,IAACC,GAAsBR,IAAKA,EAAGS,SAC7BF,MAACG,EAAAA,QAAuBC,OAAAC,OAAA,CAACT,UAAWA,GAAeJ,QASnDS,EAAwBK,EAAAA,OAAOC,EAAAA,KAAwD;sBACtEf,GACZA,EAAMgB,MAAMC,QAAQC,OAAOC;;WAG1BnB,GAEiC,aAAtCA,EAAMU,SAASV,MAAMoB,cAAoE,aAArCpB,EAAMU,SAASV,MAAMqB,aACxC,iBAAlCrB,EAAMU,SAASV,MAAMsB,SAEdtB,EAAMgB,MAAMC,QAAQC,OAAOK,OAEK,aAArCvB,EAAMU,SAASV,MAAMqB,aAA8BrB,EAAMU,SAASV,MAAMsB,SACnEtB,EAAMgB,MAAMC,QAAQC,OAAOC;;IAInCnB,IACD,GAAIA,EAAMgB,MAAMQ,MAAMC,aACpB,MAAO;;;;uBAMWzB,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOC;;;uBAGzC3B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOE;;;uBAGzC5B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOG;;;;IAI5D7B,IACD,GAAIA,EAAMU,SAASV,MAAM8B,eACvB,MAAO;;;;yBAMa9B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOC;;;yBAGzC3B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOK;;;;;;;;;;2BAUvC/B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOE;;;;;aAKvD5B,GACkC,aAAtCA,EAAMU,SAASV,MAAMoB,cAAoE,aAArCpB,EAAMU,SAASV,MAAMqB,YACpErB,EAAMgB,MAAMC,QAAQe,KAAKC,QAEO,aAArCjC,EAAMU,SAASV,MAAMqB,YAChBrB,EAAMgB,MAAMC,QAAQiB,UAAUC,SADvC;;;;;;;;;;;;;;;;;;2BAqBsBnC,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOG;;;;;;;;2BAQzC7B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOE;;;UAG1D5B,IACD,GAAsC,UAAlCA,EAAMU,SAASV,MAAMoC,SACvB,MAAO;;2BAISpC,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOK;;;UAG1D/B,IACD,GAAsC,UAAlCA,EAAMU,SAASV,MAAMoC,SACvB,MAAO;;;;;;;;;;yBAYOpC,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOE;;;;;;;;;;yBAUzC5B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOC;;;;;;;2BAOvC3B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOC;;;;;;;;6BAQvC3B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOC;;;;;;;;;;;;;;;;;;;yBAmB7C3B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOE;;;;;;;;;;;;;;;;2BAgBvC5B,GAAUA,EAAMgB,MAAMV,YAAYoB,OAAOC;;;;;;;;;;;;;;MAc9D3B,GACMqC,EAAAA,iCAAiCrC,EAAMU,SAASV,MAAMoB,aAAc;;MAG1EpB,GACMsC,EAAAA,gCAAgCtC,EAAMU,SAASV,MAAMqB,YAAa;;"}

package/cjs/organisms/cardPhotoFixed/cardPhotoFixedComponent.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),a=require("react"),t=require("../../components/label/label.js"),l=require("../../components/button/button.js"),n=require("../common/infoTextCardComponent/infoTextCardComponent.js"),s=require("../../utils/utilities.js");exports.default=({label:i,title:r,subTitle:o,description:d,labelInfoFirst:c,labelInfoFirstText:x,labelInfoFirstVariant:m,labelInfoSecond:h,labelInfoSecondText:u,labelInfoSecondVariant:b,cardImage:j,altImageDescription:C,buttonLink:I,buttonLabel:f,buttonVariant:p,optionalButton:v,optionalButtonLink:T,optionalButtonLabel:N,optionalButtonVariant:g,infoText:M,infoTextSecond:L,infoTextThird:B,isCompact:q,analyticsCallback:S})=>{const k=a.useCallback((e=>{null==S||S(e)}),[S]);return e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"CardImageOverlayTheme"}),e.jsxs("div",{className:"CardImageText",children:[e.jsxs("div",{className:"CardImageHeader",children:[e.jsx(t.Label,{className:"CardImageLabel",label:s.handleMaxChars(i,30)}),r&&e.jsx("h2",{className:"CardImageTitle",children:s.handleMaxChars(r,35)}),o&&e.jsx("h4",{className:"VehicleEquipment",children:s.handleMaxChars(o,20)}),d&&e.jsx("div",{className:"CardImageSubtitleContainer",children:e.jsx("span",{className:"CardImageSubtitle",children:s.handleMaxChars(d,50)})}),e.jsxs("div",{className:"LabelsOptional",children:[c&&x&&e.jsx("div",{children:e.jsx(t.Label,{type:"feature",variant:m,label:s.handleMaxChars(x,30)})}),h&&u&&e.jsx("div",{children:e.jsx(t.Label,{type:"feature",variant:b,label:s.handleMaxChars(u,30)})})]})]}),e.jsxs("div",{className:"CardImageButtonsContainer",children:[e.jsxs("div",{className:"CardImageButtonsGroup",children:[e.jsx("a",{tabIndex:-1,className:"cta-button",href:encodeURI(I),children:e.jsx(l.Button,{label:s.handleMaxChars(f,30),variant:p,compact:q,onClick:()=>k(f)})}),v&&N&&T&&e.jsx("a",{tabIndex:-1,className:"cta-button",href:encodeURI(T),children:e.jsx(l.Button,{label:s.handleMaxChars(N,30),variant:g,compact:q,onClick:()=>k(N)})})]}),e.jsx(n.default,{infoText:M,infoTextSecond:L,infoTextThird:B,className:"infoText"})]})]}),e.jsx("div",{className:"CardImageMedia",children:e.jsx("div",{className:"CardImagePicture",children:e.jsx("img",{src:j,alt:C})})})]})};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),a=require("react"),t=require("../../components/label/label.js"),l=require("../../components/button/button.js"),n=require("../common/infoTextCardComponent/infoTextCardComponent.js"),s=require("../../utils/utilities.js");exports.default=({label:i,title:r,subTitle:o,description:d,labelInfoFirst:c,labelInfoFirstText:x,labelInfoFirstVariant:m,labelInfoSecond:h,labelInfoSecondText:u,labelInfoSecondVariant:b,cardImage:j,altImageDescription:C,buttonLink:I,buttonLabel:f,buttonVariant:p,optionalButton:v,optionalButtonLink:T,optionalButtonLabel:N,optionalButtonVariant:g,infoText:M,infoTextSecond:L,infoTextThird:B,isCompact:q,analyticsCallback:S})=>{const k=a.useCallback(e=>{null==S||S(e)},[S]);return e.jsxs(e.Fragment,{children:[e.jsx("div",{className:"CardImageOverlayTheme"}),e.jsxs("div",{className:"CardImageText",children:[e.jsxs("div",{className:"CardImageHeader",children:[e.jsx(t.Label,{className:"CardImageLabel",label:s.handleMaxChars(i,30)}),r&&e.jsx("h2",{className:"CardImageTitle",children:s.handleMaxChars(r,35)}),o&&e.jsx("h4",{className:"VehicleEquipment",children:s.handleMaxChars(o,20)}),d&&e.jsx("div",{className:"CardImageSubtitleContainer",children:e.jsx("span",{className:"CardImageSubtitle",children:s.handleMaxChars(d,50)})}),e.jsxs("div",{className:"LabelsOptional",children:[c&&x&&e.jsx("div",{children:e.jsx(t.Label,{type:"feature",variant:m,label:s.handleMaxChars(x,30)})}),h&&u&&e.jsx("div",{children:e.jsx(t.Label,{type:"feature",variant:b,label:s.handleMaxChars(u,30)})})]})]}),e.jsxs("div",{className:"CardImageButtonsContainer",children:[e.jsxs("div",{className:"CardImageButtonsGroup",children:[e.jsx("a",{tabIndex:-1,className:"cta-button",href:encodeURI(I),children:e.jsx(l.Button,{label:s.handleMaxChars(f,30),variant:p,compact:q,onClick:()=>k(f)})}),v&&N&&T&&e.jsx("a",{tabIndex:-1,className:"cta-button",href:encodeURI(T),children:e.jsx(l.Button,{label:s.handleMaxChars(N,30),variant:g,compact:q,onClick:()=>k(N)})})]}),e.jsx(n.default,{infoText:M,infoTextSecond:L,infoTextThird:B,className:"infoText"})]})]}),e.jsx("div",{className:"CardImageMedia",children:e.jsx("div",{className:"CardImagePicture",children:e.jsx("img",{src:j,alt:C})})})]})};
 //# sourceMappingURL=cardPhotoFixedComponent.js.map

package/cjs/organisms/cardPhotoFixed/cardPhotoFixedComponent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"cardPhotoFixedComponent.js","sources":["../../../../../src/organisms/cardPhotoFixed/cardPhotoFixedComponent.tsx"],"sourcesContent":["import { useCallback, FC } from 'react';\nimport { CardPhotoFixedProps } from '.';\nimport { Label } from '../../components/label';\nimport { Button } from '../../components/button';\nimport InfoTextCardComponent from '../common/infoTextCardComponent/infoTextCardComponent';\nimport { handleMaxChars } from '../../utils/utilities';\n\nconst CardPhotoFixedComponent: FC<CardPhotoFixedProps> = ({\n label,\n title,\n subTitle,\n description,\n labelInfoFirst,\n labelInfoFirstText,\n labelInfoFirstVariant,\n labelInfoSecond,\n labelInfoSecondText,\n labelInfoSecondVariant,\n cardImage,\n altImageDescription,\n buttonLink,\n buttonLabel,\n buttonVariant,\n optionalButton,\n optionalButtonLink,\n optionalButtonLabel,\n optionalButtonVariant,\n infoText,\n infoTextSecond,\n infoTextThird,\n isCompact,\n analyticsCallback,\n}) => {\n const handleOnClick = useCallback(\n (e: string) => {\n analyticsCallback?.(e);\n },\n [analyticsCallback],\n );\n\n return (\n <>\n <div className=\"CardImageOverlayTheme\"></div>\n <div className=\"CardImageText\">\n <div className=\"CardImageHeader\">\n <Label className=\"CardImageLabel\" label={handleMaxChars(label, 30)}></Label>\n {title && <h2 className=\"CardImageTitle\">{handleMaxChars(title, 35)}</h2>}\n {subTitle && <h4 className=\"VehicleEquipment\">{handleMaxChars(subTitle, 20)}</h4>}\n {description && (\n <div className=\"CardImageSubtitleContainer\">\n <span className=\"CardImageSubtitle\">{handleMaxChars(description, 50)}</span>\n </div>\n )}\n <div className=\"LabelsOptional\">\n {labelInfoFirst && labelInfoFirstText && (\n <div>\n <Label type=\"feature\" variant={labelInfoFirstVariant} label={handleMaxChars(labelInfoFirstText, 30)} />\n </div>\n )}\n {labelInfoSecond && labelInfoSecondText && (\n <div>\n <Label\n type=\"feature\"\n variant={labelInfoSecondVariant}\n label={handleMaxChars(labelInfoSecondText, 30)}\n />\n </div>\n )}\n </div>\n </div>\n <div className=\"CardImageButtonsContainer\">\n <div className=\"CardImageButtonsGroup\">\n <a tabIndex={-1} className=\"cta-button\" href={encodeURI(buttonLink)}>\n <Button\n label={handleMaxChars(buttonLabel, 30)}\n variant={buttonVariant}\n compact={isCompact}\n onClick={() => handleOnClick(buttonLabel)}\n />\n </a>\n {optionalButton && optionalButtonLabel && optionalButtonLink && (\n <a tabIndex={-1} className=\"cta-button\" href={encodeURI(optionalButtonLink)}>\n <Button\n label={handleMaxChars(optionalButtonLabel, 30)}\n variant={optionalButtonVariant}\n compact={isCompact}\n onClick={() => handleOnClick(optionalButtonLabel)}\n />\n </a>\n )}\n </div>\n <InfoTextCardComponent\n infoText={infoText}\n infoTextSecond={infoTextSecond}\n infoTextThird={infoTextThird}\n className=\"infoText\"\n />\n </div>\n </div>\n <div className=\"CardImageMedia\">\n <div className=\"CardImagePicture\">\n <img src={cardImage} alt={altImageDescription} />\n </div>\n </div>\n </>\n );\n};\n\nexport default CardPhotoFixedComponent;\n"],"names":["label","title","subTitle","description","labelInfoFirst","labelInfoFirstText","labelInfoFirstVariant","labelInfoSecond","labelInfoSecondText","labelInfoSecondVariant","cardImage","altImageDescription","buttonLink","buttonLabel","buttonVariant","optionalButton","optionalButtonLink","optionalButtonLabel","optionalButtonVariant","infoText","infoTextSecond","infoTextThird","isCompact","analyticsCallback","handleOnClick","useCallback","e","_jsxs","_Fragment","children","_jsx","className","Label","handleMaxChars","type","variant","tabIndex","href","encodeURI","Button","compact","onClick","InfoTextCardComponent","src","alt"],"mappings":"kVAOyD,EAACA,MACxDA,EACAC,QACAC,WACAC,cACAC,iBACAC,qBACAC,wBACAC,kBACAC,sBACAC,yBACAC,YACAC,sBACAC,aACAC,cACAC,gBACAC,iBACAC,qBACAC,sBACAC,wBACAC,WACAC,iBACAC,gBACAC,YACAC,wBAEA,MAAMC,EAAgBC,~~eACnBC~~,IACCH,SAAAA,EAAoBG,~~EAAE~~,~~GAExB,~~CAACH,IAGH,OACEI,EAAAA,KAAAC,EAAAA,SAAA,CAAAC,SAAA,CACEC,EAAAA,IAAA,MAAA,CAAKC,UAAU,0BACfJ,EAAAA,KAAA,MAAA,CAAKI,UAAU,gBAAeF,SAAA,CAC5BF,EAAAA,KAAA,MAAA,CAAKI,UAAU,kBAAiBF,SAAA,CAC9BC,EAAAA,IAACE,EAAAA,MAAK,CAACD,UAAU,iBAAiB/B,MAAOiC,iBAAejC,EAAO,MAC9DC,GAAS6B,EAAAA,IAAA,KAAA,CAAIC,UAAU,iBAAgBF,SAAEI,EAAAA,eAAehC,EAAO,MAC/DC,GAAY4B,EAAAA,IAAA,KAAA,CAAIC,UAAU,mBAAkBF,SAAEI,EAAAA,eAAe/B,EAAU,MACvEC,GACC2B,EAAAA,IAAA,MAAA,CAAKC,UAAU,6BAA4BF,SACzCC,EAAAA,IAAA,OAAA,CAAMC,UAAU,oBAAmBF,SAAEI,EAAAA,eAAe9B,EAAa,QAGrEwB,EAAAA,KAAA,MAAA,CAAKI,UAAU,iBAAgBF,SAAA,CAC5BzB,GAAkBC,GACjByB,EAAAA,IAAA,MAAA,CAAAD,SACEC,EAAAA,IAACE,QAAK,CAACE,KAAK,UAAUC,QAAS7B,EAAuBN,MAAOiC,EAAAA,eAAe5B,EAAoB,QAGnGE,GAAmBC,GAClBsB,MAAA,MAAA,CAAAD,SACEC,MAACE,EAAAA,MAAK,CACJE,KAAK,UACLC,QAAS1B,EACTT,MAAOiC,EAAAA,eAAezB,EAAqB,cAMrDmB,EAAAA,KAAA,MAAA,CAAKI,UAAU,4BAA2BF,SAAA,CACxCF,EAAAA,KAAA,MAAA,CAAKI,UAAU,wBAAuBF,SAAA,CACpCC,MAAA,IAAA,CAAGM,YAAcL,UAAU,aAAaM,KAAMC,UAAU1B,YACtDkB,MAACS,EAAAA,OAAM,CACLvC,MAAOiC,iBAAepB,EAAa,IACnCsB,QAASrB,EACT0B,QAASlB,EACTmB,QAAS,IAAMjB,EAAcX,OAGhCE,GAAkBE,GAAuBD,GACxCc,EAAAA,SAAGM,UAAU,EAAIL,UAAU,aAAaM,KAAMC,UAAUtB,GAAmBa,SACzEC,EAAAA,IAACS,EAAAA,OAAM,CACLvC,MAAOiC,EAAAA,eAAehB,EAAqB,IAC3CkB,QAASjB,EACTsB,QAASlB,EACTmB,QAAS,IAAMjB,EAAcP,UAKrCa,MAACY,EAAAA,QAAqB,CACpBvB,SAAUA,EACVC,eAAgBA,EAChBC,cAAeA,EACfU,UAAU,mBAIhBD,MAAA,MAAA,CAAKC,UAAU,iBAAgBF,SAC7BC,EAAAA,IAAA,MAAA,CAAKC,UAAU,mBAAkBF,SAC/BC,MAAA,MAAA,CAAKa,IAAKjC,EAAWkC,IAAKjC~~,UAG7B~~"}
1	+ {"version":3,"file":"cardPhotoFixedComponent.js","sources":["../../../../../src/organisms/cardPhotoFixed/cardPhotoFixedComponent.tsx"],"sourcesContent":["import { useCallback, FC } from 'react';\nimport { CardPhotoFixedProps } from '.';\nimport { Label } from '../../components/label';\nimport { Button } from '../../components/button';\nimport InfoTextCardComponent from '../common/infoTextCardComponent/infoTextCardComponent';\nimport { handleMaxChars } from '../../utils/utilities';\n\nconst CardPhotoFixedComponent: FC<CardPhotoFixedProps> = ({\n label,\n title,\n subTitle,\n description,\n labelInfoFirst,\n labelInfoFirstText,\n labelInfoFirstVariant,\n labelInfoSecond,\n labelInfoSecondText,\n labelInfoSecondVariant,\n cardImage,\n altImageDescription,\n buttonLink,\n buttonLabel,\n buttonVariant,\n optionalButton,\n optionalButtonLink,\n optionalButtonLabel,\n optionalButtonVariant,\n infoText,\n infoTextSecond,\n infoTextThird,\n isCompact,\n analyticsCallback,\n}) => {\n const handleOnClick = useCallback(\n (e: string) => {\n analyticsCallback?.(e);\n },\n [analyticsCallback],\n );\n\n return (\n <>\n <div className=\"CardImageOverlayTheme\"></div>\n <div className=\"CardImageText\">\n <div className=\"CardImageHeader\">\n <Label className=\"CardImageLabel\" label={handleMaxChars(label, 30)}></Label>\n {title && <h2 className=\"CardImageTitle\">{handleMaxChars(title, 35)}</h2>}\n {subTitle && <h4 className=\"VehicleEquipment\">{handleMaxChars(subTitle, 20)}</h4>}\n {description && (\n <div className=\"CardImageSubtitleContainer\">\n <span className=\"CardImageSubtitle\">{handleMaxChars(description, 50)}</span>\n </div>\n )}\n <div className=\"LabelsOptional\">\n {labelInfoFirst && labelInfoFirstText && (\n <div>\n <Label type=\"feature\" variant={labelInfoFirstVariant} label={handleMaxChars(labelInfoFirstText, 30)} />\n </div>\n )}\n {labelInfoSecond && labelInfoSecondText && (\n <div>\n <Label\n type=\"feature\"\n variant={labelInfoSecondVariant}\n label={handleMaxChars(labelInfoSecondText, 30)}\n />\n </div>\n )}\n </div>\n </div>\n <div className=\"CardImageButtonsContainer\">\n <div className=\"CardImageButtonsGroup\">\n <a tabIndex={-1} className=\"cta-button\" href={encodeURI(buttonLink)}>\n <Button\n label={handleMaxChars(buttonLabel, 30)}\n variant={buttonVariant}\n compact={isCompact}\n onClick={() => handleOnClick(buttonLabel)}\n />\n </a>\n {optionalButton && optionalButtonLabel && optionalButtonLink && (\n <a tabIndex={-1} className=\"cta-button\" href={encodeURI(optionalButtonLink)}>\n <Button\n label={handleMaxChars(optionalButtonLabel, 30)}\n variant={optionalButtonVariant}\n compact={isCompact}\n onClick={() => handleOnClick(optionalButtonLabel)}\n />\n </a>\n )}\n </div>\n <InfoTextCardComponent\n infoText={infoText}\n infoTextSecond={infoTextSecond}\n infoTextThird={infoTextThird}\n className=\"infoText\"\n />\n </div>\n </div>\n <div className=\"CardImageMedia\">\n <div className=\"CardImagePicture\">\n <img src={cardImage} alt={altImageDescription} />\n </div>\n </div>\n </>\n );\n};\n\nexport default CardPhotoFixedComponent;\n"],"names":["label","title","subTitle","description","labelInfoFirst","labelInfoFirstText","labelInfoFirstVariant","labelInfoSecond","labelInfoSecondText","labelInfoSecondVariant","cardImage","altImageDescription","buttonLink","buttonLabel","buttonVariant","optionalButton","optionalButtonLink","optionalButtonLabel","optionalButtonVariant","infoText","infoTextSecond","infoTextThird","isCompact","analyticsCallback","handleOnClick","useCallback","e","_jsxs","_Fragment","children","_jsx","className","Label","handleMaxChars","type","variant","tabIndex","href","encodeURI","Button","compact","onClick","InfoTextCardComponent","src","alt"],"mappings":"kVAOyD,EAACA,MACxDA,EACAC,QACAC,WACAC,cACAC,iBACAC,qBACAC,wBACAC,kBACAC,sBACAC,yBACAC,YACAC,sBACAC,aACAC,cACAC,gBACAC,iBACAC,qBACAC,sBACAC,wBACAC,WACAC,iBACAC,gBACAC,YACAC,wBAEA,MAAMC,EAAgBC,cACnBC,IACCH,SAAAA,EAAoBG,IAEtB,CAACH,IAGH,OACEI,EAAAA,KAAAC,EAAAA,SAAA,CAAAC,SAAA,CACEC,EAAAA,IAAA,MAAA,CAAKC,UAAU,0BACfJ,EAAAA,KAAA,MAAA,CAAKI,UAAU,gBAAeF,SAAA,CAC5BF,EAAAA,KAAA,MAAA,CAAKI,UAAU,kBAAiBF,SAAA,CAC9BC,EAAAA,IAACE,EAAAA,MAAK,CAACD,UAAU,iBAAiB/B,MAAOiC,iBAAejC,EAAO,MAC9DC,GAAS6B,EAAAA,IAAA,KAAA,CAAIC,UAAU,iBAAgBF,SAAEI,EAAAA,eAAehC,EAAO,MAC/DC,GAAY4B,EAAAA,IAAA,KAAA,CAAIC,UAAU,mBAAkBF,SAAEI,EAAAA,eAAe/B,EAAU,MACvEC,GACC2B,EAAAA,IAAA,MAAA,CAAKC,UAAU,6BAA4BF,SACzCC,EAAAA,IAAA,OAAA,CAAMC,UAAU,oBAAmBF,SAAEI,EAAAA,eAAe9B,EAAa,QAGrEwB,EAAAA,KAAA,MAAA,CAAKI,UAAU,iBAAgBF,SAAA,CAC5BzB,GAAkBC,GACjByB,EAAAA,IAAA,MAAA,CAAAD,SACEC,EAAAA,IAACE,QAAK,CAACE,KAAK,UAAUC,QAAS7B,EAAuBN,MAAOiC,EAAAA,eAAe5B,EAAoB,QAGnGE,GAAmBC,GAClBsB,MAAA,MAAA,CAAAD,SACEC,MAACE,EAAAA,MAAK,CACJE,KAAK,UACLC,QAAS1B,EACTT,MAAOiC,EAAAA,eAAezB,EAAqB,cAMrDmB,EAAAA,KAAA,MAAA,CAAKI,UAAU,4BAA2BF,SAAA,CACxCF,EAAAA,KAAA,MAAA,CAAKI,UAAU,wBAAuBF,SAAA,CACpCC,MAAA,IAAA,CAAGM,YAAcL,UAAU,aAAaM,KAAMC,UAAU1B,YACtDkB,MAACS,EAAAA,OAAM,CACLvC,MAAOiC,iBAAepB,EAAa,IACnCsB,QAASrB,EACT0B,QAASlB,EACTmB,QAAS,IAAMjB,EAAcX,OAGhCE,GAAkBE,GAAuBD,GACxCc,EAAAA,SAAGM,UAAU,EAAIL,UAAU,aAAaM,KAAMC,UAAUtB,GAAmBa,SACzEC,EAAAA,IAACS,EAAAA,OAAM,CACLvC,MAAOiC,EAAAA,eAAehB,EAAqB,IAC3CkB,QAASjB,EACTsB,QAASlB,EACTmB,QAAS,IAAMjB,EAAcP,UAKrCa,MAACY,EAAAA,QAAqB,CACpBvB,SAAUA,EACVC,eAAgBA,EAChBC,cAAeA,EACfU,UAAU,mBAIhBD,MAAA,MAAA,CAAKC,UAAU,iBAAgBF,SAC7BC,EAAAA,IAAA,MAAA,CAAKC,UAAU,mBAAkBF,SAC/BC,MAAA,MAAA,CAAKa,IAAKjC,EAAWkC,IAAKjC"}

package/cjs/organisms/cardPromoVehicle/cardPromoVehicleComponent.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("tslib"),a=require("react/jsx-runtime"),i=require("../../components/label/label.js"),t=require("../common/menuCardComponent/menuCardComponent.js"),n=require("../common/infoTextCardComponent/infoTextCardComponent.js"),r=require("@mui/material"),o=require("../common/buttonCardComponent/buttonCardComponent.js"),l=require("../../utils/utilities.js"),s=require("../../components/common/imageComponent.js");const p=({label:e,labelVariant:r,vehicleName:p,equipment:c,image:m,altDescriptionImage:x,mandatoryButtonObject:h,optionalButtonObject:g,darkOpacityLayer:u,lightOpacityLayer:b,menuCardComponentProps:f,isMenuDropdown:y,infoText:C,infoTextSecond:v,infoTextThird:j,customInfo:w,description:T,labelInfoFirstVariant:I,labelInfoFirstText:O,labelInfoSecondVariant:k,labelInfoSecondText:S,isCompact:L,size:N,fallbackImage:z})=>a.jsxs(d,{size:N,darkOpacityLayer:u,lightOpacityLayer:b,children:[a.jsx("div",{className:"CardImageOverlayTheme"}),a.jsx("div",{className:"promoVehicleContainerPadding",children:a.jsxs("div",{className:"promoVehicleContainer",children:[a.jsxs("div",{className:"vehicleTitleContainer",children:[e&&("feature"===r?a.jsx(i.Label,{type:"feature",className:"CardImageLabelFeature",variant:"primary",children:l.handleMaxChars(e,30)}):a.jsx(i.Label,{className:"CardImageLabel",label:l.handleMaxChars(e,30)})),p&&a.jsx("h2",{style:{margin:0},className:"vehicleName",children:l.handleMaxChars(p,20)}),c&&a.jsx("h4",{style:{margin:0},className:"vehicleEquipment",children:l.handleMaxChars(c,20)}),T&&a.jsx("div",{className:"CardImageSubtitleContainer",children:a.jsx("span",{className:"CardImageSubtitle",children:l.handleMaxChars(T,50)})}),a.jsxs("div",{className:"LabelsOptional",children:[O&&a.jsx("div",{children:a.jsx(i.Label,{type:"feature",variant:I,label:l.handleMaxChars(O,30)})}),S&&a.jsx("div",{children:a.jsx(i.Label,{type:"feature",variant:k,label:l.handleMaxChars(S,30)})})]})]}),a.jsx("div",{className:"promoVehicleImage",children:a.jsx(s.default,{image:m,alt:x,fallbackImage:z})}),a.jsxs("div",{className:"promoVehicleInfo",children:[a.jsxs("div",{className:"promoVehicleButtons",children:[(null==h?void 0:h.label)&&a.jsx(o.default,{className:"button-component",buttonObject:h,compact:L}),(null==g?void 0:g.label)&&a.jsx(o.default,{className:"button-component",buttonObject:g,compact:L})]}),w?a.jsx("div",{className:"infoText",children:w}):a.jsx(n.default,{infoText:C,infoTextSecond:v,infoTextThird:j,className:"infoText"})]}),y&&a.jsx(t.default,Object.assign({},f))]})})]}),d=r.styled(r.Card,{shouldForwardProp:e=>"darkOpacityLayer"!==e&&"lightOpacityLayer"!==e&&"size"!==e})((a=>{var{theme:i}=a,t=e.__rest(a,["theme"]);const n=((e,a)=>{let i="";switch(a){case"opacity25":i="linear-gradient(269.68deg, rgba(255, 255, 255, 0) 0.28%, rgba(255, 255, 255, 0.25) 99.72%)";break;case"opacity50":i="linear-gradient(269.68deg, rgba(255, 255, 255, 0) 0.28%, rgba(255, 255, 255, 0.5) 99.72%)";break;case"opacity75":i="linear-gradient(269.68deg, rgba(255, 255, 255, 0) 0.28%, rgba(255, 255, 255, 0.75) 99.72%)"}switch(e){case"opacity25":i="linear-gradient(269.68deg, rgba(0, 0, 0, 0) 0.28%, rgba(0, 0, 0, 0.25) 99.72%)";break;case"opacity50":i="linear-gradient(269.68deg, rgba(0, 0, 0, 0) 0.28%, rgba(0, 0, 0, 0.5) 99.72%)";break;case"opacity75":i="linear-gradient(269.68deg, rgba(0, 0, 0, 0) 0.28%, rgba(0, 0, 0, 0.75) 99.72%)"}return i})(t.darkOpacityLayer,t.lightOpacityLayer),r=((e,a,i)=>{let t="";return"opacity0"!==a&&"opacity0"===e&&(t=i.palette.text.primary),t="opacity0"!==e?i.palette.onSurface.os0:i.palette.text.primary,t})(t.darkOpacityLayer,t.lightOpacityLayer,i);let o={};return o={position:"relative",width:"100%",padding:"24px",backgroundColor:i.palette.transparent.primary,color:r,"& .LabelsOptional":{display:"flex",flexWrap:"wrap",position:"relative",zIndex:2},"& .promoVehicleImage":{marginTop:"-45px",position:"relative",[i.breakpoints.up("md")]:{position:"fixed"===t.size?"absolute":"relative",marginTop:"fixed"===t.size?0:"-45px"},zIndex:0,width:"100%",height:"100%",display:"flex",justifyContent:"center"," & > img":{minHeight:"176px",maxWidth:"100%",maxHeight:"100%",position:"relative",objectFit:"contain"}},"& .promoVehicleContainerPadding":{position:"relative",height:"100%",width:"100%"},"& .promoVehicleContainer":{overflow:"hidden",height:"100%",width:"100%",flexDirection:"column",display:"flex",justifyContent:"fixed"===t.size?"space-between":"normal",boxSizing:"border-box"," & > .vehicleTitleContainer":{zIndex:2,width:"100%",position:"relative","& > .vehicleName":{fontSize:"23px",[i.breakpoints.up("md")]:{fontSize:"24px"},lineHeight:"28px"},"& > .vehicleEquipment":{fontSize:"16px",[i.breakpoints.up("md")]:{fontSize:"18px"},lineHeight:"24px"},"& > .CardImageLabelFeature":{marginLeft:"0px !important",marginBottom:"8px"},"& > .CardImageLabel":{lineHeight:"12px !important",marginBottom:"8px"},"& > .CardImageSubtitleContainer":{display:"inline-flex",whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",width:"100%","& > .CardImageSubtitle":{fontSize:"16px",lineHeight:"24px",whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",[i.breakpoints.up("lg")]:{fontSize:"18px",lineHeight:"28px"}}}},"& > .promoVehicleInfo":{marginTop:"-25px",position:"relative",[i.breakpoints.up("md")]:{marginTop:"fixed"===t.size?0:"-25px"},display:"flex",flexDirection:"column-reverse",flexWrap:"wrap-reverse",width:"100%",justifyContent:"space-between",zIndex:2,[i.breakpoints.up("md")]:{flexDirection:"row"},"& > .promoVehicleButtons":{display:"flex",flexDirection:"column",alignItems:"end",flexWrap:"wrap",gap:"12px 16px",marginTop:"8px","& > .button-component":{width:"100%",[i.breakpoints.up("md")]:{width:"auto",padding:"0 0 2px 2px"}," > div":{width:"100%"}},"& .MuiButton-root":{width:"100%"},[i.breakpoints.up("md")]:{flexDirection:"row","& > a":{"& + a":{marginTop:"0"}}}}," & > .infoText":{display:"block",maxWidth:"100%",fontSize:"14px",[i.breakpoints.up("md")]:{width:"auto",alignSelf:"end"}," & > div > p":{margin:0},".infoTextFirst":{fontWeight:"bold",span:{fontWeight:"300"}},".infoTextThirdContainer":{display:"inline-flex",maxWidth:"100%",whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},".infoTextThird":{whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"}}}," & >.menuCardComponent":{top:"-7px",right:"-5px"}}," & >.CardImageOverlayTheme":{background:n}},o}));exports.CardPromoVehicleComponent=p,exports.default=p;
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("tslib"),a=require("react/jsx-runtime"),i=require("../../components/label/label.js"),t=require("../common/menuCardComponent/menuCardComponent.js"),n=require("../common/infoTextCardComponent/infoTextCardComponent.js"),r=require("@mui/material"),o=require("../common/buttonCardComponent/buttonCardComponent.js"),l=require("../../utils/utilities.js"),s=require("../../components/common/imageComponent.js");const p=({label:e,labelVariant:r,vehicleName:p,equipment:c,image:m,altDescriptionImage:x,mandatoryButtonObject:h,optionalButtonObject:g,darkOpacityLayer:u,lightOpacityLayer:b,menuCardComponentProps:f,isMenuDropdown:y,infoText:C,infoTextSecond:v,infoTextThird:j,customInfo:w,description:T,labelInfoFirstVariant:I,labelInfoFirstText:O,labelInfoSecondVariant:k,labelInfoSecondText:S,isCompact:L,size:N,fallbackImage:z})=>a.jsxs(d,{size:N,darkOpacityLayer:u,lightOpacityLayer:b,children:[a.jsx("div",{className:"CardImageOverlayTheme"}),a.jsx("div",{className:"promoVehicleContainerPadding",children:a.jsxs("div",{className:"promoVehicleContainer",children:[a.jsxs("div",{className:"vehicleTitleContainer",children:[e&&("feature"===r?a.jsx(i.Label,{type:"feature",className:"CardImageLabelFeature",variant:"primary",children:l.handleMaxChars(e,30)}):a.jsx(i.Label,{className:"CardImageLabel",label:l.handleMaxChars(e,30)})),p&&a.jsx("h2",{style:{margin:0},className:"vehicleName",children:l.handleMaxChars(p,20)}),c&&a.jsx("h4",{style:{margin:0},className:"vehicleEquipment",children:l.handleMaxChars(c,20)}),T&&a.jsx("div",{className:"CardImageSubtitleContainer",children:a.jsx("span",{className:"CardImageSubtitle",children:l.handleMaxChars(T,50)})}),a.jsxs("div",{className:"LabelsOptional",children:[O&&a.jsx("div",{children:a.jsx(i.Label,{type:"feature",variant:I,label:l.handleMaxChars(O,30)})}),S&&a.jsx("div",{children:a.jsx(i.Label,{type:"feature",variant:k,label:l.handleMaxChars(S,30)})})]})]}),a.jsx("div",{className:"promoVehicleImage",children:a.jsx(s.default,{image:m,alt:x,fallbackImage:z})}),a.jsxs("div",{className:"promoVehicleInfo",children:[a.jsxs("div",{className:"promoVehicleButtons",children:[(null==h?void 0:h.label)&&a.jsx(o.default,{className:"button-component",buttonObject:h,compact:L}),(null==g?void 0:g.label)&&a.jsx(o.default,{className:"button-component",buttonObject:g,compact:L})]}),w?a.jsx("div",{className:"infoText",children:w}):a.jsx(n.default,{infoText:C,infoTextSecond:v,infoTextThird:j,className:"infoText"})]}),y&&a.jsx(t.default,Object.assign({},f))]})})]}),d=r.styled(r.Card,{shouldForwardProp:e=>"darkOpacityLayer"!==e&&"lightOpacityLayer"!==e&&"size"!==e})(a=>{var{theme:i}=a,t=e.__rest(a,["theme"]);const n=((e,a)=>{let i="";switch(a){case"opacity25":i="linear-gradient(269.68deg, rgba(255, 255, 255, 0) 0.28%, rgba(255, 255, 255, 0.25) 99.72%)";break;case"opacity50":i="linear-gradient(269.68deg, rgba(255, 255, 255, 0) 0.28%, rgba(255, 255, 255, 0.5) 99.72%)";break;case"opacity75":i="linear-gradient(269.68deg, rgba(255, 255, 255, 0) 0.28%, rgba(255, 255, 255, 0.75) 99.72%)"}switch(e){case"opacity25":i="linear-gradient(269.68deg, rgba(0, 0, 0, 0) 0.28%, rgba(0, 0, 0, 0.25) 99.72%)";break;case"opacity50":i="linear-gradient(269.68deg, rgba(0, 0, 0, 0) 0.28%, rgba(0, 0, 0, 0.5) 99.72%)";break;case"opacity75":i="linear-gradient(269.68deg, rgba(0, 0, 0, 0) 0.28%, rgba(0, 0, 0, 0.75) 99.72%)"}return i})(t.darkOpacityLayer,t.lightOpacityLayer),r=((e,a,i)=>{let t="";return"opacity0"!==a&&"opacity0"===e&&(t=i.palette.text.primary),t="opacity0"!==e?i.palette.onSurface.os0:i.palette.text.primary,t})(t.darkOpacityLayer,t.lightOpacityLayer,i);let o={};return o={position:"relative",width:"100%",padding:"24px",backgroundColor:i.palette.transparent.primary,color:r,"& .LabelsOptional":{display:"flex",flexWrap:"wrap",position:"relative",zIndex:2},"& .promoVehicleImage":{marginTop:"-45px",position:"relative",[i.breakpoints.up("md")]:{position:"fixed"===t.size?"absolute":"relative",marginTop:"fixed"===t.size?0:"-45px"},zIndex:0,width:"100%",height:"100%",display:"flex",justifyContent:"center"," & > img":{minHeight:"176px",maxWidth:"100%",maxHeight:"100%",position:"relative",objectFit:"contain"}},"& .promoVehicleContainerPadding":{position:"relative",height:"100%",width:"100%"},"& .promoVehicleContainer":{overflow:"hidden",height:"100%",width:"100%",flexDirection:"column",display:"flex",justifyContent:"fixed"===t.size?"space-between":"normal",boxSizing:"border-box"," & > .vehicleTitleContainer":{zIndex:2,width:"100%",position:"relative","& > .vehicleName":{fontSize:"23px",[i.breakpoints.up("md")]:{fontSize:"24px"},lineHeight:"28px"},"& > .vehicleEquipment":{fontSize:"16px",[i.breakpoints.up("md")]:{fontSize:"18px"},lineHeight:"24px"},"& > .CardImageLabelFeature":{marginLeft:"0px !important",marginBottom:"8px"},"& > .CardImageLabel":{lineHeight:"12px !important",marginBottom:"8px"},"& > .CardImageSubtitleContainer":{display:"inline-flex",whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",width:"100%","& > .CardImageSubtitle":{fontSize:"16px",lineHeight:"24px",whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis",[i.breakpoints.up("lg")]:{fontSize:"18px",lineHeight:"28px"}}}},"& > .promoVehicleInfo":{marginTop:"-25px",position:"relative",[i.breakpoints.up("md")]:{marginTop:"fixed"===t.size?0:"-25px"},display:"flex",flexDirection:"column-reverse",flexWrap:"wrap-reverse",width:"100%",justifyContent:"space-between",zIndex:2,[i.breakpoints.up("md")]:{flexDirection:"row"},"& > .promoVehicleButtons":{display:"flex",flexDirection:"column",alignItems:"end",flexWrap:"wrap",gap:"12px 16px",marginTop:"8px","& > .button-component":{width:"100%",[i.breakpoints.up("md")]:{width:"auto",padding:"0 0 2px 2px"}," > div":{width:"100%"}},"& .MuiButton-root":{width:"100%"},[i.breakpoints.up("md")]:{flexDirection:"row","& > a":{"& + a":{marginTop:"0"}}}}," & > .infoText":{display:"block",maxWidth:"100%",fontSize:"14px",[i.breakpoints.up("md")]:{width:"auto",alignSelf:"end"}," & > div > p":{margin:0},".infoTextFirst":{fontWeight:"bold",span:{fontWeight:"300"}},".infoTextThirdContainer":{display:"inline-flex",maxWidth:"100%",whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"},".infoTextThird":{whiteSpace:"nowrap",overflow:"hidden",textOverflow:"ellipsis"}}}," & >.menuCardComponent":{top:"-7px",right:"-5px"}}," & >.CardImageOverlayTheme":{background:n}},o});exports.CardPromoVehicleComponent=p,exports.default=p;
 //# sourceMappingURL=cardPromoVehicleComponent.js.map

package/cjs/organisms/cardPromoVehicle/cardPromoVehicleComponent.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"cardPromoVehicleComponent.js","sources":["../../../../../src/organisms/cardPromoVehicle/cardPromoVehicleComponent.tsx"],"sourcesContent":["import { FC } from 'react';\nimport { Label } from '../../components/label';\nimport { CardPromoVehicleProps } from './cardPromoVehicle';\nimport MenuCardComponent from '../common/menuCardComponent/menuCardComponent';\nimport InfoTextCardComponent from '../common/infoTextCardComponent/infoTextCardComponent';\nimport { Card as MuiCard, CardProps as MuiCardProps, Theme, styled } from '@mui/material';\nimport ButtonCardComponent from '../common/buttonCardComponent/buttonCardComponent';\nimport { handleMaxChars } from '../../utils/utilities';\nimport ImageComponent from '../../components/common/imageComponent';\n\nexport const CardPromoVehicleComponent: FC<CardPromoVehicleProps> = ({\n label,\n labelVariant,\n vehicleName,\n equipment,\n image,\n altDescriptionImage,\n mandatoryButtonObject,\n optionalButtonObject,\n darkOpacityLayer,\n lightOpacityLayer,\n menuCardComponentProps,\n isMenuDropdown,\n infoText,\n infoTextSecond,\n infoTextThird,\n customInfo,\n description,\n labelInfoFirstVariant,\n labelInfoFirstText,\n labelInfoSecondVariant,\n labelInfoSecondText,\n isCompact,\n size,\n fallbackImage,\n}) => {\n return (\n <CardPromoVehicleComponentStyled\n size={size}\n darkOpacityLayer={darkOpacityLayer}\n lightOpacityLayer={lightOpacityLayer}\n >\n <div className=\"CardImageOverlayTheme\"></div>\n <div className=\"promoVehicleContainerPadding\">\n <div className=\"promoVehicleContainer\">\n <div className=\"vehicleTitleContainer\">\n {label &&\n (labelVariant === 'feature' ? (\n <Label type=\"feature\" className=\"CardImageLabelFeature\" variant=\"primary\">\n {handleMaxChars(label, 30)}\n </Label>\n ) : (\n <Label className=\"CardImageLabel\" label={handleMaxChars(label, 30)}></Label>\n ))}\n {vehicleName && (\n <h2 style={{ margin: 0 }} className=\"vehicleName\">\n {handleMaxChars(vehicleName, 20)}\n </h2>\n )}\n {equipment && (\n <h4 style={{ margin: 0 }} className=\"vehicleEquipment\">\n {handleMaxChars(equipment, 20)}\n </h4>\n )}\n {description && (\n <div className=\"CardImageSubtitleContainer\">\n <span className=\"CardImageSubtitle\">{handleMaxChars(description, 50)}</span>\n </div>\n )}\n <div className=\"LabelsOptional\">\n {labelInfoFirstText && (\n <div>\n <Label\n type=\"feature\"\n variant={labelInfoFirstVariant}\n label={handleMaxChars(labelInfoFirstText, 30)}\n />\n </div>\n )}\n {labelInfoSecondText && (\n <div>\n <Label\n type=\"feature\"\n variant={labelInfoSecondVariant}\n label={handleMaxChars(labelInfoSecondText, 30)}\n />\n </div>\n )}\n </div>\n </div>\n <div className=\"promoVehicleImage\">\n <ImageComponent image={image} alt={altDescriptionImage} fallbackImage={fallbackImage} />\n </div>\n <div className=\"promoVehicleInfo\">\n <div className=\"promoVehicleButtons\">\n {mandatoryButtonObject?.label && (\n <ButtonCardComponent\n className=\"button-component\"\n buttonObject={mandatoryButtonObject}\n compact={isCompact}\n />\n )}\n {optionalButtonObject?.label && (\n <ButtonCardComponent\n className=\"button-component\"\n buttonObject={optionalButtonObject}\n compact={isCompact}\n />\n )}\n </div>\n {customInfo ? (\n <div className=\"infoText\">{customInfo}</div>\n ) : (\n <InfoTextCardComponent\n infoText={infoText}\n infoTextSecond={infoTextSecond}\n infoTextThird={infoTextThird}\n className=\"infoText\"\n />\n )}\n </div>\n {isMenuDropdown && <MenuCardComponent {...menuCardComponentProps} />}\n </div>\n </div>\n </CardPromoVehicleComponentStyled>\n );\n};\n\nexport default CardPromoVehicleComponent;\n\nconst handleOpacity = (darkOpacityLayer?: string, lightOpacityLayer?: string): string => {\n let opacity = '';\n switch (lightOpacityLayer) {\n case 'opacity25':\n opacity = 'linear-gradient(269.68deg, rgba(255, 255, 255, 0) 0.28%, rgba(255, 255, 255, 0.25) 99.72%)';\n break;\n case 'opacity50':\n opacity = 'linear-gradient(269.68deg, rgba(255, 255, 255, 0) 0.28%, rgba(255, 255, 255, 0.5) 99.72%)';\n break;\n case 'opacity75':\n opacity = 'linear-gradient(269.68deg, rgba(255, 255, 255, 0) 0.28%, rgba(255, 255, 255, 0.75) 99.72%)';\n break;\n }\n switch (darkOpacityLayer) {\n case 'opacity25':\n opacity = 'linear-gradient(269.68deg, rgba(0, 0, 0, 0) 0.28%, rgba(0, 0, 0, 0.25) 99.72%)';\n break;\n case 'opacity50':\n opacity = 'linear-gradient(269.68deg, rgba(0, 0, 0, 0) 0.28%, rgba(0, 0, 0, 0.5) 99.72%)';\n break;\n case 'opacity75':\n opacity = 'linear-gradient(269.68deg, rgba(0, 0, 0, 0) 0.28%, rgba(0, 0, 0, 0.75) 99.72%)';\n break;\n }\n return opacity;\n};\n\nconst handleTextColor = (darkOpacityLayer?: string, lightOpacityLayer?: string, theme?: Theme): string => {\n let color = '';\n if (lightOpacityLayer !== 'opacity0' && darkOpacityLayer === 'opacity0') {\n color = theme.palette.text.primary;\n }\n if (darkOpacityLayer !== 'opacity0') {\n color = theme.palette.onSurface.os0;\n } else color = theme.palette.text.primary;\n return color;\n};\n\n/*\n @description cardPromoVehicleComponent styling definition based on props\n */\n\nconst CardPromoVehicleComponentStyled = styled(MuiCard, {\n shouldForwardProp: (prop) => prop !== 'darkOpacityLayer' && prop !== 'lightOpacityLayer' && prop !== 'size',\n})<MuiCardProps & { darkOpacityLayer?: string; lightOpacityLayer?: string; size?: string }>(({ theme, ...props }) => {\n const opacityLayer = handleOpacity(props.darkOpacityLayer, props.lightOpacityLayer);\n const textColor = handleTextColor(props.darkOpacityLayer, props.lightOpacityLayer, theme);\n let style = {};\n\n style = {\n position: 'relative',\n width: '100%',\n padding: '24px',\n backgroundColor: theme.palette.transparent.primary,\n color: textColor,\n '& .LabelsOptional': {\n display: 'flex',\n flexWrap: 'wrap',\n position: 'relative',\n zIndex: 2,\n },\n '& .promoVehicleImage': {\n marginTop: '-45px',\n position: 'relative',\n [theme.breakpoints.up('md')]: {\n position: props.size === 'fixed' ? 'absolute' : 'relative',\n marginTop: props.size === 'fixed' ? 0 : '-45px',\n },\n\n zIndex: 0,\n width: '100%',\n height: '100%',\n display: 'flex',\n justifyContent: 'center',\n ' & > img': {\n minHeight: '176px',\n maxWidth: '100%',\n maxHeight: '100%',\n position: 'relative',\n objectFit: 'contain',\n },\n },\n '& .promoVehicleContainerPadding': {\n position: 'relative',\n height: '100%',\n width: '100%',\n },\n '& .promoVehicleContainer': {\n overflow: 'hidden',\n height: '100%',\n width: '100%',\n flexDirection: 'column',\n display: 'flex',\n justifyContent: props.size === 'fixed' ? 'space-between' : 'normal',\n boxSizing: 'border-box',\n ' & > .vehicleTitleContainer': {\n zIndex: 2,\n width: '100%',\n position: 'relative',\n '& > .vehicleName': {\n fontSize: '23px',\n [theme.breakpoints.up('md')]: {\n fontSize: '24px',\n },\n lineHeight: '28px',\n },\n '& > .vehicleEquipment': {\n fontSize: '16px',\n [theme.breakpoints.up('md')]: {\n fontSize: '18px',\n },\n lineHeight: '24px',\n },\n '& > .CardImageLabelFeature': {\n marginLeft: '0px !important',\n marginBottom: '8px',\n },\n '& > .CardImageLabel': {\n lineHeight: '12px !important',\n marginBottom: '8px',\n },\n '& > .CardImageSubtitleContainer': {\n display: 'inline-flex',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n width: '100%',\n '& > .CardImageSubtitle': {\n fontSize: '16px',\n lineHeight: '24px',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n [theme.breakpoints.up('lg')]: {\n fontSize: '18px',\n lineHeight: '28px',\n },\n },\n },\n },\n '& > .promoVehicleInfo': {\n marginTop: '-25px',\n position: 'relative',\n [theme.breakpoints.up('md')]: {\n marginTop: props.size === 'fixed' ? 0 : '-25px',\n },\n\n display: 'flex',\n flexDirection: 'column-reverse',\n flexWrap: 'wrap-reverse',\n width: '100%',\n justifyContent: 'space-between',\n zIndex: 2,\n [theme.breakpoints.up('md')]: {\n flexDirection: 'row',\n },\n '& > .promoVehicleButtons': {\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'end',\n flexWrap: 'wrap',\n gap: '12px 16px',\n marginTop: '8px',\n '& > .button-component': {\n width: '100%',\n [theme.breakpoints.up('md')]: {\n width: 'auto',\n padding: '0 0 2px 2px',\n },\n ' > div': {\n width: '100%',\n },\n },\n '& .MuiButton-root': {\n width: '100%',\n },\n [theme.breakpoints.up('md')]: {\n flexDirection: 'row',\n '& > a': {\n '& + a': {\n marginTop: '0',\n },\n },\n },\n },\n ' & > .infoText': {\n display: 'block',\n maxWidth: '100%',\n fontSize: '14px',\n [theme.breakpoints.up('md')]: {\n width: 'auto',\n alignSelf: 'end',\n },\n ' & > div > p': {\n margin: 0,\n },\n '.infoTextFirst': {\n fontWeight: 'bold',\n span: { fontWeight: '300' },\n },\n '.infoTextThirdContainer': {\n display: 'inline-flex',\n maxWidth: '100%',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n },\n '.infoTextThird': {\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n },\n },\n },\n ' & >.menuCardComponent': {\n top: '-7px',\n right: '-5px',\n },\n },\n ' & >.CardImageOverlayTheme': {\n background: opacityLayer,\n },\n };\n return style;\n});\n"],"names":["CardPromoVehicleComponent","label","labelVariant","vehicleName","equipment","image","altDescriptionImage","mandatoryButtonObject","optionalButtonObject","darkOpacityLayer","lightOpacityLayer","menuCardComponentProps","isMenuDropdown","infoText","infoTextSecond","infoTextThird","customInfo","description","labelInfoFirstVariant","labelInfoFirstText","labelInfoSecondVariant","labelInfoSecondText","isCompact","size","fallbackImage","_jsxs","CardPromoVehicleComponentStyled","_jsx","className","children","Label","type","variant","handleMaxChars","style","margin","ImageComponent","alt","ButtonCardComponent","buttonObject","compact","InfoTextCardComponent","MenuCardComponent","styled","MuiCard","shouldForwardProp","prop","_a","theme","props","__rest","opacityLayer","opacity","handleOpacity","textColor","color","palette","text","primary","onSurface","os0","handleTextColor","position","width","padding","backgroundColor","transparent","display","flexWrap","zIndex","marginTop","breakpoints","up","height","justifyContent","minHeight","maxWidth","maxHeight","objectFit","overflow","flexDirection","boxSizing","fontSize","lineHeight","marginLeft","marginBottom","whiteSpace","textOverflow","alignItems","gap","alignSelf","fontWeight","span","top","right","background"],"mappings":"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"}
1	+ {"version":3,"file":"cardPromoVehicleComponent.js","sources":["../../../../../src/organisms/cardPromoVehicle/cardPromoVehicleComponent.tsx"],"sourcesContent":["import { FC } from 'react';\nimport { Label } from '../../components/label';\nimport { CardPromoVehicleProps } from './cardPromoVehicle';\nimport MenuCardComponent from '../common/menuCardComponent/menuCardComponent';\nimport InfoTextCardComponent from '../common/infoTextCardComponent/infoTextCardComponent';\nimport { Card as MuiCard, CardProps as MuiCardProps, Theme, styled } from '@mui/material';\nimport ButtonCardComponent from '../common/buttonCardComponent/buttonCardComponent';\nimport { handleMaxChars } from '../../utils/utilities';\nimport ImageComponent from '../../components/common/imageComponent';\n\nexport const CardPromoVehicleComponent: FC<CardPromoVehicleProps> = ({\n label,\n labelVariant,\n vehicleName,\n equipment,\n image,\n altDescriptionImage,\n mandatoryButtonObject,\n optionalButtonObject,\n darkOpacityLayer,\n lightOpacityLayer,\n menuCardComponentProps,\n isMenuDropdown,\n infoText,\n infoTextSecond,\n infoTextThird,\n customInfo,\n description,\n labelInfoFirstVariant,\n labelInfoFirstText,\n labelInfoSecondVariant,\n labelInfoSecondText,\n isCompact,\n size,\n fallbackImage,\n}) => {\n return (\n <CardPromoVehicleComponentStyled\n size={size}\n darkOpacityLayer={darkOpacityLayer}\n lightOpacityLayer={lightOpacityLayer}\n >\n <div className=\"CardImageOverlayTheme\"></div>\n <div className=\"promoVehicleContainerPadding\">\n <div className=\"promoVehicleContainer\">\n <div className=\"vehicleTitleContainer\">\n {label &&\n (labelVariant === 'feature' ? (\n <Label type=\"feature\" className=\"CardImageLabelFeature\" variant=\"primary\">\n {handleMaxChars(label, 30)}\n </Label>\n ) : (\n <Label className=\"CardImageLabel\" label={handleMaxChars(label, 30)}></Label>\n ))}\n {vehicleName && (\n <h2 style={{ margin: 0 }} className=\"vehicleName\">\n {handleMaxChars(vehicleName, 20)}\n </h2>\n )}\n {equipment && (\n <h4 style={{ margin: 0 }} className=\"vehicleEquipment\">\n {handleMaxChars(equipment, 20)}\n </h4>\n )}\n {description && (\n <div className=\"CardImageSubtitleContainer\">\n <span className=\"CardImageSubtitle\">{handleMaxChars(description, 50)}</span>\n </div>\n )}\n <div className=\"LabelsOptional\">\n {labelInfoFirstText && (\n <div>\n <Label\n type=\"feature\"\n variant={labelInfoFirstVariant}\n label={handleMaxChars(labelInfoFirstText, 30)}\n />\n </div>\n )}\n {labelInfoSecondText && (\n <div>\n <Label\n type=\"feature\"\n variant={labelInfoSecondVariant}\n label={handleMaxChars(labelInfoSecondText, 30)}\n />\n </div>\n )}\n </div>\n </div>\n <div className=\"promoVehicleImage\">\n <ImageComponent image={image} alt={altDescriptionImage} fallbackImage={fallbackImage} />\n </div>\n <div className=\"promoVehicleInfo\">\n <div className=\"promoVehicleButtons\">\n {mandatoryButtonObject?.label && (\n <ButtonCardComponent\n className=\"button-component\"\n buttonObject={mandatoryButtonObject}\n compact={isCompact}\n />\n )}\n {optionalButtonObject?.label && (\n <ButtonCardComponent\n className=\"button-component\"\n buttonObject={optionalButtonObject}\n compact={isCompact}\n />\n )}\n </div>\n {customInfo ? (\n <div className=\"infoText\">{customInfo}</div>\n ) : (\n <InfoTextCardComponent\n infoText={infoText}\n infoTextSecond={infoTextSecond}\n infoTextThird={infoTextThird}\n className=\"infoText\"\n />\n )}\n </div>\n {isMenuDropdown && <MenuCardComponent {...menuCardComponentProps} />}\n </div>\n </div>\n </CardPromoVehicleComponentStyled>\n );\n};\n\nexport default CardPromoVehicleComponent;\n\nconst handleOpacity = (darkOpacityLayer?: string, lightOpacityLayer?: string): string => {\n let opacity = '';\n switch (lightOpacityLayer) {\n case 'opacity25':\n opacity = 'linear-gradient(269.68deg, rgba(255, 255, 255, 0) 0.28%, rgba(255, 255, 255, 0.25) 99.72%)';\n break;\n case 'opacity50':\n opacity = 'linear-gradient(269.68deg, rgba(255, 255, 255, 0) 0.28%, rgba(255, 255, 255, 0.5) 99.72%)';\n break;\n case 'opacity75':\n opacity = 'linear-gradient(269.68deg, rgba(255, 255, 255, 0) 0.28%, rgba(255, 255, 255, 0.75) 99.72%)';\n break;\n }\n switch (darkOpacityLayer) {\n case 'opacity25':\n opacity = 'linear-gradient(269.68deg, rgba(0, 0, 0, 0) 0.28%, rgba(0, 0, 0, 0.25) 99.72%)';\n break;\n case 'opacity50':\n opacity = 'linear-gradient(269.68deg, rgba(0, 0, 0, 0) 0.28%, rgba(0, 0, 0, 0.5) 99.72%)';\n break;\n case 'opacity75':\n opacity = 'linear-gradient(269.68deg, rgba(0, 0, 0, 0) 0.28%, rgba(0, 0, 0, 0.75) 99.72%)';\n break;\n }\n return opacity;\n};\n\nconst handleTextColor = (darkOpacityLayer?: string, lightOpacityLayer?: string, theme?: Theme): string => {\n let color = '';\n if (lightOpacityLayer !== 'opacity0' && darkOpacityLayer === 'opacity0') {\n color = theme.palette.text.primary;\n }\n if (darkOpacityLayer !== 'opacity0') {\n color = theme.palette.onSurface.os0;\n } else color = theme.palette.text.primary;\n return color;\n};\n\n/*\n @description cardPromoVehicleComponent styling definition based on props\n */\n\nconst CardPromoVehicleComponentStyled = styled(MuiCard, {\n shouldForwardProp: (prop) => prop !== 'darkOpacityLayer' && prop !== 'lightOpacityLayer' && prop !== 'size',\n})<MuiCardProps & { darkOpacityLayer?: string; lightOpacityLayer?: string; size?: string }>(({ theme, ...props }) => {\n const opacityLayer = handleOpacity(props.darkOpacityLayer, props.lightOpacityLayer);\n const textColor = handleTextColor(props.darkOpacityLayer, props.lightOpacityLayer, theme);\n let style = {};\n\n style = {\n position: 'relative',\n width: '100%',\n padding: '24px',\n backgroundColor: theme.palette.transparent.primary,\n color: textColor,\n '& .LabelsOptional': {\n display: 'flex',\n flexWrap: 'wrap',\n position: 'relative',\n zIndex: 2,\n },\n '& .promoVehicleImage': {\n marginTop: '-45px',\n position: 'relative',\n [theme.breakpoints.up('md')]: {\n position: props.size === 'fixed' ? 'absolute' : 'relative',\n marginTop: props.size === 'fixed' ? 0 : '-45px',\n },\n\n zIndex: 0,\n width: '100%',\n height: '100%',\n display: 'flex',\n justifyContent: 'center',\n ' & > img': {\n minHeight: '176px',\n maxWidth: '100%',\n maxHeight: '100%',\n position: 'relative',\n objectFit: 'contain',\n },\n },\n '& .promoVehicleContainerPadding': {\n position: 'relative',\n height: '100%',\n width: '100%',\n },\n '& .promoVehicleContainer': {\n overflow: 'hidden',\n height: '100%',\n width: '100%',\n flexDirection: 'column',\n display: 'flex',\n justifyContent: props.size === 'fixed' ? 'space-between' : 'normal',\n boxSizing: 'border-box',\n ' & > .vehicleTitleContainer': {\n zIndex: 2,\n width: '100%',\n position: 'relative',\n '& > .vehicleName': {\n fontSize: '23px',\n [theme.breakpoints.up('md')]: {\n fontSize: '24px',\n },\n lineHeight: '28px',\n },\n '& > .vehicleEquipment': {\n fontSize: '16px',\n [theme.breakpoints.up('md')]: {\n fontSize: '18px',\n },\n lineHeight: '24px',\n },\n '& > .CardImageLabelFeature': {\n marginLeft: '0px !important',\n marginBottom: '8px',\n },\n '& > .CardImageLabel': {\n lineHeight: '12px !important',\n marginBottom: '8px',\n },\n '& > .CardImageSubtitleContainer': {\n display: 'inline-flex',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n width: '100%',\n '& > .CardImageSubtitle': {\n fontSize: '16px',\n lineHeight: '24px',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n [theme.breakpoints.up('lg')]: {\n fontSize: '18px',\n lineHeight: '28px',\n },\n },\n },\n },\n '& > .promoVehicleInfo': {\n marginTop: '-25px',\n position: 'relative',\n [theme.breakpoints.up('md')]: {\n marginTop: props.size === 'fixed' ? 0 : '-25px',\n },\n\n display: 'flex',\n flexDirection: 'column-reverse',\n flexWrap: 'wrap-reverse',\n width: '100%',\n justifyContent: 'space-between',\n zIndex: 2,\n [theme.breakpoints.up('md')]: {\n flexDirection: 'row',\n },\n '& > .promoVehicleButtons': {\n display: 'flex',\n flexDirection: 'column',\n alignItems: 'end',\n flexWrap: 'wrap',\n gap: '12px 16px',\n marginTop: '8px',\n '& > .button-component': {\n width: '100%',\n [theme.breakpoints.up('md')]: {\n width: 'auto',\n padding: '0 0 2px 2px',\n },\n ' > div': {\n width: '100%',\n },\n },\n '& .MuiButton-root': {\n width: '100%',\n },\n [theme.breakpoints.up('md')]: {\n flexDirection: 'row',\n '& > a': {\n '& + a': {\n marginTop: '0',\n },\n },\n },\n },\n ' & > .infoText': {\n display: 'block',\n maxWidth: '100%',\n fontSize: '14px',\n [theme.breakpoints.up('md')]: {\n width: 'auto',\n alignSelf: 'end',\n },\n ' & > div > p': {\n margin: 0,\n },\n '.infoTextFirst': {\n fontWeight: 'bold',\n span: { fontWeight: '300' },\n },\n '.infoTextThirdContainer': {\n display: 'inline-flex',\n maxWidth: '100%',\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n },\n '.infoTextThird': {\n whiteSpace: 'nowrap',\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n },\n },\n },\n ' & >.menuCardComponent': {\n top: '-7px',\n right: '-5px',\n },\n },\n ' & >.CardImageOverlayTheme': {\n background: opacityLayer,\n },\n };\n return style;\n});\n"],"names":["CardPromoVehicleComponent","label","labelVariant","vehicleName","equipment","image","altDescriptionImage","mandatoryButtonObject","optionalButtonObject","darkOpacityLayer","lightOpacityLayer","menuCardComponentProps","isMenuDropdown","infoText","infoTextSecond","infoTextThird","customInfo","description","labelInfoFirstVariant","labelInfoFirstText","labelInfoSecondVariant","labelInfoSecondText","isCompact","size","fallbackImage","_jsxs","CardPromoVehicleComponentStyled","_jsx","className","children","Label","type","variant","handleMaxChars","style","margin","ImageComponent","alt","ButtonCardComponent","buttonObject","compact","InfoTextCardComponent","MenuCardComponent","styled","MuiCard","shouldForwardProp","prop","_a","theme","props","__rest","opacityLayer","opacity","handleOpacity","textColor","color","palette","text","primary","onSurface","os0","handleTextColor","position","width","padding","backgroundColor","transparent","display","flexWrap","zIndex","marginTop","breakpoints","up","height","justifyContent","minHeight","maxWidth","maxHeight","objectFit","overflow","flexDirection","boxSizing","fontSize","lineHeight","marginLeft","marginBottom","whiteSpace","textOverflow","alignItems","gap","alignSelf","fontWeight","span","top","right","background"],"mappings":"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"}

package/cjs/organisms/cardTypeOnly/cardTypeOnly.js CHANGED Viewed

@@ -1,4 +1,4 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("react"),r=require("@mui/material"),i=require("./cardTypeOnlyComponent.js"),a=require("../common/styled/cardStandardWrapperStyled.js"),n=require("../../utils/utilities.js");const d=t.forwardRef(((t,r)=>e.jsx(a.CardStandardWrapperStyled,{isBorderRadius:t.isBorderRadius,ref:r,children:e.jsx(o,{children:e.jsx(i.default,Object.assign({isCompact:!0},t))})}))),o=r.styled(r.Card)`
+"use strict";var e=require("react/jsx-runtime"),t=require("react"),r=require("@mui/material"),i=require("./cardTypeOnlyComponent.js"),a=require("../common/styled/cardStandardWrapperStyled.js"),n=require("../../utils/utilities.js");const d=t.forwardRef((t,r)=>e.jsx(a.CardStandardWrapperStyled,{isBorderRadius:t.isBorderRadius,ref:r,children:e.jsx(o,{children:e.jsx(i.default,Object.assign({isCompact:!0},t))})})),o=r.styled(r.Card)`
   width: 100%;
   box-shadow: none;
   background-color: #f6f7f8ff !important;

package/cjs/organisms/cardTypeOnly/cardTypeOnly.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"cardTypeOnly.js","sources":["../../../../../src/organisms/cardTypeOnly/cardTypeOnly.tsx"],"sourcesContent":["import React, { HTMLAttributes, forwardRef } from 'react';\nimport { Card as MuiCard, CardProps as MuiCardProps, styled } from '@mui/material';\nimport CardTypeOnlyComponent from './cardTypeOnlyComponent';\nimport { DarkOpacity, LightOpacity } from '../common/cardOpacitylayer/cardOpacityTyping';\nimport { CardStandardWrapperStyled } from '../common/styled/cardStandardWrapperStyled';\nimport { ButtonVariants } from '../..';\nimport { opacityLayerSwitchDarkStatement, opacityLayerSwitchLightStatement } from '../../utils/utilities';\n\n/*\n @interface ChipProps\n * @description Base definition of SkodaFlow Chip independent on core implementation.\n * Properties are inherited from HTML div element\n /\nexport interface CardTypeOnlyProps extends HTMLAttributes<HTMLDivElement> {\n /\n If true borderRadius was added to entire card\n /\n isBorderRadius?: boolean;\n\n /\n Text is showing if the card configurator is empty\n /\n cardTypeOnlyText?: string;\n /\n Mandatory button object. The button is displayed if the label text is present\n /\n mandatoryButtonObject?: {\n label?: string;\n variant?: ButtonVariants;\n url?: string;\n target?: string;\n callback?: (payload?: any) => void;\n callbackAnalytics?: (payload?: any) => void;\n };\n\n /\n Optional button object. The button is displayed if the label text is present\n /\n optionalButtonObject?: {\n label?: string;\n variant?: ButtonVariants;\n url?: string;\n target?: string;\n callback?: (payload?: any) => void;\n callbackAnalytics?: (payload?: any) => void;\n };\n\n /\n A dark gradient layer was added\n /\n darkOpacity?: DarkOpacity;\n\n /\n A light gradient layer was added\n /\n lightOpacity?: LightOpacity;\n\n /\n Uses for setting button size based on screensize\n /\n isCompact?: boolean;\n}\n\n/\n @description SkodaFlow Chip component.\n * Properties are inherited from HTML Div element.\n * @param props ChipProps\n * @returns React Functional Component\n * @deprecated\n /\nexport const CardTypeOnly = forwardRef<HTMLDivElement, CardTypeOnlyProps>((props, ref) => {\n return (\n <CardStandardWrapperStyled isBorderRadius={props.isBorderRadius} ref={ref}>\n <CardTypeOnlyStyled>\n <CardTypeOnlyComponent isCompact={true} {...props} />\n </CardTypeOnlyStyled>\n </CardStandardWrapperStyled>\n );\n});\n\n/\n @description Hero Image Card styling definition based on props\n */\nconst CardTypeOnlyStyled = styled(MuiCard)<MuiCardProps & { children?: any; theme?: any }>`\n width: 100%;\n box-shadow: none;\n background-color: #f6f7f8ff !important;\n padding: 24px;\n min-height: 300px;\n ${(props) => {\n if (props.children.props.emptyCardText) {\n return 'background-image: none';\n }\n }};\n background-repeat: no-repeat, repeat;\n background-color: ${(props) => {\n return props.theme.palette.onSurface.os0;\n }};\n\n color: ${(props) => {\n if (props.children.props.lightOpacity !== 'opacity0' && props.children.props.darkOpacity === 'opacity0') {\n return props.theme.palette.text.primary;\n } else if (props.children.props.darkOpacity !== 'opacity0') {\n return props.theme.palette.onSurface.os0;\n }\n }};\n\n ${(props) => {\n if (props.theme.shape.borderRadius) {\n return 'border-radius: 0;';\n }\n }}\n\n ${(props) => {\n if (props.children.props.isBorderRadius) {\n return 'border-radius: 8px;';\n }\n }}\n\t.CardImageText {\n text-align: center;\n ${(props) => {\n if (props.children.props.cardTypeOnlyText) {\n return 'justify-content: center';\n }\n }};\n .CardImageSubtitle {\n font-size: 16px;\n line-height: 24px;\n @media (min-width: ${(props) => props.theme.breakpoints.values.xl}px) {\n font-size: 18px;\n line-height: 28px;\n }\n }\n .emptyCardText {\n align-self: center;\n margin-bottom: 17px;\n }\n }\n .CardImageButtonsContainerContent {\n display: flex;\n justify-content: space-between;\n width: 100%;\n flex-direction: column-reverse;\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n flex-direction: row;\n }\n }\n .CardImageButtonsContainer {\n display: flex;\n justify-content: space-between;\n width: 100%;\n }\n .CardImageButtons {\n justify-content: center;\n gap: 12px 16px;\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n flex-direction: row;\n flex-wrap: wrap;\n }\n .button-component {\n width: 100%;\n div {\n width: 100%;\n }\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n width: auto;\n }\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n width: auto;\n font-size: 14px;\n }\n }\n }\n .CardImageOverlayTheme {\n ${(props) => {\n return opacityLayerSwitchLightStatement(props.children.props.lightOpacity, 'background');\n }};\n\n ${(props) => {\n return opacityLayerSwitchDarkStatement(props.children.props.darkOpacity, 'background');\n }}\n }\n`;\n"],"names":["CardTypeOnly","forwardRef","props","ref","_jsx","CardStandardWrapperStyled","isBorderRadius","children","CardTypeOnlyStyled","CardTypeOnlyComponent","Object","assign","isCompact","styled","MuiCard","emptyCardText","theme","palette","onSurface","os0","lightOpacity","darkOpacity","text","primary","shape","borderRadius","cardTypeOnlyText","breakpoints","values","xl","md","opacityLayerSwitchLightStatement","opacityLayerSwitchDarkStatement"],"mappings":"uOAsEO,MAAMA,EAAeC,EAAAA,~~YAA8C~~,CAACC,EAAOC,IAE9EC,MAACC,EAAAA,0BAAyB,CAACC,eAAgBJ,EAAMI,eAAgBH,IAAKA,EAAGI,SACvEH,EAAAA,IAACI,EAAkB,CAAAD,SACjBH,MAACK,EAAAA,QAAqBC,OAAAC,OAAA,CAACC,WAAW,GAAUV,~~UAS9CM~~,EAAqBK,EAAAA,OAAOC,EAAAA,KAAwD;;;;;;IAMrFZ,IACD,GAAIA,EAAMK,SAASL,MAAMa,cACvB,MAAO~~,wBACT~~;;~~sBAGmBb~~,GACZA,EAAMc,MAAMC,QAAQC,UAAUC;;WAG7BjB,GACkC,aAAtCA,EAAMK,SAASL,MAAMkB,cAAoE,aAArClB,EAAMK,SAASL,MAAMmB,YACpEnB,EAAMc,MAAMC,QAAQK,KAAKC,QACc,aAArCrB,EAAMK,SAASL,MAAMmB,YACvBnB,EAAMc,MAAMC,QAAQC,UAAUC,SADhC;;IAKNjB,IACD,GAAIA,EAAMc,MAAMQ,MAAMC,aACpB,MAAO~~,mBACT~~;;~~IAGCvB~~,IACD,GAAIA,EAAMK,SAASL,MAAMI,eACvB,MAAO~~,qBACT~~;;;~~MAIGJ~~,IACD,GAAIA,EAAMK,SAASL,MAAMwB,iBACvB,MAAO~~,yBACT~~;;;;~~2BAKsBxB~~,GAAUA,EAAMc,MAAMW,YAAYC,OAAOC;;;;;;;;;;;;;;;yBAe3C3B,GAAUA,EAAMc,MAAMW,YAAYC,OAAOE;;;;;;;;;;;;yBAYzC5B,GAAUA,EAAMc,MAAMW,YAAYC,OAAOE;;;;;;;;;2BASvC5B,GAAUA,EAAMc,MAAMW,YAAYC,OAAOE;;;2BAGzC5B,GAAUA,EAAMc,MAAMW,YAAYC,OAAOE;;;;;;;MAO9D5B,GACM6B,EAAAA,iCAAiC7B,EAAMK,SAASL,MAAMkB,aAAc;;MAG1ElB,GACM8B,EAAAA,gCAAgC9B,EAAMK,SAASL,MAAMmB,YAAa;;"}
1	+ {"version":3,"file":"cardTypeOnly.js","sources":["../../../../../src/organisms/cardTypeOnly/cardTypeOnly.tsx"],"sourcesContent":["import React, { HTMLAttributes, forwardRef } from 'react';\nimport { Card as MuiCard, CardProps as MuiCardProps, styled } from '@mui/material';\nimport CardTypeOnlyComponent from './cardTypeOnlyComponent';\nimport { DarkOpacity, LightOpacity } from '../common/cardOpacitylayer/cardOpacityTyping';\nimport { CardStandardWrapperStyled } from '../common/styled/cardStandardWrapperStyled';\nimport { ButtonVariants } from '../..';\nimport { opacityLayerSwitchDarkStatement, opacityLayerSwitchLightStatement } from '../../utils/utilities';\n\n/*\n @interface ChipProps\n * @description Base definition of SkodaFlow Chip independent on core implementation.\n * Properties are inherited from HTML div element\n /\nexport interface CardTypeOnlyProps extends HTMLAttributes<HTMLDivElement> {\n /\n If true borderRadius was added to entire card\n /\n isBorderRadius?: boolean;\n\n /\n Text is showing if the card configurator is empty\n /\n cardTypeOnlyText?: string;\n /\n Mandatory button object. The button is displayed if the label text is present\n /\n mandatoryButtonObject?: {\n label?: string;\n variant?: ButtonVariants;\n url?: string;\n target?: string;\n callback?: (payload?: any) => void;\n callbackAnalytics?: (payload?: any) => void;\n };\n\n /\n Optional button object. The button is displayed if the label text is present\n /\n optionalButtonObject?: {\n label?: string;\n variant?: ButtonVariants;\n url?: string;\n target?: string;\n callback?: (payload?: any) => void;\n callbackAnalytics?: (payload?: any) => void;\n };\n\n /\n A dark gradient layer was added\n /\n darkOpacity?: DarkOpacity;\n\n /\n A light gradient layer was added\n /\n lightOpacity?: LightOpacity;\n\n /\n Uses for setting button size based on screensize\n /\n isCompact?: boolean;\n}\n\n/\n @description SkodaFlow Chip component.\n * Properties are inherited from HTML Div element.\n * @param props ChipProps\n * @returns React Functional Component\n * @deprecated\n /\nexport const CardTypeOnly = forwardRef<HTMLDivElement, CardTypeOnlyProps>((props, ref) => {\n return (\n <CardStandardWrapperStyled isBorderRadius={props.isBorderRadius} ref={ref}>\n <CardTypeOnlyStyled>\n <CardTypeOnlyComponent isCompact={true} {...props} />\n </CardTypeOnlyStyled>\n </CardStandardWrapperStyled>\n );\n});\n\n/\n @description Hero Image Card styling definition based on props\n */\nconst CardTypeOnlyStyled = styled(MuiCard)<MuiCardProps & { children?: any; theme?: any }>`\n width: 100%;\n box-shadow: none;\n background-color: #f6f7f8ff !important;\n padding: 24px;\n min-height: 300px;\n ${(props) => {\n if (props.children.props.emptyCardText) {\n return 'background-image: none';\n }\n }};\n background-repeat: no-repeat, repeat;\n background-color: ${(props) => {\n return props.theme.palette.onSurface.os0;\n }};\n\n color: ${(props) => {\n if (props.children.props.lightOpacity !== 'opacity0' && props.children.props.darkOpacity === 'opacity0') {\n return props.theme.palette.text.primary;\n } else if (props.children.props.darkOpacity !== 'opacity0') {\n return props.theme.palette.onSurface.os0;\n }\n }};\n\n ${(props) => {\n if (props.theme.shape.borderRadius) {\n return 'border-radius: 0;';\n }\n }}\n\n ${(props) => {\n if (props.children.props.isBorderRadius) {\n return 'border-radius: 8px;';\n }\n }}\n\t.CardImageText {\n text-align: center;\n ${(props) => {\n if (props.children.props.cardTypeOnlyText) {\n return 'justify-content: center';\n }\n }};\n .CardImageSubtitle {\n font-size: 16px;\n line-height: 24px;\n @media (min-width: ${(props) => props.theme.breakpoints.values.xl}px) {\n font-size: 18px;\n line-height: 28px;\n }\n }\n .emptyCardText {\n align-self: center;\n margin-bottom: 17px;\n }\n }\n .CardImageButtonsContainerContent {\n display: flex;\n justify-content: space-between;\n width: 100%;\n flex-direction: column-reverse;\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n flex-direction: row;\n }\n }\n .CardImageButtonsContainer {\n display: flex;\n justify-content: space-between;\n width: 100%;\n }\n .CardImageButtons {\n justify-content: center;\n gap: 12px 16px;\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n flex-direction: row;\n flex-wrap: wrap;\n }\n .button-component {\n width: 100%;\n div {\n width: 100%;\n }\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n width: auto;\n }\n @media (min-width: ${(props) => props.theme.breakpoints.values.md}px) {\n width: auto;\n font-size: 14px;\n }\n }\n }\n .CardImageOverlayTheme {\n ${(props) => {\n return opacityLayerSwitchLightStatement(props.children.props.lightOpacity, 'background');\n }};\n\n ${(props) => {\n return opacityLayerSwitchDarkStatement(props.children.props.darkOpacity, 'background');\n }}\n }\n`;\n"],"names":["CardTypeOnly","forwardRef","props","ref","_jsx","CardStandardWrapperStyled","isBorderRadius","children","CardTypeOnlyStyled","CardTypeOnlyComponent","Object","assign","isCompact","styled","MuiCard","emptyCardText","theme","palette","onSurface","os0","lightOpacity","darkOpacity","text","primary","shape","borderRadius","cardTypeOnlyText","breakpoints","values","xl","md","opacityLayerSwitchLightStatement","opacityLayerSwitchDarkStatement"],"mappings":"uOAsEO,MAAMA,EAAeC,EAAAA,WAA8C,CAACC,EAAOC,IAE9EC,MAACC,EAAAA,0BAAyB,CAACC,eAAgBJ,EAAMI,eAAgBH,IAAKA,EAAGI,SACvEH,EAAAA,IAACI,EAAkB,CAAAD,SACjBH,MAACK,EAAAA,QAAqBC,OAAAC,OAAA,CAACC,WAAW,GAAUV,SAS9CM,EAAqBK,EAAAA,OAAOC,EAAAA,KAAwD;;;;;;IAMrFZ,IACD,GAAIA,EAAMK,SAASL,MAAMa,cACvB,MAAO;;sBAIUb,GACZA,EAAMc,MAAMC,QAAQC,UAAUC;;WAG7BjB,GACkC,aAAtCA,EAAMK,SAASL,MAAMkB,cAAoE,aAArClB,EAAMK,SAASL,MAAMmB,YACpEnB,EAAMc,MAAMC,QAAQK,KAAKC,QACc,aAArCrB,EAAMK,SAASL,MAAMmB,YACvBnB,EAAMc,MAAMC,QAAQC,UAAUC,SADhC;;IAKNjB,IACD,GAAIA,EAAMc,MAAMQ,MAAMC,aACpB,MAAO;;IAIRvB,IACD,GAAIA,EAAMK,SAASL,MAAMI,eACvB,MAAO;;;MAKNJ,IACD,GAAIA,EAAMK,SAASL,MAAMwB,iBACvB,MAAO;;;;2BAMaxB,GAAUA,EAAMc,MAAMW,YAAYC,OAAOC;;;;;;;;;;;;;;;yBAe3C3B,GAAUA,EAAMc,MAAMW,YAAYC,OAAOE;;;;;;;;;;;;yBAYzC5B,GAAUA,EAAMc,MAAMW,YAAYC,OAAOE;;;;;;;;;2BASvC5B,GAAUA,EAAMc,MAAMW,YAAYC,OAAOE;;;2BAGzC5B,GAAUA,EAAMc,MAAMW,YAAYC,OAAOE;;;;;;;MAO9D5B,GACM6B,EAAAA,iCAAiC7B,EAAMK,SAASL,MAAMkB,aAAc;;MAG1ElB,GACM8B,EAAAA,gCAAgC9B,EAAMK,SAASL,MAAMmB,YAAa;;"}

package/cjs/organisms/carousel/carousel.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";var e=require("react/jsx-runtime"),t=require("react"),l=require("embla-carousel-react"),r=require("embla-carousel-class-names"),s=require("embla-carousel-autoplay"),o=require("./styledComponents/styledCarouselHorizontal.js"),a=require("./styledComponents/styledCarouselVertical.js"),n=require("@mui/material"),i=require("./carouselTemplate.js");function c(e){return e&&e.__esModule?e:{default:e}}var u=c(l),d=c(r),S=c(s);const m=(e,t)=>{e&&("ltr"===t?e.scrollPrev():e.scrollNext())},p=(e,t)=>{e&&("rtl"===t?e.scrollPrev():e.scrollNext())},h=(e,t)=>{e&&e.scrollTo(t)},x=(e,t)=>{const l=e.slideNodes();t<=1&&l.forEach((e=>{if(e){const t=e.querySelector("img");if(t)return e.style.width=`${t.naturalWidth}px`}}))};exports.DeprecatedCarousel=l=>{const{align:r="start",autoPlay:s=!1,axis:c="x",buttonAreaControlsHeight:b="50%",buttonControls:f=!0,buttonControlsPosition:C="0",cssClass:g="",direction:y="ltr",heightSlide:T,isSlideDifferentWidth:v=!1,loop:q=!1,numberingSeparator:w="/",numberingSlides:I=!0,progressbar:j=!1,slidesItems:P,slideToScroll:k=1,slideToShow:N=1,slideSelectedClass:z="slide-selected",speed:M=10,startIndex:W=0,bulletScroll:D=!1,bulletStyle:E="dot",bulletTheme:H="dark",prevControlIcon:O="arrow-left",nextControlIcon:V="arrow-right",controlIconStyle:$="regular",controlIconFontSize:_="medium",controlVariant:A="standard",controlColor:F="dark"}=l,B={playOnInit:!!s},G=S.default(B),J={selected:z},K="center"!==r?"trimSnaps":"",[L,Q]=t.useState(W),[R,U]=t.useState(!0),[X,Y]=t.useState(!0),[Z,ee]=t.useState(0),[te,le]=t.useState(!1),[re,se]=t.useState(),[oe,ae]=t.useState(""),ne={align:r,axis:c,containScroll:K,direction:y,loop:q,slidesToScroll:re?1:k,skipSnaps:!1,speed:M,startIndex:W},[ie,ce]=u.default(ne,[G,d.default(J)]),ue=n.useTheme(),de=e=>{le(!te),(e=>{switch(!0){case"prev"===e&&R:return ae("embla-container-prev");case"next"===e&&X:return ae("embla-container-next");default:ae("")}})(e)},Se=t.useCallback((()=>{if(!ce&&!j)return;const e=Math.max(0,Math.min(1,ce.scrollProgress()));ee(100*e)}),[ce,j,ee]);return t.useEffect((()=>{if(ce){x(ce,N);const e=()=>{const e=ce.selectedScrollSnap();Q(e),Q(ce.selectedScrollSnap()),U(ce.canScrollPrev()),Y(ce.canScrollNext())};ce.on("select",e),e(),ce.on("scroll",Se),Se()}}),[ce,j,Se,N]),t.useEffect((()=>{const e=window.matchMedia(`(max-width: ${ue.breakpoints.values.md}px)`);se(e.matches)}),[ue.breakpoints.values.md]),"y"===c?e.jsx(a.CarouselStyledVertical,Object.assign({align:r,slidesItems:P,slideToShow:N,bulletTheme:H},l,{children:i.template(g,te,R,ce,y,ie,P,T,f,b,C,X,I,L,w,j,Z,(e=>de(e)),N,oe,D,E,h,m,p,O,V,$,_,A,F)})):e.jsx(o.CarouselStyledHorizontal,Object.assign({isSlideDifferentWidth:v,align:r,slidesItems:P,slideToShow:N,bulletTheme:H},l,{children:i.template(g,te,R,ce,y,ie,P,T,f,b,C,X,I,L,w,j,Z,(e=>de(e)),N,oe,D,E,h,m,p,O,V,$,_,A,F)}))},exports.emblaWidthSize=x,exports.handleScrollNext=p,exports.handleScrollPrev=m,exports.handleScrollTo=h;
+"use strict";var e=require("react/jsx-runtime"),t=require("react"),l=require("embla-carousel-react"),r=require("embla-carousel-class-names"),s=require("embla-carousel-autoplay"),o=require("./styledComponents/styledCarouselHorizontal.js"),a=require("./styledComponents/styledCarouselVertical.js"),n=require("@mui/material"),i=require("./carouselTemplate.js");function c(e){return e&&e.__esModule?e:{default:e}}var u=c(l),d=c(r),S=c(s);const m=(e,t)=>{e&&("ltr"===t?e.scrollPrev():e.scrollNext())},p=(e,t)=>{e&&("rtl"===t?e.scrollPrev():e.scrollNext())},h=(e,t)=>{e&&e.scrollTo(t)},x=(e,t)=>{const l=e.slideNodes();t<=1&&l.forEach(e=>{if(e){const t=e.querySelector("img");if(t)return e.style.width=`${t.naturalWidth}px`}})};exports.DeprecatedCarousel=l=>{const{align:r="start",autoPlay:s=!1,axis:c="x",buttonAreaControlsHeight:b="50%",buttonControls:f=!0,buttonControlsPosition:C="0",cssClass:g="",direction:y="ltr",heightSlide:T,isSlideDifferentWidth:v=!1,loop:q=!1,numberingSeparator:w="/",numberingSlides:I=!0,progressbar:j=!1,slidesItems:P,slideToScroll:k=1,slideToShow:N=1,slideSelectedClass:z="slide-selected",speed:M=10,startIndex:W=0,bulletScroll:D=!1,bulletStyle:E="dot",bulletTheme:H="dark",prevControlIcon:O="arrow-left",nextControlIcon:V="arrow-right",controlIconStyle:$="regular",controlIconFontSize:_="medium",controlVariant:A="standard",controlColor:F="dark"}=l,B={playOnInit:!!s},G=S.default(B),J={selected:z},K="center"!==r?"trimSnaps":"",[L,Q]=t.useState(W),[R,U]=t.useState(!0),[X,Y]=t.useState(!0),[Z,ee]=t.useState(0),[te,le]=t.useState(!1),[re,se]=t.useState(),[oe,ae]=t.useState(""),ne={align:r,axis:c,containScroll:K,direction:y,loop:q,slidesToScroll:re?1:k,skipSnaps:!1,speed:M,startIndex:W},[ie,ce]=u.default(ne,[G,d.default(J)]),ue=n.useTheme(),de=e=>{le(!te),(e=>{switch(!0){case"prev"===e&&R:return ae("embla-container-prev");case"next"===e&&X:return ae("embla-container-next");default:ae("")}})(e)},Se=t.useCallback(()=>{if(!ce&&!j)return;const e=Math.max(0,Math.min(1,ce.scrollProgress()));ee(100*e)},[ce,j,ee]);return t.useEffect(()=>{if(ce){x(ce,N);const e=()=>{const e=ce.selectedScrollSnap();Q(e),Q(ce.selectedScrollSnap()),U(ce.canScrollPrev()),Y(ce.canScrollNext())};ce.on("select",e),e(),ce.on("scroll",Se),Se()}},[ce,j,Se,N]),t.useEffect(()=>{const e=window.matchMedia(`(max-width: ${ue.breakpoints.values.md}px)`);se(e.matches)},[ue.breakpoints.values.md]),"y"===c?e.jsx(a.CarouselStyledVertical,Object.assign({align:r,slidesItems:P,slideToShow:N,bulletTheme:H},l,{children:i.template(g,te,R,ce,y,ie,P,T,f,b,C,X,I,L,w,j,Z,e=>de(e),N,oe,D,E,h,m,p,O,V,$,_,A,F)})):e.jsx(o.CarouselStyledHorizontal,Object.assign({isSlideDifferentWidth:v,align:r,slidesItems:P,slideToShow:N,bulletTheme:H},l,{children:i.template(g,te,R,ce,y,ie,P,T,f,b,C,X,I,L,w,j,Z,e=>de(e),N,oe,D,E,h,m,p,O,V,$,_,A,F)}))},exports.emblaWidthSize=x,exports.handleScrollNext=p,exports.handleScrollPrev=m,exports.handleScrollTo=h;
 //# sourceMappingURL=carousel.js.map