{"version":3,"names":["AdsInteractiveImageErrors","HotspotTooltip","id","backgroundColor","color","hotspotTitle","position","Positions","BOTTOM","tooltipClasses","h","class","join","getImageObject","image","alt","src","Object","assign","getClasses","hasImage","bgColor","classes","push","getHotspotTrigger","crosshairColor","title","version","x","y","viewBox","fill","width","height","getHotspotTooltip","hotspot","label","isNullOrUndefined","tooltip","existValueInEnum","Hotspot","onClick","clickHandler","hotspotImage","data","img","hotspotTooltip","Tag","link","getHyperLinkObject","onHotspotClick","evt","emit","tagAttributes","srLabel","href","hreflang","rel","target","style","left","coords","top","HotspotListItem","onItemSelect","generateSVGImage","iconRightPath","iconRightHeight","iconRightWidth","HotspotList","backgroundImage","hotspotListToggle","onCloseClick","onKeyUp","key","toLowerCase","styles","iconClosePath","iconCloseHeight","iconCloseWidth","map","HotspotListTrigger","onButtonClick","level","ButtonLevels","PRIMARY","SidePanelContent","detail","index","heading","innerHTML","description","SidePanelTabs","activeTab","onTabClick","tab","tabindex","defineProperty","exports","value","prefix","iconName","aliases","unicode","svgPathData","definition","icon","faChevronLeft","ligatures","SidePanel","mobileBackgroundImage","isMobile","panelPosition","panelToggle","panelToggleHandler","onBackClick","isOpened","LEFT","iconLeftPath","iconLeftHeight","iconLeftWidth","tabs","length","sections","adsInteractiveImageCss","AdsInteractiveImage","constructor","hostRef","undefined","Breakpoints","MD","this","el","setAttribute","identifier","generateId","component","handleHotspotListToggle","bind","windowResizeHandler","handleActiveHotspotUpdate","onPanelTabClick","activePanelTab","onPanelToggle","activeHotspotId","setFocusOnHotspot","SCROLLER","disableScroll","onBreakpointChanged","newValue","oldValue","removeMatchMedia","MediaTypes","minWidth","addMatchMedia","handleIdentifierChange","window","innerWidth","getBreakpointInPixels","breakpoint","enableScroll","setFocusOnMobileTrigger","isMobileHotspotListOpen","getHotspotItemFromId","find","setFocusOnIcon","container","shadowRoot","querySelector","setFocusOnArea","hotspotContainer","getElementById","trigger","focus","renderSidePanel","hasDefaultTab","defaultTab","showErrorMessage","INVALID_DEFAULT_TAB","INVALID_PANEL_POSITION","mobileImage","panelTabClick","panelTabClickHandler","renderMobileTrigger","mobileTriggerText","renderHotspotList","hotspotClick","hotspotClickHandler","renderHotspots","INVALID_COORDINATES","renderImage","desktopImage","MISSING_BACKGROUND_IMAGES","Fragment","componentWillLoad","Scroller","document","componentDidLoad","Pipeline.addComponent","componentDidUpdate","disconnectedCallback","Pipeline.removeComponent","render"],"sources":["src/components/ads-interactive-image/ads-interactive-image.types.ts","src/components/ads-interactive-image/components/hotspot-tooltip/hotspot-tooltip.tsx","src/components/core/interfaces/Image.ts","src/components/ads-interactive-image/components/hotspot/hotspot.tsx","src/components/ads-interactive-image/components/hotspot-list/hotspot-list-item/hotspot-list-item.tsx","src/components/ads-interactive-image/components/hotspot-list/hotspot-list.tsx","src/components/ads-interactive-image/components/hotspot-list/hotspot-list-trigger/hotspot-list-trigger.tsx","src/components/ads-interactive-image/components/side-panel/side-panel-content/side-panel-content.tsx","src/components/ads-interactive-image/components/side-panel/side-panel-tabs/side-panel-tabs.tsx","node_modules/@fortawesome/pro-light-svg-icons/faChevronLeft.js","src/components/ads-interactive-image/components/side-panel/side-panel.tsx","src/components/ads-interactive-image/ads-interactive-image.scss?tag=ads-interactive-image&encapsulation=shadow","src/components/ads-interactive-image/ads-interactive-image.tsx"],"sourcesContent":["import { Hyperlink } from '../core/interfaces/Hyperlink';\nimport { ImageType } from '../core/interfaces/Image';\nimport { Position } from '../core/types/globalTypes';\n\n/**\n * Collection of interactive image errors\n */\nexport enum AdsInteractiveImageErrors {\n  INVALID_COORDINATES = 'Invalid coordinates provided for hotspot. Must be values between 0-100',\n  INVALID_DEFAULT_TAB = 'Invalid default tab provided for hotspot data',\n  INVALID_PANEL_POSITION = 'Invalid position for the hotspot panel. Must be either \"left\" or \"right\"',\n  MISSING_BACKGROUND_IMAGES = 'Missing background images. Please provide both a desktop and mobile image',\n}\n\n/**\n * Interface for classes that represent an interactive image hotspot\n * @docs\n */\nexport interface HotspotItem {\n  /* Unique id for each hotspot item */\n  id: string;\n\n  /* Name of the hotspot */\n  label: string;\n\n  /* Value to be applied to the aria-label of the hotspot */\n  srLabel?: string;\n\n  /* Background color of the hotspot */\n  backgroundColor?: string;\n\n  /* Coordinates of the hotspot relative to the image */\n  coords: {\n    /* x-coordinate */\n    x: number;\n\n    /* y-coordinate */\n    y: number;\n  };\n\n  /* Whether the side panel should be rendered on the left or right */\n  panelPosition?: Position;\n\n  /* Hotspot data for the image */\n  data?: HotspotData;\n\n  /* Color of the crosshair on the hotspot */\n  crosshairColor?: string;\n\n  /**\n   * Info for the corresponding tooltip\n   */\n  tooltip?: HotspotTooltip;\n\n  /**\n   * Link data\n   */\n  link?: Hyperlink;\n}\n\n/**\n * Interface for class that represents interactive image hotspot data\n * @docs\n */\nexport interface HotspotData {\n  /* Custom image data for the hotspot item */\n  img?: ImageType;\n\n  /* Hotspot default tab index */\n  defaultTab?: number;\n\n  /* Contains tab data for the side panel */\n  tabs?: SidePanelTab[];\n}\n\n/**\n * Interface for class that represents a hotspot tooltip\n */\nexport interface HotspotTooltip {\n  /**\n   * Color of the text\n   * Accepts any value allowed in the `u-color-*' class, e.g. `u-color-arm-black`\n   */\n  color: string;\n\n  /* Position of the box relative to the hotspot */\n  position?: Position;\n}\n\n/**\n * Interface for class that represents an interactive image slide\n * @docs\n */\nexport interface SidePanelTab {\n  /* Name of the tab */\n  label: string;\n\n  /* Content sections within the tab */\n  sections: SidePanelTabSection[];\n}\n\n/**\n * Interface for class that represents interactive image slide section\n */\nexport interface SidePanelTabSection {\n  /* Heading of the section */\n  heading: string;\n\n  /* Text content of the section */\n  description: string;\n}\n\n/**\n *  An interface for the `HotspotClickEvent` event\n * @docs\n */\nexport interface HotspotClickEvent {\n  evt: Event;\n\n  /* The id of the hotspot that has been clicked */\n  id: string;\n}\n\n/**\n * An interface that describes the hotspot click handler\n */\nexport type HotspotClickHandler = (evt: HotspotClickEvent) => void;\n\n/**\n *  An interface for the `PanelTabClickEvent` event\n * @docs\n */\nexport interface PanelTabClickEvent {\n  evt: Event;\n\n  /* The tab index that has been clicked */\n  index: number;\n}\n\n/**\n * An interface that describes the panel tab click handler\n */\nexport type PanelTabClickHandler = (evt: PanelTabClickEvent) => void;\n\n/**\n *  An interface for the `PanelToggleEvent` event\n * @docs\n */\nexport interface PanelToggleEvent {\n  /* The id of the associated hotspot */\n  id: string;\n\n  /* Whether the panel has been opened or closed */\n  isOpened: boolean;\n}\n\n/**\n * An interface that describes the panel toggle handler\n */\nexport type PanelToggleHandler = (evt: PanelToggleEvent) => void;\n","import { FunctionalComponent, VNode, h } from '@stencil/core';\nimport { Position, Positions } from '../../../core/types/globalTypes';\n\ninterface HotspotTooltipProps {\n  id: string;\n  backgroundColor: string;\n  color: string;\n  hotspotTitle: string;\n  position: Position;\n}\n\nexport const HotspotTooltip: FunctionalComponent<HotspotTooltipProps> = ({\n  id,\n  backgroundColor,\n  color,\n  hotspotTitle,\n  position = Positions.BOTTOM,\n}) => {\n  const tooltipClasses = ['c-interactive-image__hotspot__tooltip', `u-bg-color-arm-${backgroundColor}`, `u-color-${color}`, `is-${position}`];\n  return (\n    <span id={id} class={tooltipClasses.join(' ')}>\n      {hotspotTitle}\n    </span>\n  ) as VNode;\n};\n","/**\n * Interface for class that represents an image\n */\nexport interface Image {\n  /**\n   * Source attribute of the image\n   */\n  src: string;\n\n  /**\n   * Alt text of the image\n   */\n  alt?: string;\n}\n\n/**\n * Returns an object that represents an image\n * @param {ImageType} image  The image data\n * @param {string} alt The alt string\n * @returns {Image} An image object\n */\nexport const getImageObject = (image: ImageType, alt: string): Image => {\n  if (typeof image === 'string') {\n    return { src: image, alt };\n  }\n\n  return { ...image, alt: image.alt || alt };\n};\n\nexport type ImageType = Image | string;\n","import { EventEmitter, FunctionalComponent, VNode, h } from '@stencil/core';\nimport { HotspotClickEvent, HotspotClickHandler, HotspotItem } from '../../ads-interactive-image.types';\nimport { HotspotTooltip } from '../hotspot-tooltip/hotspot-tooltip';\nimport { Image, getImageObject } from '../../../core/interfaces/Image';\nimport { Positions } from '../../../core/types/globalTypes';\nimport { existValueInEnum, isNullOrUndefined } from 'utils/index';\nimport { getHyperLinkObject } from '../../../core/interfaces/Hyperlink';\n\ninterface HotspotProps {\n  id: string;\n  hotspot: HotspotItem;\n  onClick: EventEmitter<HotspotClickEvent>;\n  clickHandler?: HotspotClickHandler;\n}\n\ninterface ButtonAttributes {\n  'aria-label': string;\n  'aria-labelledby': string;\n}\n\ninterface AnchorAttributes {\n  href: string;\n  hreflang: string;\n  rel: string;\n  target: string;\n  'aria-label': string;\n  'aria-labelledby': string;\n}\n\nconst getClasses = (hasImage: boolean, bgColor: string): string => {\n  const classes = ['c-interactive-image__hotspot__trigger'];\n\n  if (hasImage) {\n    classes.push('has-hotspot-image');\n  } else if (bgColor) {\n    classes.push(`u-bg-color-arm-${bgColor}`);\n  }\n\n  return classes.join(' ');\n};\n\nconst getHotspotTrigger = (image: Image, crosshairColor: string): VNode => {\n  return image\n    ? ((<img src={image.src} alt={image.alt} title={image.alt}></img>) as VNode)\n    : ((\n        <svg class=\"c-interactive-image__hotspot__icon\" version=\"1.1\" x=\"0\" y=\"0\" viewBox=\"0 0 141.7 141.7\" fill={crosshairColor}>\n          <g>\n            <rect x=\"56\" width=\"29.7\" height=\"56\" />\n            <rect x=\"56\" y=\"85.7\" width=\"29.7\" height=\"56\" />\n            <rect x=\"-0.1\" y=\"56\" width=\"56\" height=\"29.7\" />\n            <rect x=\"85.6\" y=\"56\" width=\"56\" height=\"29.7\" />\n          </g>\n        </svg>\n      ) as VNode);\n};\n\nconst getHotspotTooltip = (id: string, hotspot: HotspotItem): HTMLElement => {\n  return hotspot.label && !isNullOrUndefined(hotspot.tooltip)\n    ? ((\n        <HotspotTooltip\n          id={`hotspot-tooltip:${id}`}\n          hotspotTitle={hotspot.label}\n          backgroundColor={hotspot.backgroundColor ? hotspot.backgroundColor : 'white'}\n          color={hotspot.tooltip.color ? hotspot.tooltip.color : 'arm-black'}\n          position={hotspot.tooltip.position && existValueInEnum(Positions, hotspot.tooltip.position) ? hotspot.tooltip.position : Positions.BOTTOM}\n        ></HotspotTooltip>\n      ) as HTMLElement)\n    : null;\n};\n\nexport const Hotspot: FunctionalComponent<HotspotProps> = ({ id, hotspot, onClick, clickHandler }) => {\n  const hotspotImage = hotspot.data && !isNullOrUndefined(hotspot.data.img) ? getImageObject(hotspot.data.img, hotspot.label) : null;\n  const hotspotTooltip = !hotspotImage ? getHotspotTooltip(id, hotspot) : null;\n  const Tag = !isNullOrUndefined(hotspot.link) ? 'a' : 'button';\n  const link = getHyperLinkObject(hotspot.link);\n\n  const onHotspotClick = (evt: Event): void => {\n    onClick.emit({ evt, id });\n    clickHandler ? clickHandler({ evt, id }) : null;\n    link?.onClick;\n  };\n\n  const tagAttributes: ButtonAttributes | AnchorAttributes =\n    Tag === 'button'\n      ? ({\n          'aria-label': hotspot.srLabel && isNullOrUndefined(hotspotTooltip) ? hotspot.srLabel : null,\n          'aria-labelledby': !isNullOrUndefined(hotspotTooltip) ? `hotspot-tooltip:${id}` : null,\n          'data-track': 'true',\n          'data-track-value': hotspot.srLabel && isNullOrUndefined(hotspotTooltip) ? hotspot.srLabel : null,\n        } as ButtonAttributes)\n      : ({\n          href: link?.href,\n          hreflang: link?.hreflang || null,\n          rel: link?.rel || null,\n          target: link?.target || null,\n          'aria-label': hotspot.srLabel && isNullOrUndefined(hotspotTooltip) ? hotspot.srLabel : null,\n          'aria-labelledby': !isNullOrUndefined(hotspotTooltip) ? `hotspot-tooltip:${id}` : null,\n          'data-track': 'true',\n          'data-track-value': hotspot.srLabel && isNullOrUndefined(hotspotTooltip) ? hotspot.srLabel : null,\n        } as AnchorAttributes);\n\n  return (\n    <span id={`hotspot:${id}`} class=\"c-interactive-image__hotspot\" style={{ left: `${hotspot.coords.x}%`, top: `${hotspot.coords.y}%` }}>\n      <Tag class={getClasses(!isNullOrUndefined(hotspotImage), hotspot.backgroundColor)} {...tagAttributes} onClick={onHotspotClick}>\n        {getHotspotTrigger(hotspotImage, hotspot.crosshairColor)}\n      </Tag>\n      {hotspotTooltip}\n    </span>\n  ) as VNode;\n};\n","import { EventEmitter, FunctionalComponent, VNode, h } from '@stencil/core';\nimport { HotspotClickEvent, HotspotClickHandler } from '../../../ads-interactive-image.types';\nimport { HyperlinkObj } from '../../../../core/interfaces/Hyperlink';\nimport { generateSVGImage, isNullOrUndefined } from 'utils/index';\nimport { height as iconRightHeight, svgPathData as iconRightPath, width as iconRightWidth } from '@fortawesome/pro-light-svg-icons/faChevronRight';\n\ninterface HotspotListProps {\n  id: string;\n  label: string;\n  onClick: EventEmitter<HotspotClickEvent>;\n  clickHandler?: HotspotClickHandler;\n  link?: HyperlinkObj;\n}\n\nexport const HotspotListItem: FunctionalComponent<HotspotListProps> = ({ id, label, link, onClick, clickHandler }) => {\n  const onItemSelect = (evt: Event): void => {\n    onClick.emit({ evt, id });\n    clickHandler ? clickHandler({ evt, id }) : null;\n  };\n\n  return (\n    <li id={`hotspot-list-item:${id}`} class=\"c-interactive-image__hotspot-list-item\" onClick={onItemSelect}>\n      {!isNullOrUndefined(link) ? (\n        <a\n          class=\"c-interactive-image__hotspot-list-item__button\"\n          href={link.href}\n          hreflang={link?.hreflang}\n          rel={link?.rel}\n          target={link?.target}\n          onClick={link?.onClick}\n          data-track=\"true\"\n          data-track-value={label}\n        >\n          <span class=\"c-interactive-image__hotspot-list-item__label\">{label}</span>\n          {generateSVGImage({ data: iconRightPath, height: iconRightHeight, width: iconRightWidth })}\n        </a>\n      ) : (\n        <button class=\"c-interactive-image__hotspot-list-item__button\" data-track=\"true\" data-track-value={label}>\n          <span class=\"c-interactive-image__hotspot-list-item__label\">{label}</span>\n          {generateSVGImage({ data: iconRightPath, height: iconRightHeight, width: iconRightWidth })}\n        </button>\n      )}\n    </li>\n  ) as VNode;\n};\n","import { EventEmitter, FunctionalComponent, VNode, h } from '@stencil/core';\nimport { HotspotClickEvent, HotspotClickHandler, HotspotItem } from '../../ads-interactive-image.types';\nimport { HotspotListItem } from './hotspot-list-item/hotspot-list-item';\nimport { generateSVGImage } from 'utils/imageHelper';\nimport { getHyperLinkObject } from '../../../core/interfaces/Hyperlink';\nimport { height as iconCloseHeight, svgPathData as iconClosePath, width as iconCloseWidth } from '@fortawesome/pro-light-svg-icons/faTimes';\n\ninterface HotspotListProps {\n  label: string;\n  data: HotspotItem[];\n  backgroundImage: string;\n  onClick: EventEmitter<HotspotClickEvent>;\n  clickHandler?: HotspotClickHandler;\n  hotspotListToggle: (isOpened: boolean) => void;\n}\n\nexport const HotspotList: FunctionalComponent<HotspotListProps> = ({ label, data, backgroundImage, onClick, clickHandler, hotspotListToggle }) => {\n  const onCloseClick = (): void => {\n    hotspotListToggle(false);\n  };\n\n  const onKeyUp = (evt: KeyboardEvent): void => {\n    switch (evt.key.toLowerCase()) {\n      case 'escape':\n        onCloseClick();\n        break;\n      default:\n        break;\n    }\n  };\n\n  const styles = { 'background-image': `url(\"${backgroundImage}\")` };\n\n  return (\n    <div class=\"c-interactive-image__hotspot-list\" style={{ ...styles }} onKeyUp={onKeyUp}>\n      <div class=\"c-interactive-image__hotspot-list__container\">\n        <div class=\"c-interactive-image__hotspot-list__header\">\n          <button class=\"c-interactive-image__hotspot-list__button is-close-button\" onClick={onCloseClick} data-track=\"true\" data-track-value={label}>\n            {generateSVGImage({ data: iconClosePath, height: iconCloseHeight, width: iconCloseWidth })}\n          </button>\n          {label ? <h2>{label}</h2> : null}\n        </div>\n        <ul class=\"c-interactive-image__hotspot-list__list\">\n          {data\n            ? data.map((hotspot) => {\n                return (\n                  <HotspotListItem\n                    id={hotspot.id}\n                    label={hotspot.label}\n                    link={getHyperLinkObject(hotspot.link)}\n                    onClick={onClick}\n                    clickHandler={clickHandler}\n                  />\n                ) as VNode;\n              })\n            : null}\n        </ul>\n      </div>\n    </div>\n  ) as VNode;\n};\n","import { ButtonLevels } from '../../../../core/types/globalTypes';\nimport { FunctionalComponent, VNode, h } from '@stencil/core';\n\ninterface HotspotListTriggerProps {\n  id: string;\n  label: string;\n  onClick: (isOpened: boolean) => void;\n}\n\nexport const HotspotListTrigger: FunctionalComponent<HotspotListTriggerProps> = ({ id, label, onClick }) => {\n  const onButtonClick = (): void => {\n    onClick(true);\n  };\n\n  return (\n    <ads-cta-button\n      id={`hotspot-list-trigger:${id}`}\n      class=\"c-interactive-image__hotspot-list-trigger\"\n      level={ButtonLevels.PRIMARY}\n      onClick={onButtonClick}\n    >\n      {label}\n    </ads-cta-button>\n  ) as VNode;\n};\n","import { FunctionalComponent, VNode, h } from '@stencil/core';\nimport { SidePanelTabSection } from '../../../ads-interactive-image.types';\n\ninterface SidePanelContentProps {\n  id: string;\n  data: SidePanelTabSection[];\n}\n\nexport const SidePanelContent: FunctionalComponent<SidePanelContentProps> = ({ id, data }) => {\n  return (\n    <div id={`side-panel-content:${id}`} class=\"c-interactive-image__side-panel__content\">\n      {data\n        ? data.map(\n            (detail, index) =>\n              (\n                <div id={`content:${index}`} class=\"c-interactive-image__side-panel__content__container\">\n                  <div class=\"c-interactive-image__side-panel__content__subheading\">{detail.heading}</div>\n                  <div class=\"c-interactive-image__side-panel__content__desc\" innerHTML={detail.description}></div>\n                </div>\n              ) as VNode\n          )\n        : null}\n    </div>\n  ) as VNode;\n};\n","import { EventEmitter, FunctionalComponent, VNode, h } from '@stencil/core';\nimport { PanelTabClickEvent, PanelTabClickHandler, SidePanelTab } from '../../../ads-interactive-image.types';\n\ninterface SidePanelTabsProps {\n  id: string;\n  data: SidePanelTab[];\n  activeTab: number;\n  onClick: EventEmitter<PanelTabClickEvent>;\n  clickHandler?: PanelTabClickHandler;\n}\n\nexport const SidePanelTabs: FunctionalComponent<SidePanelTabsProps> = ({ id, data, activeTab, onClick, clickHandler }) => {\n  const onKeyUp = (evt: KeyboardEvent, index?: number): void => {\n    switch (evt.key.toLowerCase()) {\n      case 'enter':\n        onTabClick(evt, index);\n        break;\n      default:\n        break;\n    }\n  };\n\n  const onTabClick = (evt: Event, index: number): void => {\n    onClick.emit({ evt, index });\n    clickHandler ? clickHandler({ evt, index }) : null;\n  };\n\n  return (\n    <div id={`side-panel-tabs:${id}`} class=\"c-interactive-image__side-panel__tabs\">\n      {data\n        ? data.map((tab, index) => {\n            return (\n              <span\n                id={`tab:${index}`}\n                tabindex={0}\n                class={`c-interactive-image__side-panel__tabs__tab ${index === activeTab ? 'is-selected' : ''}`}\n                onClick={(evt: MouseEvent) => onTabClick(evt, index)}\n                onKeyUp={(evt: KeyboardEvent) => onKeyUp(evt, index)}\n              >\n                {tab.label}\n              </span>\n            ) as VNode;\n          })\n        : null}\n    </div>\n  ) as VNode;\n};\n","'use strict';\nObject.defineProperty(exports, '__esModule', { value: true });\nvar prefix = 'fal';\nvar iconName = 'chevron-left';\nvar width = 320;\nvar height = 512;\nvar aliases = [9001];\nvar unicode = 'f053';\nvar svgPathData = 'M20.7 267.3c-6.2-6.2-6.2-16.4 0-22.6l192-192c6.2-6.2 16.4-6.2 22.6 0s6.2 16.4 0 22.6L54.6 256 235.3 436.7c6.2 6.2 6.2 16.4 0 22.6s-16.4 6.2-22.6 0l-192-192z';\n\nexports.definition = {\n  prefix: prefix,\n  iconName: iconName,\n  icon: [\n    width,\n    height,\n    aliases,\n    unicode,\n    svgPathData\n  ]};\n\nexports.faChevronLeft = exports.definition;\nexports.prefix = prefix;\nexports.iconName = iconName;\nexports.width = width;\nexports.height = height;\nexports.ligatures = aliases;\nexports.unicode = unicode;\nexports.svgPathData = svgPathData;\nexports.aliases = aliases;","import { EventEmitter, FunctionalComponent, VNode, h } from '@stencil/core';\nimport { HotspotData, PanelTabClickEvent, PanelTabClickHandler, PanelToggleEvent, PanelToggleHandler } from '../../ads-interactive-image.types';\nimport { Position, Positions } from '../../../core/types/globalTypes';\nimport { SidePanelContent } from './side-panel-content/side-panel-content';\nimport { SidePanelTabs } from './side-panel-tabs/side-panel-tabs';\nimport { generateSVGImage } from 'utils/imageHelper';\nimport { height as iconCloseHeight, svgPathData as iconClosePath, width as iconCloseWidth } from '@fortawesome/pro-light-svg-icons/faTimes';\nimport { height as iconLeftHeight, svgPathData as iconLeftPath, width as iconLeftWidth } from '@fortawesome/pro-light-svg-icons/faChevronLeft';\n\ninterface SidePanelProps {\n  id: string;\n  label: string;\n  data: HotspotData;\n  activeTab: number;\n  mobileBackgroundImage: string;\n  isMobile: boolean;\n  panelPosition: Position;\n  onClick: EventEmitter<PanelTabClickEvent>;\n  clickHandler?: PanelTabClickHandler;\n  panelToggle: EventEmitter<PanelToggleEvent>;\n  panelToggleHandler?: PanelToggleHandler;\n  hotspotListToggle: (isOpened: boolean) => void;\n}\n\nexport const SidePanel: FunctionalComponent<SidePanelProps> = ({\n  id,\n  label,\n  data,\n  activeTab,\n  mobileBackgroundImage,\n  isMobile,\n  panelPosition,\n  onClick,\n  clickHandler,\n  panelToggle,\n  panelToggleHandler,\n  hotspotListToggle,\n}) => {\n  const onBackClick = (): void => {\n    panelToggle.emit({ isOpened: false, id });\n    panelToggleHandler ? panelToggleHandler({ isOpened: false, id }) : null;\n    hotspotListToggle(true);\n  };\n\n  const onCloseClick = (): void => {\n    panelToggle.emit({ isOpened: false, id });\n    panelToggleHandler ? panelToggleHandler({ isOpened: false, id }) : null;\n    isMobile ? hotspotListToggle(false) : null;\n  };\n\n  const onKeyUp = (evt: KeyboardEvent): void => {\n    switch (evt.key.toLowerCase()) {\n      case 'escape':\n        onCloseClick();\n        break;\n      default:\n        break;\n    }\n  };\n\n  const styles = isMobile ? { 'background-image': `url(\"${mobileBackgroundImage}\")` } : null;\n  const classes = ['c-interactive-image__side-panel'];\n  classes.push(isMobile ? 'is-mobile' : null);\n  classes.push(panelPosition === Positions.LEFT ? 'is-left-aligned' : null);\n\n  return (\n    <div id={`side-panel:${id}`} class={classes.join(' ')} style={{ ...styles }} onKeyUp={onKeyUp}>\n      <div class=\"c-interactive-image__side-panel__container\">\n        <div class=\"c-interactive-image__side-panel__header\">\n          {isMobile ? (\n            <button data-track=\"true\" data-track-value={label} class=\"c-interactive-image__side-panel__button is-back-button\" onClick={onBackClick}>\n              {generateSVGImage({ data: iconLeftPath, height: iconLeftHeight, width: iconLeftWidth })}\n            </button>\n          ) : null}\n          <button data-track=\"true\" data-track-value={label} class=\"c-interactive-image__side-panel__button is-close-button\" onClick={onCloseClick}>\n            {generateSVGImage({ data: iconClosePath, height: iconCloseHeight, width: iconCloseWidth })}\n          </button>\n          {label ? <h2>{label}</h2> : null}\n          {data.tabs && data.tabs.length > 1 ? (\n            <SidePanelTabs id={id} data={data.tabs} activeTab={activeTab} onClick={onClick} clickHandler={clickHandler} />\n          ) : null}\n        </div>\n        <SidePanelContent id={id} data={data.tabs[activeTab].sections} />\n      </div>\n    </div>\n  ) as VNode;\n};\n","@import 'core';\n\n@include ads-utilities-background-color();\n\n@import 'components/hotspot-list/hotspot-list.scss';\n@import 'components/hotspot/hotspot.scss';\n@import 'components/hotspot-tooltip/hotspot-tooltip.scss';\n@import 'components/side-panel/side-panel.scss';\n\n/**\n * @prop --ads-interactive-image-background-hover-tint-color: Background hover tint\n * @prop --ads-interactive-image-background-hover-tint-opacity: Background hover tint opacity color\n * @prop --ads-interactive-image-background-hover-tint-transition-time: Background hover tint transition time\n *\n * @prop --ads-interactive-image-border-color: Border color\n *\n * @prop --ads-interactive-image-button-color: Back and close buttons color\n * @prop --ads-interactive-image-button-color-hover: Back and close buttons color on hover\n *\n * @prop --ads-interactive-image-hotspot-list-color: Hotspot list items color\n * @prop --ads-interactive-image-hotspot-list-color-hover: Hotspot list items color on hover\n *\n * @prop --ads-interactive-image-side-panel-background-color: Side panel background color\n *\n * @prop --ads-interactive-image-side-panel-content-color: Side panel content color\n *\n * @prop --ads-interactive-image-side-panel-content-anchor-color: Side panel content anchor color\n * @prop --ads-interactive-image-side-panel-content-anchor-color-hover: Side panel content anchor color on hover\n *\n * @prop --ads-interactive-image-side-panel-content-subheading-color: Side panel content subheading color\n *\n * @prop --ads-interactive-image-side-panel-header-color: Side panel header color\n *\n * @prop --ads-interactive-image-side-panel-tab-background-color: Side panel tab background color\n * @prop --ads-interactive-image-side-panel-tab-background-color-hover: Side panel tab background color on hover\n * @prop --ads-interactive-image-side-panel-tab-background-color-selected: Side panel tab background color on selected\n * @prop --ads-interactive-image-side-panel-tab-color: Side panel tab color\n * @prop --ads-interactive-image-side-panel-tab-color-hover: Side panel tab color on hover\n * @prop --ads-interactive-image-side-panel-tab-color-selected: Side panel tab color on selected\n *\n * @prop --ads-interactive-image-side-panel-tabs-border-color: Side panel tabs border color\n */\n\n:host([theme='default']) {\n  @include ads-vars-component-interactive-image-default;\n}\n\n:host([theme='dark']) {\n  @include ads-vars-component-interactive-image-dark;\n}\n\n.c-interactive-image {\n  &__container {\n    border: 1px solid var(--ads-interactive-image-border-color, $ads-interactive-image-border-color);\n    font-family: var(--ads-font-family);\n    font-size: unset;\n    position: relative;\n\n    &:hover .tint {\n      opacity: var(--ads-interactive-image-background-hover-tint-opacity, $ads-interactive-image-background-hover-tint-opacity);\n    }\n  }\n\n  &__wrapper {\n    position: relative;\n  }\n\n  &__image-wrapper {\n    width: 100%;\n\n    .tint {\n      background-color: var(--ads-interactive-image-background-hover-tint-color, $ads-interactive-image-background-hover-tint-color);\n      bottom: 0;\n      content: '';\n      display: block;\n      left: 0;\n      opacity: 0;\n      position: absolute;\n      right: 0;\n      top: 0;\n      transform: translate3d(0, 0, 0); /** fixes flicker bug on safari / chromium */\n      transition: opacity var(--ads-interactive-image-background-hover-tint-transition-time, $ads-interactive-image-background-hover-tint-transition-time) ease;\n      z-index: 1;\n    }\n\n    > img {\n      display: flex;\n      position: relative;\n      width: 100%;\n    }\n  }\n}","/* eslint-disable @typescript-eslint/no-unsafe-member-access */\nimport * as Pipeline from '../core/utils/pipeline';\nimport {\n  AdsInteractiveImageErrors,\n  HotspotClickEvent,\n  HotspotClickHandler,\n  HotspotItem,\n  PanelTabClickEvent,\n  PanelTabClickHandler,\n  PanelToggleEvent,\n  PanelToggleHandler,\n} from './ads-interactive-image.types';\nimport { BaseComponent } from '../core/interfaces/BaseComponent';\nimport { Breakpoint, Breakpoints, Theme } from '../core/types/globalTypes';\nimport { Component, Element, Event, EventEmitter, Fragment, Listen, Prop, State, VNode, Watch, h } from '@stencil/core';\nimport { Hotspot } from './components/hotspot/hotspot';\nimport { HotspotList } from './components/hotspot-list/hotspot-list';\nimport { HotspotListTrigger } from './components/hotspot-list/hotspot-list-trigger/hotspot-list-trigger';\nimport { ImageType, getImageObject } from '../core/interfaces/Image';\nimport { MediaTypes, Scroller, addMatchMedia, getBreakpointInPixels, isNullOrUndefined, removeMatchMedia, setFocusOnArea } from 'utils/index';\nimport { SidePanel } from './components/side-panel/side-panel';\nimport { generateId, showErrorMessage } from '../core/utils/components';\n\n/**\n * Interactive image enables the user to view contextual information by selecting hotspots. Each hotspot is customizable and contains information about the item in the image. The contextual information is displayed in a side panel to the right of the image.\n * @tag `<ads-interactive-image>`\n * @example\n * <ads-interactive-image label=\"Example\" data=dataObject desktop-image=\"img.jpg\" mobile-image=\"img.jpg\"></ads-interactive-image>\n */\n@Component({\n  tag: 'ads-interactive-image',\n  styleUrl: 'ads-interactive-image.scss',\n  shadow: true,\n})\nexport class AdsInteractiveImage implements BaseComponent {\n  /**\n   * @hidden\n   */\n  public component: string;\n\n  private SCROLLER: Scroller;\n\n  /**\n   * @hidden\n   */\n  constructor() {\n    this.el.setAttribute('id', this.identifier || generateId('ads-interactive-image'));\n    this.component = 'ads-interactive-image';\n\n    // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n    this.handleHotspotListToggle = this.handleHotspotListToggle.bind(this);\n\n    // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment\n    this.windowResizeHandler = this.windowResizeHandler.bind(this);\n  }\n\n  @Element() private el: HTMLAdsInteractiveImageElement;\n\n  /**\n   * Reference to the active hotspot\n   * @hidden\n   */\n  @State() activeHotspotId: string = undefined;\n\n  /**\n   * The current active tab in the side-panel\n   * @hidden\n   */\n  @State() activePanelTab: number = undefined;\n\n  /**\n   * Whether or not the hotspot list is open\n   * @hidden\n   */\n  @State() isMobileHotspotListOpen = false;\n\n  /**\n   * Whether the device is mobile or not\n   * @hidden\n   */\n  @State() isMobile = true;\n\n  /**\n   * The unique identifier (optional)\n   */\n  @Prop({ attribute: 'id' }) identifier?: string;\n\n  /**\n   * The breakpoint to be used for mobile (optional)\n   * @default \"md\"\n   */\n  @Prop({ reflect: true }) breakpoint: Breakpoint = Breakpoints.MD;\n\n  /**\n   * JSON data for the component.\n   */\n  @Prop() data: HotspotItem[];\n\n  /**\n   * The theme for this component instance (optional)\n   * Values: \"default\", \"dark\"\n   */\n  @Prop({ reflect: true }) theme?: Theme;\n\n  /**\n   * The image to be displayed in desktop mode\n   */\n  @Prop() desktopImage: ImageType;\n\n  /**\n   * The label of the interactive image (optional)\n   */\n  @Prop({ reflect: true }) label?: string;\n\n  /**\n   * The image to be displayed in mobile mode\n   */\n  @Prop() mobileImage: ImageType;\n\n  /**\n   * The text to be displayed on the cta button in mobile view (optional)\n   */\n  @Prop({ reflect: true }) mobileTriggerText?: string;\n\n  /**\n   * Callback function for hotspotClick events (optional)\n   */\n  @Prop() hotspotClickHandler?: HotspotClickHandler;\n\n  /**\n   * Callback function for hotspotClick events (optional)\n   */\n  @Prop() panelTabClickHandler?: PanelTabClickHandler;\n\n  /**\n   * Callback function for panelToggle events (optional)\n   */\n  @Prop() panelToggleHandler?: PanelToggleHandler;\n\n  /**\n   * Emits the 'HotspotClickEvent' custom event.\n   * Usage: `document.querySelector('ads-interactive-image').addEventListener('hotspotClick', function(evt) {});`\n   */\n  @Event({ bubbles: false }) hotspotClick: EventEmitter<HotspotClickEvent>;\n\n  /**\n   * Emits the 'PanelTabClickEvent' custom event.\n   * Usage: `document.querySelector('ads-interactive-image').addEventListener('panelTabClick', () => {});`\n   */\n  @Event({ bubbles: false }) panelTabClick: EventEmitter<PanelTabClickEvent>;\n\n  /**\n   * Emits 'PanelToggleEvent' custom event.\n   * Usage: `document.querySelector('ads-interactive-image').addEventListener('panelToggle', function(evt) {});`\n   */\n  @Event({ bubbles: false }) panelToggle: EventEmitter<PanelToggleEvent>;\n\n  /**\n   * Listen to the hotspotClick event.\n   * @param {HotspotClickEvent} evt the hotspot click event\n   * @hidden\n   */\n  @Listen('hotspotClick')\n  protected onHotspotClick(evt: CustomEvent<HotspotClickEvent>): void {\n    this.handleActiveHotspotUpdate(evt);\n  }\n\n  /**\n   * Listen to the panelTabClick event\n   * @param {PanelTabClickEvent} evt the panel tab click event\n   * @hidden\n   */\n  @Listen('panelTabClick')\n  onPanelTabClick(evt: CustomEvent<PanelTabClickEvent>): void {\n    this.activePanelTab !== evt.detail.index ? (this.activePanelTab = evt.detail.index) : null;\n  }\n\n  /**\n   * Listen to the pane;Toggle event and handles toggling the side-panel and/or hotspot list and resetting the focus\n   * @param {PanelTabClickEvent} evt the panel toggle event\n   * @hidden\n   */\n  @Listen('panelToggle')\n  onPanelToggle(evt: CustomEvent<PanelToggleEvent>): void {\n    if (!evt.detail.isOpened) {\n      this.activeHotspotId = undefined;\n      this.activePanelTab = undefined;\n      !this.isMobile ? this.setFocusOnHotspot(evt.detail.id) : null;\n    } else {\n      this.isMobile ? this.SCROLLER.disableScroll() : null;\n    }\n  }\n\n  /**\n   * Watch for breakpoint prop change.\n   * @param {Breakpoint} newValue the new prop value\n   * @param {Breakpoint} oldValue the old prop value\n   * @returns {void}\n   */\n  @Watch('breakpoint')\n  onBreakpointChanged(newValue: Breakpoint, oldValue: Breakpoint): void {\n    removeMatchMedia(MediaTypes.minWidth, oldValue, this.windowResizeHandler);\n    addMatchMedia(MediaTypes.minWidth, newValue, this.windowResizeHandler);\n    this.windowResizeHandler();\n  }\n\n  /**\n   * Handle identifier property changes\n   * @param {string} newValue The new value for \"identifier\"\n   * @hidden\n   */\n  @Watch('identifier')\n  handleIdentifierChange(newValue: string): void {\n    this.el.setAttribute('id', newValue || generateId('ads-interactive-image'));\n  }\n\n  /**\n   * Handles changing the state on windowResize\n   * @hidden\n   */\n  private windowResizeHandler() {\n    if (window.innerWidth < getBreakpointInPixels(this.breakpoint) && !this.isMobile) {\n      this.isMobile = true;\n    } else if (window.innerWidth >= getBreakpointInPixels(this.breakpoint) && this.isMobile) {\n      this.isMobile = false;\n    }\n  }\n\n  /**\n   * Resets the component, back to the original state\n   * @param {boolean} isOpened Whether the hotspot list should be opened or not\n   */\n  private handleHotspotListToggle(isOpened: boolean): void {\n    if (isOpened) {\n      this.SCROLLER.disableScroll();\n    } else {\n      this.SCROLLER.enableScroll();\n      this.setFocusOnMobileTrigger();\n    }\n\n    this.isMobileHotspotListOpen = isOpened;\n  }\n\n  /**\n   * Updates activeHotspotId state, based on the provided id\n   * @param {HotspotClickEvent} evt The hotspot click event\n   */\n  private handleActiveHotspotUpdate(evt: CustomEvent<HotspotClickEvent>) {\n    this.activePanelTab = undefined;\n\n    if (this.activeHotspotId !== evt.detail.id) {\n      // Don't update activeHotspotId if there is a link\n      if (!isNullOrUndefined(this.getHotspotItemFromId(evt.detail.id).link)) {\n        return;\n      }\n\n      this.panelToggle.emit({ isOpened: true, id: evt.detail.id });\n      this.panelToggleHandler ? this.panelToggleHandler({ isOpened: true, id: evt.detail.id }) : null;\n      this.activeHotspotId = evt.detail.id;\n    } else {\n      this.panelToggle.emit({ isOpened: false, id: evt.detail.id });\n      this.panelToggleHandler ? this.panelToggleHandler({ isOpened: false, id: evt.detail.id }) : null;\n    }\n  }\n\n  /**\n   * Gets the hotspot item from the id\n   * @param {string} id The hotspot id\n   * @returns {HotspotItem} The hotspot item from data\n   */\n  private getHotspotItemFromId(id: string): HotspotItem {\n    return this.data.find((hotspot) => {\n      return hotspot.id === id;\n    });\n  }\n\n  /**\n   * Gets the first focusable element in list/panel and sets focus on it\n   */\n  private setFocusOnIcon(): void {\n    const container: HTMLElement =\n      this.el.shadowRoot.querySelector('.c-interactive-image__hotspot-list > div') ||\n      this.el.shadowRoot.querySelector('.c-interactive-image__side-panel > div');\n    if (container) {\n      setFocusOnArea(container);\n    }\n  }\n\n  /**\n   * Gets the hotspot element and sets focus on it\n   * @param {string} id The hotspot id\n   */\n  private setFocusOnHotspot(id: string): void {\n    const hotspotContainer: HTMLElement = this.el.shadowRoot.getElementById(`hotspot:${id}`);\n    if (hotspotContainer) {\n      setFocusOnArea(hotspotContainer);\n    }\n  }\n\n  /**\n   * Gets the mobile trigger element and sets focus on it\n   */\n  private setFocusOnMobileTrigger(): void {\n    const trigger = this.el.shadowRoot.getElementById(`hotspot-list-trigger:${this.identifier}`).shadowRoot.querySelector('button');\n    if (trigger) {\n      trigger.focus();\n    }\n  }\n\n  /**\n   * Render the side panel\n   * @returns {VNode} The side panel\n   */\n  private renderSidePanel() {\n    if (!isNullOrUndefined(this.activeHotspotId)) {\n      const hotspot = this.getHotspotItemFromId(this.activeHotspotId);\n      const hasDefaultTab = !isNullOrUndefined(hotspot.data.defaultTab);\n\n      if (hasDefaultTab && (hotspot.data.defaultTab < 0 || hotspot.data.defaultTab >= hotspot.data.tabs.length)) {\n        showErrorMessage(AdsInteractiveImageErrors.INVALID_DEFAULT_TAB, this.el);\n        return null;\n      }\n\n      // Check whether the position of the hotspot panel, if provided, is valid\n      if (hotspot.panelPosition && !(hotspot.panelPosition === 'left' || hotspot.panelPosition === 'right')) {\n        showErrorMessage(AdsInteractiveImageErrors.INVALID_PANEL_POSITION, this.el);\n        return null;\n      }\n\n      return (\n        <SidePanel\n          id={hotspot.id}\n          label={hotspot.label}\n          data={hotspot.data}\n          activeTab={!isNullOrUndefined(this.activePanelTab) ? this.activePanelTab : hasDefaultTab ? hotspot.data.defaultTab : 0}\n          mobileBackgroundImage={getImageObject(this.mobileImage, this.label).src}\n          isMobile={this.isMobile}\n          panelPosition={hotspot.panelPosition}\n          onClick={this.panelTabClick}\n          clickHandler={this.panelTabClickHandler}\n          panelToggle={this.panelToggle}\n          panelToggleHandler={this.panelToggleHandler}\n          hotspotListToggle={this.handleHotspotListToggle}\n        />\n      ) as VNode;\n    }\n\n    return null;\n  }\n\n  /**\n   * Render the trigger for the hotspot list in mobile view\n   * @returns {VNode} The trigger\n   */\n  private renderMobileTrigger() {\n    return (\n      <HotspotListTrigger\n        id={this.identifier}\n        label={this.mobileTriggerText ? this.mobileTriggerText : this.label}\n        onClick={this.handleHotspotListToggle}\n      />\n    ) as VNode;\n  }\n\n  /**\n   * Render the hotspot list for mobile views\n   * @returns {VNode} The hotspot list\n   */\n  private renderHotspotList() {\n    return this.isMobileHotspotListOpen && !this.activeHotspotId\n      ? ((\n          <HotspotList\n            label={this.label}\n            data={this.data}\n            backgroundImage={getImageObject(this.mobileImage, this.label).src}\n            onClick={this.hotspotClick}\n            clickHandler={this.hotspotClickHandler}\n            hotspotListToggle={this.handleHotspotListToggle}\n          />\n        ) as VNode)\n      : null;\n  }\n\n  /**\n   * Render the hotspots from the data\n   * @returns {VNode} The hotspots\n   */\n  private renderHotspots() {\n    return this.data.map((hotspot) => {\n      if (hotspot.coords.x < 0 || hotspot.coords.x > 100 || hotspot.coords.y < 0 || hotspot.coords.y > 100) {\n        showErrorMessage(AdsInteractiveImageErrors.INVALID_COORDINATES, this.el);\n      }\n\n      return (<Hotspot id={hotspot.id} hotspot={hotspot} onClick={this.hotspotClick} clickHandler={this.hotspotClickHandler} />) as VNode;\n    });\n  }\n\n  /**\n   * Render the interactive background image\n   * @returns {VNode} Image element\n   */\n  private renderImage(): VNode {\n    if (!this.desktopImage && !this.mobileImage) {\n      showErrorMessage(AdsInteractiveImageErrors.MISSING_BACKGROUND_IMAGES, this.el);\n      return null;\n    }\n\n    if (!this.isMobile) {\n      const desktopImage = getImageObject(this.desktopImage, this.label);\n      return (\n        <Fragment>\n          <div class={`tint`}></div>\n          <img src={desktopImage.src} alt={desktopImage.alt} />\n        </Fragment>\n      ) as VNode;\n    } else {\n      const mobileImage = getImageObject(this.mobileImage, this.label);\n      return (<img src={mobileImage.src} alt={mobileImage.alt} />) as VNode;\n    }\n  }\n\n  protected componentWillLoad(): void {\n    this.SCROLLER = new Scroller(document);\n    this.windowResizeHandler();\n  }\n\n  protected componentDidLoad(): void {\n    Pipeline.addComponent(this.el);\n    addMatchMedia(MediaTypes.minWidth, this.breakpoint, this.windowResizeHandler);\n  }\n\n  protected componentDidUpdate(): void {\n    (!isNullOrUndefined(this.activeHotspotId) && isNullOrUndefined(this.activePanelTab)) ||\n    (this.isMobileHotspotListOpen && isNullOrUndefined(this.activeHotspotId))\n      ? this.setFocusOnIcon()\n      : null;\n  }\n\n  protected disconnectedCallback(): void {\n    Pipeline.removeComponent(this.el);\n    this.SCROLLER = undefined;\n    removeMatchMedia(MediaTypes.minWidth, this.breakpoint, this.windowResizeHandler);\n  }\n\n  protected render(): VNode {\n    return (\n      <div id={`ads:interactive-image:${this.identifier}`} class=\"c-interactive-image__container\">\n        <div class=\"c-interactive-image__wrapper\">\n          <div class=\"c-interactive-image__image-wrapper\">{this.renderImage()}</div>\n          {this.data && this.data.length > 0 ? (this.isMobile ? this.renderHotspotList() : this.renderHotspots()) : null}\n          {this.isMobile ? this.renderMobileTrigger() : null}\n        </div>\n        {this.renderSidePanel()}\n      </div>\n    ) as VNode;\n  }\n}\n"],"mappings":"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"}