{"version":3,"names":["createSchemes","newSchemes","AllColors.CAPTION_SCHEMES","forEach","element","schemeName","contentColor","AllColors","toConstantCase","backgroundColor","leftBorderColor","scheme","CAPTION_SCHEME_CONFIG","CAPTION_SCHEME_MAP","Map","Object","entries","createCaptionMapDefinition","map","background","config","captionCss","EonUiCaptionStyle0","Caption","this","schemeConfig","schemeMap","containerBreakpoints","initContainerBreakpoints","initContainerBreakpointsDelegate","hostElement","componentWillLoad","applyScheme","componentDidLoad","setCssVariables","windowOnResize","applySchemeDelegate","setCssVariablesDelegate","isMobile","isTablet","isDesktopLarge","handleCaptionPlacement","window","setTimeout","contentElement","copyrightElement","copyrightVerticalPlacement","contentIsWrapped","wrapperElement","offsetWidth","parseInt","getComputedStyle","getPropertyValue","querySelector","render","h","Host","key","caption","copyright","class","pfx","ref","el","IMAGE_LOCALIZATION","en","ariaLabel","phone","mail","download","default","de","sv","nl","it","hu","da","fr","es","pl","ro","hr","cs","sl","imageCss","EonUiImageStyle0","Image","resizeThrottleMs","dimensionInSrcPath","localization","IMAGE_DEFAULT_VIOLATOR_VERTICAL_POSITION","IMAGE_DEFAULT_VIOLATOR_HORIZONTAL_POSITION","TARGET_SELF","setCurrentLocalization","computeObjectPosition","imageLazyLoading","rootMargin","setCaption","setAlt","setTitle","setWidth","setAspectRatio","computeAriaLabel","handleImageDimensionsIfPossible","hasViolator","getFirstNestedChild","setPlaceHolderDimensionCssVars","imageLoaded","emit","removeContextMenu","objectPositionX","positionX","objectPositionY","positionY","objectPosition","preventUserInteraction","removeEventListener","event","preventUserInteractionOnImage","addEventListener","setCurrentLocalizationDelegate","handleResize","resizeTimeout","setPlaceHolderDimension","preventDefault","imageDimensionSplitCharacter","getImageDimensionsFromSource","extractImageDimensionFromSource","src","dimension","patterNumber","patterSeparator","rx","RegExp","dimensionString","exec","tempDimensionArr","length","split","width","height","srcDimension","srcMobile","srcMobileDimension","srcTablet","srcTabletDimension","srcDesktop","srcDesktopDimension","srcDesktopL","srcDesktopLDimension","placeHolderDimensionWidth","getValueForScreenSize","_a","mobile","_b","tablet","_c","desktop","_d","desktopL","_e","placeHolderDimensionHeight","_f","_g","_h","_j","_k","setCssVariable","lazy","IntersectionObserver","imageObserver","entry","isIntersecting","image","target","isVisible","unobserve","observe","handleClick","_event","openModalId","openModal","imageClick","finalCaption","captionMobile","captionTablet","captionDesktop","captionDesktopL","finalAlt","alt","altMobile","altTablet","altDesktop","altDesktopL","finalTitle","titleDefault","titleMobile","titleTablet","titleDesktop","titleDesktopL","finalWidth","widthMobile","widthTablet","widthDesktop","widthDesktopL","finalAspectRatio","aspectRatio","aspectRatioMobile","aspectRatioTablet","aspectRatioDesktop","aspectRatioDesktopL","linkAriaLabel","currentLocalization","currentAriaLabel","computeLinkAriaLabel","linkHref","autoWidth","Boolean","isCover","isPlaceholder","useAsBackground","isFixedRatio","isBackground","hostWidth","style","onClick","ConditionalWrapper","condition","wrapper","imageTag","title","linkTitle","href","linkTarget","defaultWrapper","srcSet","media","objectFit","onLoad","imageSrcLoaded","shadowOnImage","brightShadowOnImage","violatorVerticalPosition","violatorHorizontalPosition","name","captionCopyright","captionVerticalBreakpoint"],"sources":["src/components/caption/constants/caption-constants.ts","src/components/caption/caption.scss?tag=eon-ui-caption&encapsulation=shadow","src/components/caption/caption.tsx","src/components/image/constants/image-i18n.ts","src/components/image/image.scss?tag=eon-ui-image&encapsulation=shadow","src/components/image/image.tsx"],"sourcesContent":["import { CaptionSchemeDefinition } from \"./caption-types\";\nimport { BackgroundColor } from \"../../background/constants/background-types\";\nimport * as AllColors from \"../../../constants/colors\";\n\nimport { toConstantCase } from \"../../../utils/string-format\";\nimport { createCaptionMapDefinition } from \"../../../utils/scheme-helper\";\n\nfunction createSchemes() {\n let newSchemes: AllColors.CaptionSchemeConfiguration = {};\n AllColors.CAPTION_SCHEMES.forEach((element) => {\n newSchemes[element.schemeName] = {\n contentColor: AllColors[`COLOR_${toConstantCase(element.schemeName)}_FONT`],\n backgroundColor: AllColors[`COLOR_${toConstantCase(element.schemeName)}`],\n leftBorderColor: AllColors[`COLOR_${toConstantCase(element.schemeName)}_TINT_1`]\n };\n if (element.scheme) {\n newSchemes[element.schemeName] = { ...newSchemes[element.schemeName], ...element.scheme };\n }\n });\n return newSchemes;\n}\n\nexport const CAPTION_SCHEME_CONFIG: AllColors.CaptionSchemeConfiguration = createSchemes();\n\nexport const CAPTION_SCHEME_MAP: Map = new Map(\n Object.entries(createCaptionMapDefinition()).map(([background, config]) => [\n background as BackgroundColor,\n CAPTION_SCHEME_CONFIG[config as string]\n ])\n);\n","/**\n * THEME JSON CONFIG CSS VARS\n * The following default component scss variables can be overwritten via theme configuration per brand.\n * If you need to add new one, please make sure to set a default value.\n * JSON Definition for Component with name \"Example\": testCssVar: \"20px\"\n * Resulting CSS var: $example-test-css-var: 20px;\n * JSON Definition for Component with name \"Example\": testCssVar: \"20px\"\n * Resulting CSS var: $example-test-css-var: 20px;\n */\n\n/* END THEME JSON CONFIG CSS VARS ******************************************************* */\n\n:host {\n display: block;\n font-family: $font-family-base;\n}\n\n.#{$prefix}caption-copyright-wrapper {\n display: flex;\n flex-direction: row;\n padding: 48px;\n background-color: v(backgroundColor);\n box-sizing: border-box;\n\n // has to be set for width calculation if both caption and copyright are set.\n &.#{$prefix}caption-and-copyright {\n white-space: nowrap;\n }\n\n .#{$prefix}caption-content {\n padding-right: 20px;\n max-width: 75%;\n font-weight: $font-weight-medium;\n\n eon-ui-text {\n color: v(contentColor);\n }\n\n &.#{$prefix}no-copyright {\n max-width: 100%;\n padding-bottom: 0 !important;\n }\n }\n\n .#{$prefix}copyright-content {\n padding-left: 20px;\n border-left: 1px solid v(leftBorderColor);\n\n eon-ui-text {\n color: v(contentColor);\n }\n }\n\n @include for-size(desktop-or-smaller) {\n .#{$prefix}caption-content {\n padding-right: 16px;\n }\n\n .#{$prefix}copyright-content {\n padding-left: 16px;\n }\n }\n\n @include for-size(phone) {\n flex-direction: column;\n\n .#{$prefix}caption-content {\n padding-right: 0;\n max-width: 100%;\n padding-bottom: 8px;\n }\n\n .#{$prefix}copyright-content {\n border-left: none;\n padding-left: 0;\n max-width: 100%;\n }\n }\n\n &.#{$prefix}no-caption {\n justify-content: flex-end;\n\n .#{$prefix}copyright-content {\n border-left: none;\n max-width: 100%;\n }\n }\n\n &.#{$prefix}vertical {\n flex-direction: column;\n white-space: normal;\n\n .#{$prefix}caption-content {\n padding-right: 0;\n max-width: 100%;\n padding-bottom: 20px;\n\n @include for-size(desktop-or-smaller) {\n padding-bottom: 16px;\n }\n\n @include for-size(tablet-or-smaller) {\n padding-bottom: 8px;\n }\n }\n\n .#{$prefix}copyright-content {\n border-left: none;\n padding-left: 0;\n max-width: 100%;\n }\n }\n}\n\n:host(.container-breakpoint-1200) {\n .#{$prefix}caption-copyright-wrapper {\n padding: 40px;\n }\n}\n\n:host(.container-breakpoint-800) {\n .#{$prefix}caption-copyright-wrapper {\n padding: 32px;\n }\n}\n\n:host(.container-breakpoint-400) {\n .#{$prefix}caption-copyright-wrapper {\n padding: 24px;\n }\n}\n","import { Component, Element, h, Host, Listen, Prop, State, Watch } from \"@stencil/core\";\nimport { applySchemeDelegate, ColorableComponent, setCssVariablesDelegate } from \"../../common/colorable-component\";\nimport { CaptionSchemeDefinition, CaptionSchemeName } from \"./constants/caption-types\";\nimport { CAPTION_SCHEME_CONFIG, CAPTION_SCHEME_MAP } from \"./constants/caption-constants\";\nimport pfx from \"../../utils/style-class-prefix-helper\";\nimport { isDesktopLarge, isMobile, isTablet } from \"../../utils/screen-helper\";\nimport { CaptionSchemeConfiguration } from \"../../constants/colors\";\nimport {\n ContainerBreakpointComponent,\n initContainerBreakpointsDelegate\n} from \"../../common/container-breakpoint-component\";\n// import { InitLogging } from \"../../decorators/init-logging\";\n\n@Component({\n tag: \"eon-ui-caption\",\n styleUrl: \"caption.scss\",\n shadow: true\n})\nexport class Caption\n implements ColorableComponent>, ContainerBreakpointComponent {\n // @InitLogging() sentryTransaction;\n schemeConfig: CaptionSchemeConfiguration = CAPTION_SCHEME_CONFIG;\n schemeMap = CAPTION_SCHEME_MAP;\n contentElement: HTMLElement;\n copyrightElement: HTMLElement;\n wrapperElement: HTMLElement;\n\n /**\n * Array that defines component specific container breakpoints.\n */\n containerBreakpoints = [1200, 800, 400];\n\n @State() isMobile: boolean;\n @State() isTablet: boolean;\n @State() isDesktopLarge: boolean;\n @State() copyrightVerticalPlacement: boolean;\n\n /**\n * The components active scheme. If {@link scheme} is set, it will be set to the corresponding scheme.\n * If not set, the component will try to calculate it based on the nearest enclosing background information given by inner-background attribute or eon-ui-background component.\n */\n @State() activeScheme: CaptionSchemeDefinition;\n\n @Element() hostElement: HTMLEonUiCaptionElement;\n\n /**\n * The name of the color scheme of the component.\n * If not set, the component will try to calculate it based on the nearest enclosing background information given by inner-background attribute or eon-ui-background component.\n */\n @Prop({ reflect: true }) scheme: CaptionSchemeName;\n\n /**\n * Caption content\n */\n @Prop({ reflect: true, mutable: true }) caption: string;\n\n /**\n * copyright content\n */\n @Prop({ reflect: true }) copyright: string;\n\n initContainerBreakpoints(): void {\n initContainerBreakpointsDelegate(this.hostElement, this.containerBreakpoints);\n }\n\n componentWillLoad() {\n this.applyScheme();\n this.initContainerBreakpoints();\n }\n\n componentDidLoad() {\n this.setCssVariables();\n this.windowOnResize();\n }\n\n @Watch(\"scheme\")\n applyScheme() {\n applySchemeDelegate(this);\n }\n\n @Watch(\"activeScheme\")\n setCssVariables(): void {\n setCssVariablesDelegate(this);\n }\n\n @Listen(\"resize\", { target: \"window\" })\n windowOnResize() {\n this.isMobile = isMobile();\n this.isTablet = isTablet();\n this.isDesktopLarge = isDesktopLarge();\n this.handleCaptionPlacement();\n }\n\n @Watch(\"caption\")\n handleCaptionPlacement() {\n window.setTimeout(() => {\n // only if caption and copyright exist start with calculation\n if (this.contentElement && this.copyrightElement) this.copyrightVerticalPlacement = this.contentIsWrapped();\n }, 0);\n }\n\n private contentIsWrapped() {\n return (\n this.wrapperElement.offsetWidth -\n parseInt(window.getComputedStyle(this.wrapperElement).getPropertyValue(\"padding-right\")) * 2 <\n this.contentElement.querySelector(\"eon-ui-text\").offsetWidth +\n this.copyrightElement.querySelector(\"eon-ui-text\").offsetWidth +\n (this.copyrightVerticalPlacement\n ? 16 * 2\n : parseInt(window.getComputedStyle(this.contentElement).getPropertyValue(\"padding-right\")) * 2) +\n 1\n );\n }\n\n render() {\n return (\n \n {(this.caption || this.copyright) && (\n (this.wrapperElement = el as HTMLElement)}\n >\n {this.caption && (\n (this.contentElement = el as HTMLElement)}\n >\n {this.caption}\n \n )}\n {this.copyright && (\n
(this.copyrightElement = el as HTMLElement)}>\n {this.copyright}\n
\n )}\n \n )}\n \n );\n }\n}\n","import { Localization } from \"../../../common/localizable-component\";\nimport { ImageLocalization } from \"./image-types\";\n\nexport const IMAGE_LOCALIZATION: Localization = {\n en: {\n ariaLabel: {\n phone: \"Call phone number {0}\",\n mail: \"Send a mail to {0}\",\n download: \"Download {0}\",\n default: \"Navigate to {0}\"\n }\n },\n de: {\n ariaLabel: {\n phone: \"Rufe {0} an\",\n mail: \"Verfasse eine E-Mail an {0}\",\n download: \"{0} herunterladen\",\n default: \"Navigiere zu {0}\"\n }\n },\n sv: {\n ariaLabel: {\n phone: \"Ring telefonnummer {0}\",\n mail: \"Skicka e-post till {0}\",\n download: \"Ladda ner {0}\",\n default: \"Gå till {0}\"\n }\n },\n nl: {\n ariaLabel: {\n phone: \"Bel telefoonnummer {0}\",\n mail: \"Stuur een mail naar {0}\",\n download: \"Download {0}\",\n default: \"Navigeer naar {0}\"\n }\n },\n it: {\n ariaLabel: {\n phone: \"Chiama il numero di telefono {0}\",\n mail: \"Manda una mail a {0}\",\n download: \"Scarica {0}\",\n default: \"Naviga su {0}\"\n }\n },\n hu: {\n ariaLabel: {\n phone: \"Telefonszám hívása {0}\",\n mail: \"E-mail küldése {0}\",\n download: \"{0} db fájl letöltése\",\n default: \"Tovább a {0}\"\n }\n },\n da: {\n ariaLabel: {\n phone: \"Ring til nummer {0}\",\n mail: \"Send mail til {0}\",\n download: \"Download {0}\",\n default: \"Gå til {0}\"\n }\n },\n fr: {\n ariaLabel: {\n phone: \"Appeler le numéro de téléphone {0}\",\n mail: \"Envoyer un mail à {0}\",\n download: \"Télécharger {0}\",\n default: \"Naviguer à {0}\"\n }\n },\n es: {\n ariaLabel: {\n phone: \"Llama al número de teléfono {0}\",\n mail: \"Enviar un email a {0}\",\n download: \"Descargar {0}\",\n default: \"Navega a {0}\"\n }\n },\n pl: {\n ariaLabel: {\n phone: \"Zadzwoń pod numer telefonu {0}\",\n mail: \"Wyślij maila na adres {0}\",\n download: \"Pobierz {0}\",\n default: \"Przejdź do {0}\"\n }\n },\n ro: {\n ariaLabel: {\n phone: \"Sună la numărul de telefon {0}\",\n mail: \"Trimiteți un e-mail la {0}\",\n download: \"Descărcați {0}\",\n default: \"Navigați la {0}\"\n }\n },\n hr: {\n ariaLabel: {\n phone: \"Nazovi telefonski broj {0}\",\n mail: \"Pošalji e-poštu na {0}\",\n download: \"Preuzmi {0}\",\n default: \"Idite do {0}\"\n }\n },\n cs: {\n ariaLabel: {\n phone: \"Volejte na telefonní číslo {0}\",\n mail: \"Pošlete mail na {0}\",\n download: \"Stáhnout {0}\",\n default: \"Přejděte na {0}\"\n }\n },\n sl: {\n ariaLabel: {\n phone: \"Pokličite telefonsko številko {0}\",\n mail: \"Pošljite pošto na {0}\",\n download: \"Prenesite {0}\",\n default: \"Navigacija v {0}\"\n }\n }\n};\n","/**\n * THEME JSON CONFIG CSS VARS\n * The following default component scss variables can be overwritten via theme configuration per brand.\n * If you need to add new one, please make sure to set a default value.\n * JSON Definition for Component with name \"Example\": testCssVar: \"20px\"\n * Resulting CSS var: $example-test-css-var: 20px;\n */\n\n$image-radius: 0 !default;\n$image-shadow: none !default;\n\n/* END THEME JSON CONFIG CSS VARS ******************************************************* */\n\n$background-gradient: linear-gradient(rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.2) 0%);\n$background-gradient-bright: linear-gradient(rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.4) 0%);\n\n:host {\n display: flex;\n max-width: 100%;\n font-family: $font-family-base;\n}\n\n:host([use-as-background=\"\"]),\n:host([use-as-background=\"true\"]) {\n @include position-absolute();\n width: 100%;\n height: 100%;\n z-index: auto;\n\n .#{$prefix}image-caption-container,\n .#{$prefix}image-container {\n width: 100% !important;\n height: 100% !important;\n }\n}\n\n.#{$prefix}image-caption-container {\n position: relative;\n width: 100%;\n max-width: 100%;\n display: flex;\n flex-direction: column;\n box-shadow: $image-shadow;\n border-radius: $image-radius;\n\n @if $image-radius != 0 {\n overflow: hidden;\n }\n\n .#{$prefix}image-container {\n position: relative;\n width: 100%;\n max-width: 100%;\n height: auto;\n overflow: hidden;\n display: block;\n\n &.#{$prefix}cover,\n &.#{$prefix}fixedRatio,\n &.#{$prefix}background {\n figure {\n width: 100%;\n height: 100%;\n\n picture {\n width: 100%;\n height: 100%;\n display: flex;\n\n img {\n width: 100%;\n height: 100%;\n object-fit: cover;\n }\n }\n }\n }\n\n figure {\n position: relative;\n margin: 0;\n display: inline;\n\n picture {\n position: relative;\n display: inline;\n\n img {\n width: 100%;\n max-width: 100%;\n display: block;\n }\n }\n }\n\n &.#{$prefix}ratio-2x1 {\n &::after {\n @include aspect-ratio(2, 1);\n }\n }\n\n &.#{$prefix}ratio-2x3 {\n &::after {\n @include aspect-ratio(2, 3);\n }\n }\n\n &.#{$prefix}ratio-16x9 {\n &::after {\n @include aspect-ratio(16, 9);\n }\n }\n\n &.#{$prefix}ratio-1x1 {\n &::after {\n @include aspect-ratio(1, 1);\n }\n }\n\n &.#{$prefix}ratio-3x4 {\n &::after {\n @include aspect-ratio(3, 4);\n }\n }\n\n &.#{$prefix}ratio-4x3 {\n &::after {\n @include aspect-ratio(4, 3);\n }\n }\n\n &.#{$prefix}ratio-3x1 {\n &::after {\n @include aspect-ratio(3, 1);\n }\n }\n\n &.#{$prefix}placeholder {\n &::after {\n content: \"\";\n padding-top: calc((var(--placeholderDimensionHeight) / var(--placeholderDimensionWidth)) * 100%);\n display: block;\n }\n }\n\n &.#{$prefix}ratio-2x1,\n &.#{$prefix}ratio-2x3,\n &.#{$prefix}ratio-16x9,\n &.#{$prefix}ratio-1x1,\n &.#{$prefix}ratio-3x4,\n &.#{$prefix}ratio-4x3,\n &.#{$prefix}ratio-3x1,\n &.#{$prefix}placeholder {\n figure {\n @include position-absolute();\n }\n }\n\n .#{$prefix}image-shadow-overlay {\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n background: $background-gradient;\n }\n\n .#{$prefix}image-shadow-overlay-bright {\n position: absolute;\n left: 0;\n top: 0;\n width: 100%;\n height: 100%;\n background: $background-gradient-bright;\n }\n\n .#{$prefix}image-violator {\n position: absolute;\n\n @mixin setMargin($margin) {\n &.#{$prefix}v-top {\n top: $margin;\n }\n\n &.#{$prefix}v-bottom {\n bottom: $margin;\n }\n\n &.#{$prefix}v-center {\n top: 50%;\n transform: translateY(-50%);\n }\n\n &.#{$prefix}left {\n left: $margin;\n }\n\n &.#{$prefix}center {\n left: 50%;\n transform: translateX(-50%);\n }\n\n &.#{$prefix}center {\n &.#{$prefix}v-center {\n left: 50%;\n top: 50%;\n transform: translate(-50%, -50%);\n }\n }\n\n &.#{$prefix}right {\n right: $margin;\n }\n }\n\n @include for-size(desktop-l-or-larger) {\n @include setMargin(32px);\n }\n\n @include for-size(desktop) {\n @include setMargin(24px);\n }\n\n @include for-size(tablet-or-smaller) {\n @include setMargin(16px);\n }\n }\n }\n}\n\n::slotted(eon-ui-violator) {\n display: block;\n}\n","import { Component, Element, h, Prop, Watch, State, Listen, Event, EventEmitter, Host } from \"@stencil/core\";\nimport { AspectRatio } from \"../../common/types\";\nimport { ImageLocalization, ImageBackgroundSize } from \"./constants/image-types\";\nimport pfx from \"../../utils/style-class-prefix-helper\";\nimport { openModal } from \"../../utils/openModal\";\nimport { getValueForScreenSize } from \"../../utils/screen-helper\";\nimport { LinkTarget } from \"../link/constants/link-types\";\nimport { TARGET_SELF } from \"../link/constants/link-constants\";\nimport { LocalizableComponent, Localization, setCurrentLocalizationDelegate } from \"../../common/localizable-component\";\nimport { computeLinkAriaLabel } from \"../../utils/link-helper\";\nimport { IMAGE_LOCALIZATION } from \"./constants/image-i18n\";\nimport { ConditionalWrapper } from \"../../common/conditional-wrapper\";\nimport { getFirstNestedChild } from \"../../utils/dom-helper\";\nimport { setCssVariable } from \"../../utils/css-variables\";\nimport {\n ImageViolatorVerticalPosition,\n ImageViolatorHorizontalPosition,\n IMAGE_DEFAULT_VIOLATOR_VERTICAL_POSITION,\n IMAGE_DEFAULT_VIOLATOR_HORIZONTAL_POSITION\n} from \"../../constants/global-constants\";\n// import { InitLogging } from \"../../decorators/init-logging\";\n\n/**\n * @slot violator - Holds a single eon-ui-violator element\n */\n@Component({\n tag: \"eon-ui-image\",\n styleUrl: \"image.scss\",\n assetsDirs: [\"assets-image\"],\n shadow: true\n})\nexport class Image implements LocalizableComponent {\n // @InitLogging() sentryTransaction;\n resizeTimeout: NodeJS.Timeout;\n resizeThrottleMs = 300;\n\n private dimensionInSrcPath: boolean = false;\n private srcDimension;\n private srcMobileDimension;\n private srcTabletDimension;\n private srcDesktopDimension;\n private srcDesktopLDimension;\n private placeHolderDimensionWidth;\n private placeHolderDimensionHeight;\n private hasViolator: boolean;\n\n @State() private objectPosition: string;\n @State() private isVisible = false;\n\n /**\n * Caption can be different in each screen size. This holds the current one.\n */\n @State() private finalCaption: string;\n\n /**\n * Alt attribute can be different in each screen size. This holds the current one.\n */\n @State() private finalAlt: string;\n\n /**\n * Title attribute can be different in each screen size. This holds the current one.\n */\n @State() private finalTitle: string;\n\n /**\n * Title attribute can be different in each screen size. This holds the current one.\n */\n @State() private finalWidth: string;\n\n /**\n * Alt attribute can be different in each screen size. This holds the current one.\n */\n @State() private finalAspectRatio: string;\n\n localization: Localization = IMAGE_LOCALIZATION;\n currentLocalization: ImageLocalization;\n\n private currentAriaLabel: string;\n\n @Element() hostElement: HTMLEonUiImageElement;\n\n /**\n * Can be set to provide further information about the image, e.g. if it's appearance is bright or dark.\n */\n @Prop() appearance: \"bright\" | \"dark\";\n\n /**\n * Defines vertical position of the violator\n */\n // eslint-disable-next-line @stencil-community/decorators-style\n @Prop({ mutable: true })\n violatorVerticalPosition: ImageViolatorVerticalPosition = IMAGE_DEFAULT_VIOLATOR_VERTICAL_POSITION;\n\n /**\n * Defines horizontal position of the violator\n */\n // eslint-disable-next-line @stencil-community/decorators-style\n @Prop({ mutable: true })\n violatorHorizontalPosition: ImageViolatorHorizontalPosition = IMAGE_DEFAULT_VIOLATOR_HORIZONTAL_POSITION;\n\n /**\n * Defines the image source that should be displayed on the desktop-large viewport.\n */\n @Prop() srcDesktopL: string;\n\n /**\n * Defines the image source that should be displayed on the desktop viewport.\n */\n @Prop() srcDesktop: string;\n\n /**\n * Defines the image source that should be displayed on the tablet viewport.\n */\n @Prop() srcTablet: string;\n\n /**\n * Defines the image source that should be displayed on the mobile/phone viewport.\n */\n @Prop() srcMobile: string;\n\n /**\n * Defines the original image source that is used by the image. Use this if you\n * don't need src values dependant on the screen size. If any of the size-aware\n * src values is not set, the image will fall to the value of \"src\".\n */\n @Prop() src: string;\n\n /**\n * Defines the value of the alt attribute for the image passed to \"src\" (default one).\n */\n @Prop() alt: string;\n\n /**\n * Defines the alt that should be displayed on the desktop-large viewport.\n */\n @Prop() altDesktopL: string;\n\n /**\n * Defines the alt that should be displayed on the desktop viewport.\n */\n @Prop() altDesktop: string;\n\n /**\n * Defines the alt that should be displayed on the tablet viewport.\n */\n @Prop() altTablet: string;\n\n /**\n * Defines the alt that should be displayed on the mobile/phone viewport.\n */\n @Prop() altMobile: string;\n\n /**\n * Defines the width of the image. If not set, image width sticks to the format of the image on the desktop-large viewport.\n * Image can adapt full width of the container it is placed in, Only when value of width is \"100%\"\n * @example \"200px\", \"100%\"\n */\n @Prop({ mutable: true }) widthDesktopL: string;\n\n /**\n * Defines the width of the image. If not set, image width sticks to the format of the image on the desktop viewport.\n * Image can adapt full width of the container it is placed in, Only when value of width is \"100%\"\n * @example \"200px\", \"100%\"\n */\n @Prop({ mutable: true }) widthDesktop: string;\n\n /**\n * Defines the width of the image. If not set, image width sticks to the format of the image on the tablet viewport.\n * Image can adapt full width of the container it is placed in, Only when value of width is \"100%\"\n * @example \"200px\", \"100%\"\n */\n @Prop({ mutable: true }) widthTablet: string;\n\n /**\n * Defines the width of the image. If not set, image width sticks to the format of the image on the mobile/phone viewport.\n * Image can adapt full width of the container it is placed in, Only when value of width is \"100%\"\n * @example \"200px\", \"100%\"\n */\n @Prop({ mutable: true }) widthMobile: string;\n\n /**\n * Defines the width of the image. If not set, image width sticks to the format of the image.\n * Image can adapt full width of the container it is placed in, Only when value of width is \"100%\"\n * @example \"200px\", \"100%\"\n */\n @Prop({ mutable: true }) width: string = \"100%\";\n\n /**\n * Defines the height of the image. If not set, image height sticks to the format of the image.\n * Image can adapt full height of the container it is placed inside, Only when value of height is \"auto\"\n * @example \"200px\", \"100px\"\n */\n @Prop() height: string;\n\n /**\n * Defines the horizontal image position.\n * @example \"left\", \"center\", \"right\", \"30px\"\n * @default \"center\"\n */\n @Prop({ mutable: true }) positionX: string = \"center\";\n\n /**\n * Defines the vertical image position.\n * @example \"top\", \"center\", \"bottom\", \"30px\"\n * @default \"center\"\n */\n @Prop({ mutable: true }) positionY: string = \"center\";\n\n /**\n * Set this to true if the image will be used as a full size background image of the parent div.\n */\n @Prop({ reflect: true }) useAsBackground: boolean;\n\n /**\n * If image is used in background mode you can define if css background-size \"cover\" or \"contain\" should be set.\n */\n @Prop({ reflect: true, mutable: true }) objectFit: ImageBackgroundSize;\n\n /**\n * Defines the aspect ratio of the image.\n */\n @Prop() aspectRatio: AspectRatio;\n\n /**\n * Defines the aspect ratio for desktop breakpoint.\n */\n @Prop() aspectRatioDesktop: AspectRatio;\n\n /**\n * Defines the aspect ratio for desktop large breakpoint.\n */\n @Prop() aspectRatioDesktopL: AspectRatio;\n\n /**\n * Defines the aspect ratio for tablet breakpoint.\n */\n @Prop() aspectRatioTablet: AspectRatio;\n\n /**\n * Defines the aspect ratio for mobile breakpoint.\n */\n @Prop() aspectRatioMobile: AspectRatio;\n\n /**\n * Defines the caption for the image passed to \"src\" (default one).\n */\n @Prop() caption: string;\n\n /**\n * Defines the caption that should be displayed on the desktop-large viewport.\n */\n @Prop() captionDesktopL: string;\n\n /**\n * Defines the caption that should be displayed on the desktop viewport.\n */\n @Prop() captionDesktop: string;\n\n /**\n * Defines the caption that should be displayed on the tablet viewport.\n */\n @Prop() captionTablet: string;\n\n /**\n * Defines the caption that should be displayed on the mobile/phone viewport.\n */\n @Prop() captionMobile: string;\n\n /**\n * Allows to set a copyright text for caption component.\n */\n @Prop() captionCopyright: string;\n\n /**\n * If this is set, copywrite will come in a new line beneath the caption at the defined pixel value. By that it is possible to control line wrap independently of breakpoint, but based on the image width.\n */\n @Prop() captionVerticalBreakpoint: number;\n\n /**\n * If enabled, the image will be loaded lazily when it's visible in the viewport. Defaults to false.\n */\n @Prop({ mutable: true }) lazy: boolean = false;\n\n /**\n * rootMargin: the image will be loaded lazily when it is \"rootMargin\" pixels away from entering the viewport.\n * Instead of loading the image just when they exactly enter the viewport,\n * load the images when they are, suppose 300px away from entering the viewport.\n * This provides additional time, between the load trigger and the actual entry in the viewport, for the images to load.\n */\n @Prop({ mutable: true }) rootMargin: string = \"100\";\n\n /**\n * If enabled, the image is overlaid with a 20% opacity E.ON darkgrey tint.\n */\n @Prop({ mutable: true }) shadowOnImage: boolean = false;\n\n /**\n * If enabled, the image is overlaid with a 40% opacity E.ON white tint.\n */\n @Prop({ mutable: true }) brightShadowOnImage: boolean = false;\n\n /**\n * use this property to open a modal, the modal must have the same modal-id
\n * see component: Modal\n */\n\n @Prop() openModalId: string;\n\n /**\n * Defines the value of the title attribute for the image passed to \"title\" (default one).\n */\n @Prop() titleDefault: string;\n\n /**\n * Defines the title that should be displayed on the desktop-large viewport\n */\n @Prop() titleDesktopL: string;\n\n /**\n * Defines the title that should be displayed on the desktop viewport.\n */\n @Prop() titleDesktop: string;\n\n /**\n * Defines the title that should be displayed on the tablet viewport\n */\n @Prop() titleTablet: string;\n\n /**\n * Defines the title that should be displayed on the mobile/phone viewport\n */\n @Prop() titleMobile: string;\n\n /**\n * Specifies the label to use for accessibility.\n * If not set a computed aria label will set e.g. \"navigate to..\". It depends on the closet lang attribute-\n */\n @Prop() linkAriaLabel: string;\n\n /**\n * Defines the target url of a image.\n * Valid protocols are \"http://\", \"https://\", \"mailto:\" and \"tel:\".\n */\n @Prop() linkHref: string;\n\n /**\n * Specifies how the link is opened in the browser, e.g. in new window/tab.\n * @example \"_blank\", \"_self\", \"_parent\", \"_top\"\n * @default \"_self\"\n */\n @Prop({ mutable: true }) linkTarget: LinkTarget = TARGET_SELF;\n\n /**\n * this property sets the title of the link\n */\n @Prop({ mutable: true }) linkTitle: string;\n\n /**\n * this property disable the context menu of this image (disable right click, dragging, mousedown on image)\n */\n @Prop() preventUserInteraction: boolean = false;\n\n /**\n * Triggered when the component has been loaded\n */\n @Event() imageLoaded: EventEmitter;\n\n /**\n * Triggered when the image src has been loaded\n */\n @Event() imageSrcLoaded: EventEmitter;\n\n /**\n * Raised when the image has been clicked.\n */\n @Event() imageClick: EventEmitter;\n\n /**\n * If defined, component will parse image src strings based on the given character to get dimensions.\n * sizes should be available in the following format with a flexible character inbetween: [WIDTH][CHARACTER][HEIGHT].\n * e.g. 1024x768, 1024.768\n * \\d{1,}\\x\\d{1,}\n */\n @Prop() imageDimensionSplitCharacter: string;\n\n componentWillLoad() {\n this.setCurrentLocalization();\n this.computeObjectPosition();\n this.imageLazyLoading(this.hostElement, `${this.rootMargin}px`);\n this.setCaption();\n this.setAlt();\n this.setTitle();\n this.setWidth();\n this.setAspectRatio();\n this.computeAriaLabel();\n this.handleImageDimensionsIfPossible();\n this.hasViolator = !!getFirstNestedChild(this.hostElement, \"eon-ui-violator\");\n }\n\n componentDidLoad() {\n this.setPlaceHolderDimensionCssVars();\n this.imageLoaded.emit();\n this.removeContextMenu();\n }\n\n @Watch(\"positionX\")\n @Watch(\"positionY\")\n private computeObjectPosition() {\n const objectPositionX: string = this.positionX ? this.positionX : \"center\";\n const objectPositionY: string = this.positionY ? this.positionY : \"center\";\n this.objectPosition = `${objectPositionX} ${objectPositionY}`;\n }\n\n @Watch(\"preventUserInteraction\")\n removeContextMenu() {\n if (!this.preventUserInteraction) {\n this.hostElement.removeEventListener(\"contextmenu\", (event) => {\n this.preventUserInteractionOnImage(event);\n });\n this.hostElement.removeEventListener(\"mousedown\", (event) => {\n this.preventUserInteractionOnImage(event);\n });\n } else {\n this.hostElement.addEventListener(\"contextmenu\", (event) => {\n this.preventUserInteractionOnImage(event);\n });\n this.hostElement.addEventListener(\"mousedown\", (event) => {\n this.preventUserInteractionOnImage(event);\n });\n }\n }\n\n setCurrentLocalization() {\n setCurrentLocalizationDelegate(this);\n }\n\n @Listen(\"resize\", { target: \"window\" })\n handleResize() {\n if (!this.resizeTimeout) {\n this.resizeTimeout = setTimeout(() => {\n this.setCaption();\n this.setAlt();\n this.setTitle();\n this.setWidth();\n this.setAspectRatio();\n this.resizeTimeout = null;\n if (this.dimensionInSrcPath) this.setPlaceHolderDimension();\n this.setPlaceHolderDimensionCssVars();\n }, this.resizeThrottleMs);\n }\n }\n\n preventUserInteractionOnImage(event: Event) {\n if (this.preventUserInteraction) event.preventDefault();\n }\n\n handleImageDimensionsIfPossible() {\n if (this.imageDimensionSplitCharacter) {\n this.getImageDimensionsFromSource();\n if (this.dimensionInSrcPath) this.setPlaceHolderDimension();\n }\n }\n\n private extractImageDimensionFromSource(src: string) {\n let dimension;\n let patterNumber = \"\\\\d{1,}\";\n let patterSeparator = `\\\\${this.imageDimensionSplitCharacter}`;\n let rx = new RegExp(`${patterNumber}${patterSeparator}${patterNumber}`, \"g\");\n let dimensionString = rx.exec(src);\n\n if (dimensionString) {\n // get last image dimension available in string\n let tempDimensionArr = dimensionString[dimensionString.length - 1].split(this.imageDimensionSplitCharacter);\n\n dimension = {\n width: tempDimensionArr[0],\n height: tempDimensionArr[1]\n };\n }\n\n return dimension;\n }\n\n private getImageDimensionsFromSource() {\n this.src && (this.srcDimension = this.extractImageDimensionFromSource(this.src));\n this.srcMobile && (this.srcMobileDimension = this.extractImageDimensionFromSource(this.srcMobile));\n this.srcTablet && (this.srcTabletDimension = this.extractImageDimensionFromSource(this.srcTablet));\n this.srcDesktop && (this.srcDesktopDimension = this.extractImageDimensionFromSource(this.srcDesktop));\n this.srcDesktopL && (this.srcDesktopLDimension = this.extractImageDimensionFromSource(this.srcDesktopL));\n\n if (this.srcDimension) this.dimensionInSrcPath = true;\n }\n\n private setPlaceHolderDimension() {\n this.placeHolderDimensionWidth = getValueForScreenSize(this.srcDimension?.width, {\n mobile: this.srcMobileDimension?.width,\n tablet: this.srcTabletDimension?.width,\n desktop: this.srcDesktopDimension?.width,\n desktopL: this.srcDesktopLDimension?.width\n });\n\n this.placeHolderDimensionHeight = getValueForScreenSize(this.srcDimension?.height, {\n mobile: this.srcMobileDimension?.height,\n tablet: this.srcTabletDimension?.height,\n desktop: this.srcDesktopDimension?.height,\n desktopL: this.srcDesktopLDimension?.height\n });\n }\n\n private setPlaceHolderDimensionCssVars() {\n if (this.placeHolderDimensionWidth && this.placeHolderDimensionHeight) {\n setCssVariable(this.hostElement, `--placeholderDimensionWidth`, `${this.placeHolderDimensionWidth}`);\n setCssVariable(this.hostElement, `--placeholderDimensionHeight`, `${this.placeHolderDimensionHeight}`);\n }\n }\n\n private imageLazyLoading(element: HTMLElement, rootMargin: string) {\n if (this.lazy && window && window.IntersectionObserver) {\n const imageObserver = new window.IntersectionObserver(\n (entries: IntersectionObserverEntry[]) => {\n entries.forEach((entry) => {\n if (entry.isIntersecting) {\n let image = entry.target;\n this.isVisible = true;\n imageObserver.unobserve(image);\n }\n });\n },\n { rootMargin }\n );\n imageObserver.observe(element);\n }\n }\n\n handleClick(_event: Event) {\n if (!!this.openModalId) {\n openModal(this.openModalId);\n }\n this.imageClick.emit();\n }\n\n @Watch(\"caption\")\n @Watch(\"captionMobile\")\n @Watch(\"captionTablet\")\n @Watch(\"captionDesktop\")\n @Watch(\"captionDesktopL\")\n private setCaption() {\n this.finalCaption = getValueForScreenSize(this.caption, {\n mobile: this.captionMobile,\n tablet: this.captionTablet,\n desktop: this.captionDesktop,\n desktopL: this.captionDesktopL\n });\n }\n\n @Watch(\"alt\")\n @Watch(\"altMobile\")\n @Watch(\"altTablet\")\n @Watch(\"altDesktop\")\n @Watch(\"altDesktopL\")\n private setAlt() {\n this.finalAlt = getValueForScreenSize(this.alt, {\n mobile: this.altMobile,\n tablet: this.altTablet,\n desktop: this.altDesktop,\n desktopL: this.altDesktopL\n });\n }\n\n @Watch(\"titleDefault\")\n @Watch(\"titleMobile\")\n @Watch(\"titleTablet\")\n @Watch(\"titleDesktop\")\n @Watch(\"titleDesktopL\")\n private setTitle() {\n this.finalTitle = getValueForScreenSize(this.titleDefault, {\n mobile: this.titleMobile,\n tablet: this.titleTablet,\n desktop: this.titleDesktop,\n desktopL: this.titleDesktopL\n });\n }\n\n @Watch(\"width\")\n @Watch(\"widthMobile\")\n @Watch(\"widthTablet\")\n @Watch(\"widthDesktop\")\n @Watch(\"widthDesktopL\")\n private setWidth() {\n this.finalWidth = getValueForScreenSize(this.width, {\n mobile: this.widthMobile,\n tablet: this.widthTablet,\n desktop: this.widthDesktop,\n desktopL: this.widthDesktopL\n });\n }\n\n @Watch(\"aspectRatio\")\n @Watch(\"aspectRatioDesktop\")\n @Watch(\"aspectRatioDesktopL\")\n @Watch(\"aspectRatioTablet\")\n @Watch(\"aspectRatioMobile\")\n private setAspectRatio() {\n this.finalAspectRatio = getValueForScreenSize(this.aspectRatio, {\n mobile: this.aspectRatioMobile,\n tablet: this.aspectRatioTablet,\n desktop: this.aspectRatioDesktop,\n desktopL: this.aspectRatioDesktopL\n });\n }\n\n @Watch(\"linkHref\")\n private computeAriaLabel() {\n if (this.linkAriaLabel || !this.currentLocalization) {\n this.currentAriaLabel = this.linkAriaLabel;\n return;\n }\n this.currentAriaLabel = computeLinkAriaLabel(this.currentLocalization, this.linkHref, null);\n }\n\n render() {\n let autoWidth: boolean = Boolean(this.finalWidth === \"auto\" || !this.finalWidth);\n let isCover: boolean = Boolean(this.width && this.height);\n let isPlaceholder: boolean =\n this.imageDimensionSplitCharacter &&\n this.lazy &&\n !this.aspectRatio &&\n !this.useAsBackground &&\n this.dimensionInSrcPath;\n let isFixedRatio: boolean = Boolean(this.aspectRatio) || isPlaceholder;\n let isBackground: boolean = Boolean(this.useAsBackground);\n let ariaLabel = this.linkAriaLabel || this.currentAriaLabel;\n let hostWidth;\n\n // This calculation takes the sizes of the dimensionInSrcPath anytime they are available.\n // Nevertheless, that causes issues when a ratio (2x1) is provided instead of an actual image size.\n if (!isBackground) {\n if (autoWidth) {\n if (this.dimensionInSrcPath) {\n hostWidth = this.placeHolderDimensionWidth + \"px\";\n } else if (this.aspectRatio) {\n hostWidth = \"100%\";\n }\n } else {\n hostWidth = this.finalWidth;\n }\n }\n\n return (\n \n {/* eslint-disable-next-line jsx-a11y/click-events-have-key-events,jsx-a11y/no-static-element-interactions */}\n
this.handleClick(event)}>\n \n (\n \n {imageTag}\n \n )}\n defaultWrapper={(imageTag) => imageTag}\n >\n {/*{this is the image tag}*/}\n
\n \n {(!this.lazy || this.isVisible) && this.srcDesktopL ? (\n \n ) : null}\n {(!this.lazy || this.isVisible) && (this.srcDesktop || this.src) ? (\n \n ) : null}\n {(!this.lazy || this.isVisible) && this.srcTablet ? (\n \n ) : null}\n {(!this.lazy || this.isVisible) && this.srcMobile ? (\n \n ) : null}\n this.imageSrcLoaded.emit()}\n />\n \n
\n {this.shadowOnImage &&
}\n {this.brightShadowOnImage &&
}\n \n {this.hasViolator && (\n \n \n
\n )}\n \n {!isBackground && (this.finalCaption || this.captionCopyright) && (\n \n )}\n \n \n );\n }\n}\n"],"mappings":"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"}