{"version":3,"file":"herospot-v2.mjs","sources":["../../../../src/herospot/v2/herospot.ts"],"sourcesContent":["import { html, unsafeCSS, nothing, type CSSResult, type TemplateResult, type PropertyValues } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { BaseOrganism } from '../../base-organism';\nimport { appendStylesheet, XL_BREAKPOINT } from '../../core/utils';\nimport styles from './herospot.scss?inline';\nimport slotStyles from './herospot.slot.scss?inline';\nimport '../../text-content';\n\n@customElement('pips-v2-herospot')\nexport class HerospotV2 extends BaseOrganism {\n  static override styles: CSSResult[] = [...BaseOrganism.styles, unsafeCSS(styles)];\n\n  @property({ type: String, reflect: true }) variant: 'default' | 'full-width' = 'default';\n  @property({ type: String, reflect: true }) textColor: 'light' | 'dark' = 'dark';\n  @property({ type: String, attribute: 'region-label' }) regionLabel = 'Hero';\n\n  @state() private _hasMedia = false;\n\n  private resizeObserver?: ResizeObserver;\n  private ctaSlot?: HTMLSlotElement;\n\n  override connectedCallback(): void {\n    super.connectedCallback();\n    // Establish the landmark before first paint so assistive tech never misses it.\n    this.setAttribute('role', 'region');\n    this.setAttribute('aria-label', this.regionLabel?.trim() || 'Hero');\n    // Preserve the hero's default appearance (red) when no background is authored\n    // (covers both a missing attribute and an empty `background=\"\"`).\n    if (!this.background) {\n      this.background = 'red';\n    }\n    this._hasMedia = this.querySelector(':scope > [slot=\"media\"], :scope > [slot=\"image\"]') !== null;\n    appendStylesheet({\n      target: this,\n      styles: slotStyles,\n      name: 'pips-v2-herospot-slot',\n    });\n  }\n\n  protected override firstUpdated(): void {\n    super.firstUpdated();\n    this.ctaSlot = this.shadowRoot!.querySelector('slot[name=\"cta\"]') as HTMLSlotElement;\n    this.resizeObserver = new ResizeObserver(() => this.onResize());\n    this.resizeObserver.observe(this);\n  }\n\n  protected override updated(changed: PropertyValues): void {\n    super.updated(changed);\n    if (changed.has('regionLabel')) {\n      this.setAttribute('aria-label', this.regionLabel?.trim() || 'Hero');\n    }\n  }\n\n  override disconnectedCallback(): void {\n    super.disconnectedCallback();\n    this.resizeObserver?.disconnect();\n  }\n\n  private onResize(): void {\n    const button = this.ctaSlot?.assignedElements({ flatten: true })\n      .find((el) => /^c11n-web-v\\d+-button$/.test(el.tagName.toLowerCase()));\n    if (button) {\n      const size = window.innerWidth < XL_BREAKPOINT ? 'medium' : 'large';\n      button.setAttribute('size', size);\n    }\n  }\n\n  private onMediaSlotChange(): void {\n    // Read the slots live rather than caching them in firstUpdated — the initial\n    // slotchange can fire before firstUpdated runs, which would leave the cached\n    // refs undefined and clobber the _hasMedia value seeded in connectedCallback.\n    const mediaSlot = this.shadowRoot?.querySelector('slot[name=\"media\"]') as HTMLSlotElement | null;\n    const imageSlot = this.shadowRoot?.querySelector('slot[name=\"image\"]') as HTMLSlotElement | null;\n    this._hasMedia =\n      (mediaSlot?.assignedElements().length ?? 0) > 0 ||\n      (imageSlot?.assignedElements().length ?? 0) > 0;\n  }\n\n  protected override renderFinePrintSlot(): TemplateResult | typeof nothing {\n    return nothing;\n  }\n\n  protected override renderContent(): TemplateResult {\n    return html`\n      <div class=\"herospot-content${this._hasMedia ? '' : ' herospot-content--no-media'} layout--half-width\">\n        <slot name=\"heading\"></slot>\n        <slot name=\"body\"></slot>\n        <slot name=\"cta\"></slot>\n        <slot name=\"fine-print\"></slot>\n      </div>\n    `;\n  }\n\n  protected override renderBackgroundLayer(): TemplateResult | typeof nothing {\n    return html`\n      <div class=\"herospot-image-container${this._hasMedia ? '' : ' herospot-image-container--empty'}\">\n        <slot name=\"media\" @slotchange=\"${this.onMediaSlotChange}\"></slot>\n        <slot name=\"image\" @slotchange=\"${this.onMediaSlotChange}\"></slot>\n      </div>\n    `;\n  }\n}\n"],"names":["HerospotV2","BaseOrganism","constructor","super","arguments","this","variant","textColor","regionLabel","_hasMedia","connectedCallback","setAttribute","trim","background","querySelector","appendStylesheet","target","styles","name","firstUpdated","ctaSlot","shadowRoot","resizeObserver","ResizeObserver","onResize","observe","changed","updated","has","disconnectedCallback","disconnect","button","assignedElements","flatten","find","el","test","tagName","toLowerCase","size","window","innerWidth","XL_BREAKPOINT","onMediaSlotChange","mediaSlot","imageSlot","length","renderFinePrintSlot","nothing","renderContent","html","renderBackgroundLayer","unsafeCSS","__decorateClass","property","type","String","reflect","prototype","attribute","state","customElement"],"mappings":"02CASO,IAAMA,EAAN,cAAyBC,CAAAA,CAAzB,aAAAC,CAAAC,MAAAA,GAAAC,SAAAA,EAGsCC,KAAAC,QAAoC,UACpCD,KAAAE,UAA8B,OAClBF,KAAAG,YAAc,OAE5DH,KAAQI,UAAAA,EAAY,CAKpB,mBAAAC,CACPP,MAAMO,kBAAAA,EAENL,KAAKM,aAAa,OAAQ,QAAA,EAC1BN,KAAKM,aAAa,aAAcN,KAAKG,aAAaI,KAAAA,GAAU,MAAA,EAGvDP,KAAKQ,aACRR,KAAKQ,WAAa,OAEpBR,KAAKI,UAAYJ,KAAKS,cAAc,kDAAA,IAAwD,KAC5FC,EAAiB,CACfC,OAAQX,KACRY,01FACAC,KAAM,uBAAA,CAAA,CAEV,CAEmB,cAAAC,CACjBhB,MAAMgB,aAAAA,EACNd,KAAKe,QAAUf,KAAKgB,WAAYP,cAAc,kBAAA,EAC9CT,KAAKiB,eAAiB,IAAIC,eAAe,IAAMlB,KAAKmB,SAAAA,CAAAA,EACpDnB,KAAKiB,eAAeG,QAAQpB,IAAAA,CAC9B,CAEmB,QAAQqB,EAAAA,CACzBvB,MAAMwB,QAAQD,CAAAA,EACVA,EAAQE,IAAI,aAAA,GACdvB,KAAKM,aAAa,aAAcN,KAAKG,aAAaI,KAAAA,GAAU,MAAA,CAEhE,CAES,sBAAAiB,CACP1B,MAAM0B,qBAAAA,EACNxB,KAAKiB,gBAAgBQ,WAAAA,CACvB,CAEQ,UAAAN,CACN,MAAMO,EAAS1B,KAAKe,SAASY,iBAAiB,CAAEC,QAAAA,EAAS,CAAA,EACtDC,KAAMC,GAAO,yBAAyBC,KAAKD,EAAGE,QAAQC,YAAAA,CAAAA,CAAAA,EACzD,GAAIP,EAAQ,CACV,MAAMQ,EAAOC,OAAOC,WAAaC,EAAgB,SAAW,QAC5DX,EAAOpB,aAAa,OAAQ4B,CAAAA,CAC9B,CACF,CAEQ,mBAAAI,CAIN,MAAMC,EAAYvC,KAAKgB,YAAYP,cAAc,oBAAA,EAC3C+B,EAAYxC,KAAKgB,YAAYP,cAAc,oBAAA,EACjDT,KAAKI,WACFmC,GAAWZ,iBAAAA,EAAmBc,QAAU,GAAK,IAC7CD,GAAWb,iBAAAA,EAAmBc,QAAU,GAAK,CAClD,CAEmB,qBAAAC,CACjB,OAAOC,CACT,CAEmB,eAAAC,CACjB,OAAOC;AAAAA,oCACyB7C,KAAKI,UAAY,GAAK,6BAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,KAOxD,CAEmB,uBAAA0C,CACjB,OAAOD;AAAAA,4CACiC7C,KAAKI,UAAY,GAAK,kCAAA;AAAA,0CACxBJ,KAAKsC,iBAAAA;AAAAA,0CACLtC,KAAKsC,iBAAAA;AAAAA;AAAAA,KAG7C,CAAA,EA3FW3C,EACKiB,OAAsB,CAAA,GAAIhB,EAAagB,OAAQmC,myDAEpBC,EAAA,CAA1CC,EAAS,CAAEC,KAAMC,OAAQC,QAAAA,EAAS,CAAA,CAAA,EAHxBzD,EAGgC0D,UAAA,UAAA,CAAA,EACAL,EAAA,CAA1CC,EAAS,CAAEC,KAAMC,OAAQC,QAAAA,EAAS,CAAA,CAAA,EAJxBzD,EAIgC0D,UAAA,YAAA,CAAA,EACYL,EAAA,CAAtDC,EAAS,CAAEC,KAAMC,OAAQG,UAAW,cAAA,CAAA,CAAA,EAL1B3D,EAK4C0D,UAAA,cAAA,GAEtCL,EAAA,CAAhBO,EAAAA,CAAAA,EAPU5D,EAOM0D,UAAA,YAAA,CAAA,EAPN1D,EAANqD,EAAA,CADNQ,EAAc,kBAAA,CAAA,EACF7D,CAAAA"}