{"version":3,"names":["footerBarCss","EonUiFooterBarStyle0","FooterBar","componentWillLoad","this","hasLogo","hostElement","querySelectorAll","length","hasSocialMediaLinks","hasLinks","i","children","child","tagName","toUpperCase","getAttribute","setAttribute","render","h","key","class","pfx","name","copyright","innerHTML","FOOTER_BAR_SHOW_COLOR_SEPARATOR"],"sources":["src/components/footer-bar/footer-bar.scss?tag=eon-ui-footer-bar&encapsulation=shadow","src/components/footer-bar/footer-bar.tsx"],"sourcesContent":["/**\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$footer-bar-background-color: #ffffff !default;\n$footer-bar-link-color: #262626 !default;\n$footer-bar-link-hover-color: #262626 !default;\n$footer-bar-copyright-color: #999999 !default;\n$section-margin-phone: 24px !default;\n$section-margin-tablet: 32px !default;\n$section-margin-desktop: 40px !default;\n$section-margin-desktop-large: 48px !default;\n\n/* END THEME JSON CONFIG CSS VARS ******************************************************* */\n\n:host {\n display: block;\n font-family: $font-family-base;\n}\n\n::slotted(eon-ui-link) {\n --contentColor: #{$footer-bar-link-color};\n --contentHoverColor: #{$footer-bar-link-hover-color};\n --contentFocusColor: #{$footer-bar-link-hover-color};\n}\n\n::slotted(img) {\n display: block;\n height: 100%;\n}\n\nfooter {\n position: relative;\n background-color: $footer-bar-background-color;\n\n .#{$prefix}footer-content-wrapper {\n position: relative;\n max-width: $content-max-width-desktop-l;\n padding: 48px $section-margin-desktop-large 48px $section-margin-desktop-large;\n margin: 0 auto 0 auto;\n\n @include for-size(desktop) {\n padding: 40px $section-margin-desktop 40px $section-margin-desktop;\n max-width: $content-max-width-desktop;\n }\n\n @include for-size(tablet) {\n padding: 32px $section-margin-tablet 32px $section-margin-tablet;\n max-width: 100%;\n }\n\n @include for-size(phone) {\n padding: 24px $section-margin-phone 24px $section-margin-phone;\n max-width: 100%;\n }\n\n .#{$prefix}footer-top-wrapper {\n position: relative;\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin-bottom: 48px;\n gap: 24px;\n flex-wrap: wrap;\n\n @include for-size(phone) {\n justify-content: flex-start;\n flex-direction: column;\n align-items: flex-start;\n }\n }\n\n .#{$prefix}footer-bottom-wrapper {\n position: relative;\n display: flex;\n justify-content: flex-start;\n gap: 24px;\n flex-wrap: wrap;\n\n .#{$prefix}copyright-content {\n span {\n line-height: 1.9;\n }\n }\n\n @include for-size(phone) {\n flex-direction: column;\n gap: 16px;\n }\n }\n\n .#{$prefix}socialmedia {\n display: flex;\n width: 100%;\n flex-basis: 0%;\n gap: 16px;\n }\n\n .#{$prefix}copyright {\n font-family: $font-family-base;\n font-size: $copy-small-font-size;\n font-weight: $font-weight-regular;\n color: $footer-bar-copyright-color;\n }\n\n .#{$prefix}logo {\n position: relative;\n flex-shrink: 0;\n flex-basis: 20%;\n }\n\n .#{$prefix}links {\n display: flex;\n row-gap: 8px;\n column-gap: 16px;\n flex-wrap: wrap;\n }\n }\n}\n","import { Component, h, Element, Prop } from \"@stencil/core\";\nimport pfx from \"../../utils/style-class-prefix-helper\";\nimport { FOOTER_BAR_SHOW_COLOR_SEPARATOR } from \"../../constants/global-constants\";\n// import { InitLogging } from \"../../decorators/init-logging\";\n\n/**\n * @slot socialmedia - Holds any number of eon-ui-link elements. Set an icon but no text on these links.\n * @slot links - Holds any number of eon-ui-link elements. Set size to small and provide a text for these links.\n * @slot logo - Holds a single eon-ui-image element\n */\n@Component({\n tag: \"eon-ui-footer-bar\",\n styleUrl: \"footer-bar.scss\",\n shadow: true\n})\nexport class FooterBar {\n // @InitLogging() sentryTransaction;\n\n @Element() hostElement: HTMLEonUiFooterBarElement;\n\n /**\n * A text displayed as copyright notice, next to the logo\n * @example \"© E.ON SE 2020\"\n */\n @Prop() copyright: string;\n\n private hasLogo: boolean;\n private hasSocialMediaLinks: boolean;\n private hasLinks: boolean;\n\n componentWillLoad() {\n this.hasLogo = this.hostElement.querySelectorAll(\"[slot='logo']\").length > 0;\n this.hasSocialMediaLinks = this.hostElement.querySelectorAll(\"[slot='socialmedia']\").length > 0;\n this.hasLinks = this.hostElement.querySelectorAll(\"[slot='links']\").length > 0;\n\n for (let i = 0; i < this.hostElement.children.length; i++) {\n const child = this.hostElement.children[i];\n\n if (child.tagName.toUpperCase() === \"EON-UI-LINK\") {\n if (child.getAttribute(\"slot\") === \"links\") {\n child.setAttribute(\"hide-icon\", \"true\");\n }\n }\n }\n }\n\n render() {\n return (\n \n );\n }\n}\n"],"mappings":"0HAAA,MAAMA,EAAe,6n3CACrB,MAAAC,EAAeD,E,MCcFE,EAAS,M,kDAepB,iBAAAC,GACEC,KAAKC,QAAUD,KAAKE,YAAYC,iBAAiB,iBAAiBC,OAAS,EAC3EJ,KAAKK,oBAAsBL,KAAKE,YAAYC,iBAAiB,wBAAwBC,OAAS,EAC9FJ,KAAKM,SAAWN,KAAKE,YAAYC,iBAAiB,kBAAkBC,OAAS,EAE7E,IAAK,IAAIG,EAAI,EAAGA,EAAIP,KAAKE,YAAYM,SAASJ,OAAQG,IAAK,CACzD,MAAME,EAAQT,KAAKE,YAAYM,SAASD,GAExC,GAAIE,EAAMC,QAAQC,gBAAkB,cAAe,CACjD,GAAIF,EAAMG,aAAa,UAAY,QAAS,CAC1CH,EAAMI,aAAa,YAAa,O,IAMxC,MAAAC,GACE,OACEC,EAAA,UAAAC,IAAA,wDAAoB,cAClBD,EAAA,OAAAC,IAAA,2CAAKC,MAAOC,EAAI,4BACZlB,KAAKC,SAAWD,KAAKK,sBACrBU,EAAA,OAAAC,IAAA,2CAAKC,MAAOC,EAAI,uBACdH,EAAA,OAAAC,IAAA,2CAAKC,MAAOC,EAAI,SACdH,EAAA,QAAAC,IAAA,2CAAMG,KAAK,UAEbJ,EAAA,OAAAC,IAAA,2CAAKC,MAAOC,EAAI,gBACdH,EAAA,QAAAC,IAAA,2CAAMG,KAAK,mBAIfnB,KAAKM,YAAcN,KAAKoB,YACxBL,EAAA,OAAAC,IAAA,2CAAKC,MAAOC,EAAI,0BACdH,EAAA,OAAAC,IAAA,2CAAKC,MAAOC,EAAI,sBACdH,EAAA,QAAAC,IAAA,2CAAMC,MAAOC,EAAI,aAAcG,UAAWrB,KAAKoB,aAEjDL,EAAA,OAAAC,IAAA,2CAAKC,MAAOC,EAAI,UACdH,EAAA,QAAAC,IAAA,2CAAMG,KAAK,eAKhBG,E"}