{"version":3,"names":["adsCtaLinkCss","AdsCtaLink","constructor","hostRef","this","el","setAttribute","identifier","generateId","component","handleIdentifierChange","newValue","componentDidLoad","Pipeline.addComponent","disconnectedCallback","Pipeline.removeComponent","render","linkObj","getHyperLinkObject","link","linkAttributes","href","hreflang","rel","target","tabIndex","srLabel","onClick","h","class","Object","assign","generateSVGImage","data","svgPathData","height","width"],"sources":["src/components/ads-cta-link/ads-cta-link.scss?tag=ads-cta-link&encapsulation=shadow","src/components/ads-cta-link/ads-cta-link.tsx"],"sourcesContent":["@import 'core';\n\n/**\n * @prop --ads-cta-link-color: Link text color\n * @prop --ads-cta-link-color-hover: Link text color on hover\n *\n * @prop --ads-cta-link-icon-color: Icon color\n * @prop --ads-cta-link-icon-margin-left: Icon left margin value\n * @prop --ads-cta-link-icon-margin-right: Icon right margin value\n * @prop --ads-cta-link-icon-rotation: Icon rotation value\n */\n\n::slotted(*) {\n  color: inherit !important;\n  font-size: inherit !important;\n  font-weight: inherit !important;\n}\n\n:host {\n  display: inline-block;\n}\n\n:host([theme='default']) {\n  @include ads-vars-component-cta-link-default;\n}\n\n:host([theme='dark']) {\n  @include ads-vars-component-cta-link-dark;\n}\n\n:host([dir='ltr']) {\n  @include ads-vars-component-cta-link-ltr;\n}\n\n:host([dir='rtl']) {\n  @include ads-vars-component-cta-link-rtl;\n}\n\n.c-cta-link {\n  @include ads-cta-link;\n}\n","import * as Pipeline from '../core/utils/pipeline';\nimport { BaseComponent } from '../core/interfaces/BaseComponent';\nimport { Component, Element, Prop, VNode, Watch, h } from '@stencil/core';\nimport { Hyperlink, getHyperLinkObject } from '../core/interfaces/Hyperlink';\nimport { Theme } from '../core/types/globalTypes';\nimport { generateId } from '../core/utils/components';\nimport { generateSVGImage } from 'utils/imageHelper';\nimport { height, svgPathData, width } from '@fortawesome/pro-light-svg-icons/faChevronRight';\n\n/**\n * The call to action link is used to combination of anchor text and a chevron to provide greater affordance\n * for the most important link related to a set of content. Avoid using too many CTA links in proximity,\n * for example in lists. Instead use a single CTA link per content section or card.\n * @tag `<ads-cta-link>`\n * @slot - Content rendered as rich text inside the component\n * @example <ads-cta-link link=\"https://www.arm.com\">Learn More</ads-cta-link>\n */\n@Component({\n  tag: 'ads-cta-link',\n  styleUrl: 'ads-cta-link.scss',\n  shadow: true,\n})\nexport class AdsCtaLink implements BaseComponent {\n  /**\n   * @hidden\n   */\n  public component: string;\n\n  constructor() {\n    this.el.setAttribute('id', this.identifier || generateId('ads-cta-link'));\n    this.component = 'ads-cta-link';\n  }\n\n  /**\n   * @hidden\n   */\n  @Element() el: HTMLAdsCtaLinkElement;\n\n  /**\n   * The unique identifier (optional)\n   */\n  @Prop({ attribute: 'id' }) identifier?: string;\n\n  /**\n   * The theme for this component instance (optional)\n   * Values: \"default\", \"dark\"\n   */\n  @Prop({ reflect: true }) theme?: Theme;\n\n  /**\n   * Contains a URL (fragment).\n   * If this property is set, an anchor tag will be rendered.\n   */\n  @Prop({ reflect: true }) link: Hyperlink;\n\n  /**\n   * Text to display as the aria-label (optional)\n   */\n  @Prop({ reflect: true }) srLabel?: string;\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-cta-link'));\n  }\n\n  protected componentDidLoad(): void {\n    Pipeline.addComponent(this.el);\n  }\n\n  protected disconnectedCallback(): void {\n    Pipeline.removeComponent(this.el);\n  }\n\n  protected render(): VNode {\n    const linkObj = getHyperLinkObject(this.link);\n\n    const linkAttributes = {\n      href: linkObj?.href,\n      hreflang: linkObj?.hreflang || null,\n      rel: linkObj?.rel || null,\n      target: linkObj?.target || null,\n      tabIndex: 0,\n      'aria-label': this.srLabel,\n      onClick: linkObj?.onClick || null,\n      'data-track': 'true',\n      'data-track-value': this.srLabel,\n    };\n\n    return (\n      <span class=\"c-cta-link\">\n        <a class=\"c-cta-link__anchor\" {...linkAttributes}>\n          <slot />\n        </a>\n        <span class=\"c-cta-link__icon\" aria-hidden=\"true\">\n          {generateSVGImage({ data: svgPathData, height, width })}\n        </span>\n      </span>\n    ) as VNode;\n  }\n}\n"],"mappings":"gQAAA,MAAMA,EAAgB,s9E,MCsBTC,EAAU,MAMrB,WAAAC,CAAAC,G,oGACEC,KAAKC,GAAGC,aAAa,KAAMF,KAAKG,YAAcC,EAAW,iBACzDJ,KAAKK,UAAY,c,CAoCnB,sBAAAC,CAAuBC,GACrBP,KAAKC,GAAGC,aAAa,KAAMK,GAAYH,EAAW,gB,CAG1C,gBAAAI,GACRC,EAAsBT,KAAKC,G,CAGnB,oBAAAS,GACRC,EAAyBX,KAAKC,G,CAGtB,MAAAW,GACR,MAAMC,EAAUC,EAAmBd,KAAKe,MAExC,MAAMC,EAAiB,CACrBC,KAAMJ,IAAO,MAAPA,SAAO,SAAPA,EAASI,KACfC,UAAUL,IAAO,MAAPA,SAAO,SAAPA,EAASK,WAAY,KAC/BC,KAAKN,IAAO,MAAPA,SAAO,SAAPA,EAASM,MAAO,KACrBC,QAAQP,IAAO,MAAPA,SAAO,SAAPA,EAASO,SAAU,KAC3BC,SAAU,EACV,aAAcrB,KAAKsB,QACnBC,SAASV,IAAO,MAAPA,SAAO,SAAPA,EAASU,UAAW,KAC7B,aAAc,OACd,mBAAoBvB,KAAKsB,SAG3B,OACEE,EAAA,QAAMC,MAAM,cACVD,EAAA,IAAAE,OAAAC,OAAA,CAAGF,MAAM,sBAAyBT,GAChCQ,EAAA,cAEFA,EAAA,QAAMC,MAAM,mBAAkB,cAAa,QACxCG,EAAiB,CAAEC,KAAMC,cAAWC,OAAEA,SAAMC,MAAEA,W"}