@sankhyatronics/sankhya-cms 0.1.18 → 0.3.0

package/dist/chunk-MFRGAT6D.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/hero/Hero.ts","../src/shared/title-highlight.ts"],"sourcesContent":["import { LitElement, css, html, nothing, svg } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport 'iconify-icon';\n\nimport { buttonResetStyles, controlBaseStyles, ctaPillStyles, rootFontFamilyStyles } from '../shared/styles';\nimport { ctaLinkStyles, paddingScaleStyles } from '../shared/section-styles';\nimport { splitTitleHighlight } from '../shared/title-highlight';\nimport { ctaAriaLabel, ctaLabelStyles, renderCtaLabel } from '../shared/cta-label';\nimport { externalLinkAttrs, externalLinkExtras, isExternalHref } from '../shared/external-link';\nimport type { HeroActionEventDetail } from './HeroEvents';\n\nconst HIGHLIGHT_ICON = svg`<svg viewBox=\"0 0 24 24\" aria-hidden=\"true\" focusable=\"false\"><path d=\"M20 6 9 17l-5-5\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path></svg>`;\nconst ARROW_ICON = svg`<svg viewBox=\"0 0 24 24\" aria-hidden=\"true\" focusable=\"false\"><path d=\"M5 12h14m-6-6 6 6-6 6\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"></path></svg>`;\n/* A small padlock, not a tick: the note under the buttons must not read as a fourth highlight. */\nconst CTA_NOTE_ICON = svg`<svg viewBox=\"0 0 24 24\" width=\"14\" height=\"14\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"1.75\" stroke-linecap=\"round\" stroke-linejoin=\"round\" aria-hidden=\"true\" focusable=\"false\"><rect x=\"5\" y=\"11\" width=\"14\" height=\"10\" rx=\"2\"/><path d=\"M8 11V8a4 4 0 0 1 8 0v3\"/></svg>`;\n\n/** A dark card on the corner of the split-layout image: an icon tile, a title and an optional line. */\nexport interface HeroMediaBadge {\n  title: string;\n  text?: string;\n  /** Iconify icon name, e.g. `mdi:shield-check`. */\n  icon?: string;\n}\n\n/** A small screenshot card on the bottom-right corner of the split-layout image. */\nexport interface HeroMediaInset {\n  src: string;\n  alt: string;\n  /** Optional bar above the screenshot inside the card. */\n  label?: string;\n}\n\n/**\n * Full-width hero banner: background image with a darkening overlay, optional eyebrow, title,\n * optional subtitle and up to two call-to-action links. The entrance animation is CSS keyframes\n * (skipped under `prefers-reduced-motion`).\n *\n * `size`, `content-position` and `overlay=\"gradient\"` give the large editorial layout (copy on the\n * lower left over a gradient that darkens towards it) used by enterprise marketing heroes; the\n * defaults keep the original centered banner. Put several heroes in an `st-carousel` with\n * `indicator-style=\"tabs\"` for a tabbed hero carousel.\n *\n * `badge` is a pill above the title; `highlights` is a row of check-marked points under the buttons.\n * `cta-note` is a short line with a small padlock under the buttons (e.g. \"No credit card needed\"), left-aligned\n * with the buttons, or centred in a centred layout.\n * `button-style=\"pill\"` gives the buttons the 52px pill look (primary navy, secondary white with an arrow).\n * `layout=\"split\"` swaps the background for a two-column layout: copy on one side, `image-src` as an\n * `<img>` (alt from `image-alt`) on the other, on normal page colours with no overlay. In the split\n * layout the copy sits in the page's container (`--st-cms-container-max`) with the same side gutter\n * as the other sections.\n *\n * In the split layout, `image-label` adds a window-style bar with that text above the image, and\n * `media-inset` (`{ src, alt, label? }`) puts a small screenshot card on the image's bottom-right corner.\n * `media-inset` replaces `media-badge` when both are set, so only one card shows.\n *\n * A CTA with an `href` is a real link (`<a href>`), so external URLs, `#anchors` and `/path?x=y`\n * work without JavaScript. Its `action` event is cancelable: call `preventDefault()` on it to stop\n * the browser following the link (a router does this to navigate client-side). A CTA without an\n * `href` is a `<button>`.\n *\n * @fires action - Cancelable, before following the link. Detail `{ href, kind }`, `kind` being `primary` or `secondary`.\n * @cssprop --st-hero-text-color - Text colour over the image.\n * @cssprop --st-hero-min-height - Minimum height when `size` is `large` (default `640px`).\n * @cssprop --st-hero-offset-top - Extra space above the content, e.g. the height of a fixed header (default `0`).\n * @cssprop --st-hero-cta-note-color - Colour of the `cta-note` line (default `var(--st-color-text-muted)`).\n * @csspart eyebrow - The small label above the title.\n * @csspart badge - The pill above the title.\n * @csspart highlights - The row of check-marked points.\n * @csspart cta-note - The small line with a padlock under the buttons (`cta-note`).\n * @csspart image - The image in `layout=\"split\"`.\n * @csspart action - The primary call-to-action (`<a>` with an `href`, `<button>` without).\n * @csspart secondary-action - The outlined second call-to-action.\n * @csspart title-highlight - The part of the title picked by `title-highlight`.\n * @csspart media-badge - The dark card on the corner of the split-layout image.\n * @csspart image-bar - The window-style bar above the split-layout image (`image-label`).\n * @csspart media-inset - The screenshot card on the image's bottom-right corner (`media-inset`).\n * @cssprop --st-cms-brand-azure - Colour of the title highlight.\n */\n@customElement('st-hero')\nexport class Hero extends LitElement {\n  static styles = css`\n    ${ctaLabelStyles}\n    ${controlBaseStyles}\n    ${paddingScaleStyles}\n\n    @keyframes st-hero-zoom {\n      from { opacity: 0; transform: scale(1.1); }\n      to { opacity: 1; transform: scale(1); }\n    }\n    @keyframes st-hero-rise {\n      from { opacity: 0; transform: translateY(30px); }\n      to { opacity: 1; transform: none; }\n    }\n    @keyframes st-hero-fade {\n      from { opacity: 0; }\n      to { opacity: 1; }\n    }\n\n    :host {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      position: relative;\n      overflow: hidden;\n      width: 100%;\n      box-sizing: border-box;\n      background-color: var(--st-color-text-strong);\n      background-repeat: no-repeat;\n      background-size: cover;\n      background-position: var(--st-hero-position, center center);\n      color: var(--st-color-on-solid);\n      /* Room for a fixed header over the top of the hero (see --st-hero-offset-top). */\n      padding-top: var(--st-hero-offset-top, 0px);\n      ${rootFontFamilyStyles}\n      animation: st-hero-zoom 1.5s ease-out;\n    }\n\n    :host([inverted]) {\n      background-color: var(--st-color-surface);\n      color: var(--st-color-text-strong);\n    }\n\n    .overlay {\n      position: absolute;\n      inset: 0;\n      z-index: 1;\n      background: linear-gradient(\n        to bottom,\n        color-mix(in oklch, var(--st-color-text-strong) 40%, transparent),\n        color-mix(in oklch, var(--st-color-text-strong) 20%, transparent),\n        color-mix(in oklch, var(--st-color-text-strong) 40%, transparent)\n      );\n    }\n\n    :host([inverted]) .overlay {\n      display: none;\n    }\n\n    .content {\n      display: flex;\n      flex-direction: column;\n      gap: var(--st-space-20);\n      position: relative;\n      z-index: 2;\n      width: 80%;\n      margin: 0 auto;\n      text-align: center;\n      align-items: center;\n      /* Set here, not only on :host: text sits on the image/overlay, so a colour class the page puts\n         on the host (e.g. a theme text colour) must not turn it dark. */\n      color: var(--st-hero-text-color, var(--st-color-on-solid));\n    }\n\n    :host([inverted]) .content {\n      color: var(--st-hero-text-color, var(--st-color-text-strong));\n    }\n\n    :host([text-alignment='left']) .content { text-align: left; align-items: flex-start; }\n    :host([text-alignment='right']) .content { text-align: right; align-items: flex-end; }\n    :host([text-alignment='justify']) .content { text-align: justify; align-items: stretch; }\n\n    .title {\n      font-size: var(--st-cms-text-display);\n      font-weight: var(--st-font-weight-bold);\n      line-height: 1.1;\n      color: inherit;\n      margin: 0;\n      animation: st-hero-rise 0.8s 0.3s ease-out backwards;\n    }\n\n    .subtitle {\n      font-size: var(--st-cms-text-xl);\n      line-height: 1.5;\n      color: inherit;\n      margin: 0;\n      animation: st-hero-fade 0.8s 0.5s ease-out backwards;\n    }\n\n    .actions {\n      display: flex;\n      justify-content: center;\n      width: 100%;\n    }\n\n    .cta {\n      ${buttonResetStyles}\n      ${ctaLinkStyles}\n      background: var(--st-button-primary-bg);\n      color: var(--st-button-primary-color);\n      font-weight: var(--st-button-font-weight);\n      font-size: var(--st-text-md);\n      animation: st-hero-rise 0.6s 0.7s ease-out backwards;\n    }\n\n    .cta:hover {\n      transform: scale(1.05);\n    }\n\n    .cta:active {\n      transform: scale(0.98);\n    }\n\n    .eyebrow {\n      margin: 0;\n      font-size: var(--st-text-sm);\n      font-weight: var(--st-font-weight-bold);\n      letter-spacing: 0.12em;\n      text-transform: uppercase;\n      color: inherit;\n      opacity: 0.85;\n      animation: st-hero-fade 0.8s 0.2s ease-out backwards;\n    }\n\n    .actions {\n      flex-wrap: wrap;\n      gap: var(--st-space-12);\n    }\n\n    .cta.secondary {\n      background: transparent;\n      color: inherit;\n      box-shadow: inset 0 0 0 1.5px currentColor;\n    }\n\n    .cta.secondary:hover {\n      background: color-mix(in oklch, currentColor 12%, transparent);\n    }\n\n    /* size=\"large\" / \"full\": a tall editorial hero. */\n    :host([size='large']) {\n      min-height: var(--st-hero-min-height, 640px);\n    }\n\n    :host([size='full']) {\n      min-height: 100svh;\n    }\n\n    :host([size='large']) .title,\n    :host([size='full']) .title {\n      font-size: clamp(2.5rem, 6vw, 5rem);\n      letter-spacing: -0.02em;\n      line-height: 1.05;\n    }\n\n    /* content-position=\"bottom\": copy sits in the lower part of the hero, on the container grid. */\n    :host([content-position='bottom']) {\n      align-items: flex-end;\n    }\n\n    :host([content-position='bottom']) .content {\n      width: 100%;\n      max-width: var(--st-cms-container-max);\n      box-sizing: border-box;\n      padding: var(--st-space-48) var(--st-space-24);\n    }\n\n    :host([content-position='bottom']) .title,\n    :host([content-position='bottom']) .subtitle {\n      max-width: 18ch;\n    }\n\n    :host([content-position='bottom']) .subtitle {\n      max-width: 48ch;\n    }\n\n    :host([content-position='bottom']:not([text-alignment='center']):not([text-alignment='right'])) .actions {\n      justify-content: flex-start;\n    }\n\n    :host([content-position='bottom'][text-alignment='center']) .title,\n    :host([content-position='bottom'][text-alignment='center']) .subtitle {\n      margin-inline: auto;\n    }\n\n    /* overlay=\"gradient\": darkest behind the copy, clearing towards the far side of the image. */\n    :host([overlay='gradient']) .overlay {\n      background:\n        linear-gradient(to top, color-mix(in oklch, var(--st-color-text-strong) 85%, transparent), transparent 70%),\n        linear-gradient(to right, color-mix(in oklch, var(--st-color-text-strong) 70%, transparent), transparent 75%);\n    }\n\n    :host([overlay='gradient'][text-alignment='right']) .overlay {\n      background:\n        linear-gradient(to top, color-mix(in oklch, var(--st-color-text-strong) 85%, transparent), transparent 70%),\n        linear-gradient(to left, color-mix(in oklch, var(--st-color-text-strong) 70%, transparent), transparent 75%);\n    }\n\n    :host([overlay='none']) .overlay {\n      display: none;\n    }\n\n    .badge {\n      display: inline-flex;\n      align-items: center;\n      gap: var(--st-space-8);\n      margin: 0;\n      padding: 6px 14px;\n      border: 1px solid var(--st-color-border);\n      border-radius: var(--st-radius-full);\n      background: var(--st-color-surface);\n      color: var(--st-color-text-strong);\n      font-size: var(--st-text-sm);\n      font-weight: var(--st-font-weight-bold);\n      letter-spacing: var(--st-tracking-wider);\n      line-height: 1.2;\n      text-transform: uppercase;\n      animation: st-hero-fade 0.8s 0.2s ease-out backwards;\n    }\n\n    .badge::before {\n      content: '';\n      flex: none;\n      width: 8px;\n      height: 8px;\n      border-radius: var(--st-radius-circle);\n      background: var(--st-cms-highlight);\n    }\n\n    .highlights {\n      display: flex;\n      flex-wrap: wrap;\n      justify-content: center;\n      gap: var(--st-space-12) var(--st-space-24);\n      margin: 0;\n      padding: 0;\n      list-style: none;\n      animation: st-hero-fade 0.8s 0.9s ease-out backwards;\n    }\n\n    .highlight {\n      display: inline-flex;\n      align-items: center;\n      gap: var(--st-space-8);\n      font-size: var(--st-text-md);\n      font-weight: var(--st-font-weight-semibold);\n      color: inherit;\n    }\n\n    .highlight svg {\n      flex: none;\n      width: 18px;\n      height: 18px;\n      color: var(--st-cms-highlight);\n    }\n\n    :host([text-alignment='left']) .highlights {\n      justify-content: flex-start;\n    }\n\n    :host([text-alignment='right']) .highlights {\n      justify-content: flex-end;\n    }\n\n    /* The buttons and the cta-note share one column, so the note sits under the buttons and follows their alignment. */\n    .cta-group {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      width: 100%;\n    }\n\n    :host([text-alignment='left']) .cta-group,\n    :host([text-alignment='justify']) .cta-group {\n      align-items: flex-start;\n    }\n\n    .cta-note {\n      display: inline-flex;\n      align-items: center;\n      gap: 6px;\n      margin: 8px 0 0;\n      font-size: 14px;\n      font-weight: 500;\n      line-height: 1.4;\n      color: var(--st-hero-cta-note-color, var(--st-color-text-muted));\n      animation: st-hero-fade 0.8s 0.8s ease-out backwards;\n    }\n\n    .cta-note svg,\n    .cta-note iconify-icon {\n      flex: none;\n      width: 14px;\n      height: 14px;\n      font-size: 14px;\n    }\n\n    /* layout=\"split\": a two-column block on the page surface; the image replaces the background. */\n    /* The side gutter matches the other CMS sections (--st-space-24, 16px on phones). Once the\n       viewport is wider than the container, the padding takes the rest of the space so the copy\n       and image fill the same centred --st-cms-container-max column as st-features-section and\n       friends; the background stays edge to edge. */\n    :host([layout='split']) {\n      --st-hero-gutter: var(--st-space-24);\n      display: grid;\n      grid-template-columns: repeat(auto-fit, minmax(min(340px, 100%), 1fr));\n      align-items: center;\n      gap: var(--st-space-48);\n      overflow: visible;\n      padding: calc(var(--st-cms-section-padding) + var(--st-hero-offset-top, 0px))\n        max(var(--st-hero-gutter), calc((100% - var(--st-cms-container-max)) / 2)) !important;\n      background-color: var(--st-color-surface);\n      background-image: none;\n      color: var(--st-color-text-strong);\n      animation: none;\n    }\n\n    :host([layout='split']) .overlay {\n      display: none;\n    }\n\n    :host([layout='split']) .content {\n      width: 100%;\n      margin: 0;\n      padding: 0;\n      max-width: 560px;\n      color: var(--st-hero-text-color, var(--st-color-text-strong));\n    }\n\n    :host([layout='split'][text-alignment='left']) .actions {\n      justify-content: flex-start;\n    }\n\n    :host([layout='split']) .highlight svg {\n      color: var(--st-color-accent);\n    }\n\n    .media {\n      margin: 0;\n      min-width: 0;\n      position: relative;\n    }\n\n    /* title-highlight: the picked words in the brand azure (large display text, so AA large applies). */\n    .title-highlight {\n      color: var(--st-cms-brand-azure);\n    }\n\n    /* mediaBadge: a navy card overlapping the bottom-left corner of the split-layout image. */\n    .media-badge {\n      position: absolute;\n      left: -28px;\n      bottom: -28px;\n      z-index: 2;\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      box-sizing: border-box;\n      max-width: 260px;\n      padding: 14px 16px;\n      border-radius: 12px;\n      background: var(--st-cms-navy);\n      color: var(--st-cms-primary-100);\n      box-shadow: 0 20px 25px -5px #0000001a, 0 10px 10px -5px #0000000a;\n    }\n\n    .media-badge-icon {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      flex: none;\n      width: 36px;\n      height: 36px;\n      border-radius: 10px;\n      background: var(--st-cms-highlight);\n      color: var(--st-cms-navy);\n      font-size: 20px;\n    }\n\n    .media-badge-title {\n      margin: 0;\n      font-size: 14px;\n      font-weight: var(--st-font-weight-bold);\n      line-height: 1.3;\n      color: var(--st-cms-on-dark);\n    }\n\n    .media-badge-text {\n      margin: 2px 0 0;\n      font-size: 13px;\n      line-height: 1.4;\n      color: inherit;\n    }\n\n    /* imageLabel: a window-style bar above the split-layout image. It sits outside the image box, so\n       the image keeps its 4:3 frame; the image's top corners are squared to meet the bar. */\n    .image-bar {\n      display: flex;\n      align-items: center;\n      gap: 8px;\n      padding: 10px 16px;\n      border-bottom: 1px solid var(--st-cms-primary-100, #e4ebff);\n      border-radius: var(--st-radius-lg) var(--st-radius-lg) 0 0;\n      background: var(--st-hero-image-bar-bg, #fafbff);\n    }\n\n    .image-bar-dot {\n      flex: none;\n      width: 10px;\n      height: 10px;\n      border-radius: 9999px;\n      background: var(--st-cms-primary-200, #c9d7fe);\n    }\n\n    .image-bar-label {\n      margin-left: 8px;\n      font-size: 12px;\n      font-weight: 600;\n      color: var(--st-cms-text, #03346b);\n    }\n\n    .image.has-bar {\n      border-top-left-radius: 0;\n      border-top-right-radius: 0;\n    }\n\n    /* mediaInset: the media column reserves 36px below the image so the card hangs off the corner.\n       The card is a sibling of the image, not inside it, so nothing clips it. */\n    .media.has-inset {\n      padding-bottom: 36px;\n    }\n\n    .media-inset {\n      position: absolute;\n      right: 0;\n      bottom: 0;\n      z-index: 1;\n      box-sizing: border-box;\n      width: 46%;\n      overflow: hidden;\n      border: 1px solid var(--st-cms-primary-200, #c9d7fe);\n      border-radius: 12px;\n      background: var(--st-color-surface, #fff);\n      box-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 10px 10px -5px rgb(0 0 0 / 0.04);\n    }\n\n    .media-inset-label {\n      padding: 6px 10px;\n      font-size: 11px;\n      font-weight: 600;\n      color: var(--st-cms-text, #03346b);\n      background: var(--st-cms-surface-soft, #f0f3ff);\n      border-bottom: 1px solid var(--st-cms-primary-100, #e4ebff);\n    }\n\n    .media-inset img {\n      display: block;\n      width: 100%;\n      height: auto;\n    }\n\n    /* buttonStyle=\"pill\": 52px pills. The primary is brand navy with a soft shadow; the secondary is\n       white with a light primary-200 border, navy text and a trailing arrow. */\n    :host([button-style='pill']) .cta {\n      ${ctaPillStyles}\n      font-size: 17px;\n      transition: transform 0.2s ease, background-color 0.2s ease;\n    }\n\n    :host([button-style='pill']) .cta:not(.secondary) {\n      background: var(--st-cms-brand-navy);\n      color: var(--st-cms-on-dark);\n      box-shadow: 0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;\n    }\n\n    :host([button-style='pill']) .cta:not(.secondary):hover {\n      background: color-mix(in oklch, var(--st-cms-brand-navy) 88%, var(--st-cms-navy));\n    }\n\n    :host([button-style='pill']) .cta.secondary {\n      padding: 0 24px;\n      background: var(--st-cms-on-dark);\n      color: var(--st-cms-accent-text, var(--st-cms-brand-navy));\n      border: 1px solid var(--st-cms-primary-200);\n      box-shadow: none;\n    }\n\n    :host([button-style='pill']) .cta.secondary:hover {\n      background: var(--st-cms-primary-100);\n    }\n\n    :host([button-style='pill']) .cta svg {\n      flex: none;\n      width: 18px;\n      height: 18px;\n    }\n\n    :host([button-style='pill']) .cta:focus-visible {\n      outline: var(--st-focus-ring);\n      outline-offset: 2px;\n    }\n\n    /* Wide screens: the badge hangs off the bottom-left corner. Its top sits 16px above the image's\n       bottom edge (--st-hero-badge-overlap), so it overlaps only that corner and clears the button\n       inside the image. The\n       figure's bottom padding gives the hanging card room; the badge's top is measured from the\n       image bottom (100% includes that padding, so it is subtracted). */\n    @media (min-width: 769px) {\n      .media {\n        --st-hero-media-pad: 48px;\n        padding-bottom: var(--st-hero-media-pad);\n      }\n\n      .media-badge {\n        top: calc(100% - var(--st-hero-media-pad) - var(--st-hero-badge-overlap, 16px));\n        bottom: auto;\n      }\n    }\n\n    /* Narrow screens: the badge flows under the image instead of overlapping it. */\n    @media (max-width: 768px) {\n      .media-badge {\n        position: static;\n        margin-top: var(--st-space-16);\n        max-width: none;\n      }\n    }\n\n    .image {\n      display: block;\n      width: 100%;\n      height: auto;\n      aspect-ratio: 4 / 3;\n      object-fit: cover;\n      border-radius: var(--st-radius-lg);\n      box-shadow: 0 24px 48px -16px var(--st-shadow-color-lg);\n    }\n\n    @media (max-width: 768px) {\n      :host([layout='split']) {\n        --st-hero-gutter: var(--st-space-16);\n      }\n    }\n\n    @media (min-width: 768px) {\n      .content { padding: var(--st-space-32); }\n    }\n    @media (min-width: 1024px) {\n      .content { padding: var(--st-space-48); }\n      :host([content-position='bottom']) .content { padding: var(--st-space-48) var(--st-space-32) 6rem; }\n    }\n\n    /* A carousel's first slide is on screen at first paint, so its entrance stays off (st-carousel sets\n       data-st-still until the slides first change). Later slides animate in when they turn. */\n    :host([data-st-still]),\n    :host([data-st-still]) .eyebrow,\n    :host([data-st-still]) .badge,\n    :host([data-st-still]) .title,\n    :host([data-st-still]) .subtitle,\n    :host([data-st-still]) .cta,\n    :host([data-st-still]) .cta-note,\n    :host([data-st-still]) .highlights {\n      animation: none;\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      :host, .eyebrow, .badge, .title, .subtitle, .cta, .cta-note, .highlights { animation: none; }\n      .cta { transition: none; }\n    }\n  `;\n\n  @property({ type: String })\n  title = '';\n\n  @property({ type: String })\n  subtitle = '';\n\n  @property({ type: String, attribute: 'image-src' })\n  imageSrc = '';\n\n  @property({ type: String, attribute: 'action-label' })\n  actionLabel = '';\n\n  /** Shorter `action-label` for phones (< 480px), so the button fits on one line. The full label\n   * stays the link's accessible name. */\n  @property({ type: String, attribute: 'action-label-short' })\n  actionLabelShort = '';\n\n  @property({ type: String })\n  href = '';\n\n  @property({ type: String, reflect: true, attribute: 'text-alignment' })\n  textAlignment: 'left' | 'center' | 'right' | 'justify' = 'left';\n\n  @property({ type: String, reflect: true })\n  padding: 'none' | 'small' | 'medium' | 'large' = 'none';\n\n  @property({ type: Boolean, reflect: true })\n  inverted = false;\n\n  @property({ type: String, attribute: 'focal-point' })\n  focalPoint: 'top' | 'left' | 'right' | 'bottom' | 'center' = 'center';\n\n  /** Small uppercase label above the title (e.g. an event or product name). */\n  @property({ type: String })\n  eyebrow = '';\n\n  /** Label of an outlined second button next to the primary one. */\n  @property({ type: String, attribute: 'secondary-action-label' })\n  secondaryActionLabel = '';\n\n  /** Shorter `secondary-action-label` for phones (< 480px). */\n  @property({ type: String, attribute: 'secondary-action-label-short' })\n  secondaryActionLabelShort = '';\n\n  @property({ type: String, attribute: 'secondary-href' })\n  secondaryHref = '';\n\n  /** Small pill above the title (e.g. \"New\", \"Now available\"). */\n  @property({ type: String })\n  badge = '';\n\n  /** Check-marked points shown in a row under the buttons. */\n  @property({ attribute: false })\n  highlights: string[] = [];\n\n  /** Short line with a small check under the buttons (e.g. \"No credit card needed\"). Empty hides it. */\n  @property({ type: String, attribute: 'cta-note' })\n  ctaNote = '';\n\n  /** Iconify icon for the `cta-note` line (e.g. `mdi:open-source-initiative`). Empty keeps the padlock. */\n  @property({ type: String, attribute: 'cta-note-icon' })\n  ctaNoteIcon = '';\n\n  /** `background` (default) puts `image-src` behind the copy; `split` puts copy and image side by side. */\n  @property({ type: String, reflect: true })\n  layout: 'background' | 'split' = 'background';\n\n  /** Alt text of the image in `layout=\"split\"`. Empty marks it as decorative. */\n  @property({ type: String, attribute: 'image-alt' })\n  imageAlt = '';\n\n  /** `auto` sizes to the content; `large` is a tall editorial hero (`--st-hero-min-height`); `full` fills the viewport. */\n  @property({ type: String, reflect: true })\n  size: 'auto' | 'large' | 'full' = 'auto';\n\n  /** `center` keeps the copy in the middle; `bottom` puts it in the lower part of the hero, on the page container. */\n  @property({ type: String, reflect: true, attribute: 'content-position' })\n  contentPosition: 'center' | 'bottom' = 'center';\n\n  /** `even` darkens the whole image; `gradient` darkens behind the copy only; `none` shows the image as is. */\n  @property({ type: String, reflect: true })\n  overlay: 'even' | 'gradient' | 'none' = 'even';\n\n  /** Text of `title` to set in the brand azure. Only the first occurrence is highlighted. */\n  @property({ type: String, attribute: 'title-highlight' })\n  titleHighlight = '';\n\n  /** A dark card on the corner of the image, with an optional icon. Shown with `layout=\"split\"` and an `image-src`. */\n  @property({ attribute: false })\n  mediaBadge?: HeroMediaBadge;\n\n  /** Label of a window-style bar (three dots, then the text) above the split-layout image. Shown with `layout=\"split\"` and an `image-src`. */\n  @property({ type: String, attribute: 'image-label' })\n  imageLabel = '';\n\n  /** A small screenshot card on the bottom-right corner of the split-layout image. Replaces `mediaBadge` when both are set. */\n  @property({ attribute: false })\n  mediaInset?: HeroMediaInset;\n\n  /** `default` keeps the plain buttons. `pill` gives the buttons the 52px pill style (the secondary one with an arrow). */\n  @property({ type: String, reflect: true, attribute: 'button-style' })\n  buttonStyle: 'default' | 'pill' = 'default';\n\n  /** Level of the title heading: `1` (default) for a page's main hero, `2` for a hero that is not the\n   * page heading (e.g. the slides of a hero carousel, where the page has its own `<h1>`). */\n  @property({ type: Number, attribute: 'heading-level' })\n  headingLevel: 1 | 2 = 1;\n\n  private static positions = {\n    top: 'center top',\n    left: 'left center',\n    right: 'right center',\n    bottom: 'center bottom',\n    center: 'center center'\n  } as const;\n\n  /**\n   * A hero that is already inside the first screen when it connects is on screen at first paint, so its\n   * entrance animation (rise, fades, image zoom) would only delay the copy: it renders still. A hero\n   * further down the page keeps its entrance. A carousel slide is handled by `st-carousel` instead.\n   */\n  connectedCallback(): void {\n    super.connectedCallback();\n    if (this.closest('st-carousel')) return;\n    if (this.getBoundingClientRect().top < window.innerHeight) this.setAttribute('data-st-still', '');\n  }\n\n  protected willUpdate(): void {\n    const asBackground = this.layout !== 'split';\n    this.style.backgroundImage = asBackground && this.imageSrc ? `url(${JSON.stringify(this.imageSrc)})` : '';\n    this.style.setProperty('--st-hero-position', Hero.positions[this.focalPoint] ?? Hero.positions.center);\n  }\n\n  private emitAction(event: MouseEvent, href: string, kind: 'primary' | 'secondary'): void {\n    const action = new CustomEvent<HeroActionEventDetail>('action', {\n      detail: { href, kind },\n      bubbles: true,\n      composed: true,\n      cancelable: true\n    });\n    this.dispatchEvent(action);\n    if (action.defaultPrevented) event.preventDefault();\n  }\n\n  private renderCta(label: string, href: string, kind: 'primary' | 'secondary') {\n    const secondary = kind === 'secondary';\n    const className = secondary ? 'cta secondary' : 'cta';\n    const part = secondary ? 'secondary-action' : 'action';\n    const onClick = (event: MouseEvent) => this.emitAction(event, href, kind);\n    const arrow = secondary && this.buttonStyle === 'pill' ? ARROW_ICON : nothing;\n    const { target, rel } = externalLinkAttrs(href);\n    const external = isExternalHref(href);\n    const short = secondary ? this.secondaryActionLabelShort : this.actionLabelShort;\n    const text = renderCtaLabel(label, short);\n    const ariaLabel = ctaAriaLabel(label, short, external ? ' (opens in new tab)' : '');\n    return href\n      ? html`<a class=${className} part=${part} href=${href} target=${target} rel=${rel} aria-label=${ariaLabel} @click=${onClick}\n          >${text}${external ? externalLinkExtras(href) : arrow}</a\n        >`\n      : html`<button class=${className} part=${part} type=\"button\" aria-label=${ariaLabel} @click=${onClick}>${text}${arrow}</button>`;\n  }\n\n  /** The title with the `title-highlight` text wrapped in its own span; plain text otherwise. */\n  private renderTitle() {\n    const parts = splitTitleHighlight(this.title, this.titleHighlight);\n    if (!parts) return this.title;\n    return html`${parts.before}<span class=\"title-highlight\" part=\"title-highlight\">${parts.match}</span>${parts.after}`;\n  }\n\n  private renderMediaBadge() {\n    const badge = this.mediaBadge;\n    if (!badge?.title) return nothing;\n    return html`<div class=\"media-badge\" part=\"media-badge\">\n      ${badge.icon ? html`<span class=\"media-badge-icon\" aria-hidden=\"true\"><iconify-icon icon=${badge.icon}></iconify-icon></span>` : nothing}\n      <div>\n        <p class=\"media-badge-title\">${badge.title}</p>\n        ${badge.text ? html`<p class=\"media-badge-text\">${badge.text}</p>` : nothing}\n      </div>\n    </div>`;\n  }\n\n  private renderImageBar() {\n    if (!this.imageLabel) return nothing;\n    return html`<div class=\"image-bar\" part=\"image-bar\">\n      <span class=\"image-bar-dot\" aria-hidden=\"true\"></span>\n      <span class=\"image-bar-dot\" aria-hidden=\"true\"></span>\n      <span class=\"image-bar-dot\" aria-hidden=\"true\"></span>\n      <span class=\"image-bar-label\">${this.imageLabel}</span>\n    </div>`;\n  }\n\n  private renderMediaInset(inset: HeroMediaInset) {\n    return html`<div class=\"media-inset\" part=\"media-inset\">\n      ${inset.label ? html`<div class=\"media-inset-label\">${inset.label}</div>` : nothing}\n      <img src=${inset.src} alt=${inset.alt} />\n    </div>`;\n  }\n\n  render() {\n    const inset = this.mediaInset?.src ? this.mediaInset : undefined;\n    return html`\n      <div class=\"overlay\" part=\"overlay\"></div>\n      <div class=\"content\" part=\"content\">\n        ${this.eyebrow ? html`<p class=\"eyebrow\" part=\"eyebrow\">${this.eyebrow}</p>` : nothing}\n        ${this.badge ? html`<p class=\"badge\" part=\"badge\">${this.badge}</p>` : nothing}\n        ${this.headingLevel === 2\n          ? html`<h2 class=\"title\" part=\"title\">${this.renderTitle()}</h2>`\n          : html`<h1 class=\"title\" part=\"title\">${this.renderTitle()}</h1>`}\n        ${this.subtitle ? html`<p class=\"subtitle\" part=\"subtitle\">${this.subtitle}</p>` : nothing}\n        ${this.actionLabel || this.secondaryActionLabel || this.ctaNote\n          ? html`<div class=\"cta-group\">\n              ${this.actionLabel || this.secondaryActionLabel\n                ? html`<div class=\"actions\" part=\"actions\">\n                    ${this.actionLabel ? this.renderCta(this.actionLabel, this.href, 'primary') : nothing}\n                    ${this.secondaryActionLabel ? this.renderCta(this.secondaryActionLabel, this.secondaryHref, 'secondary') : nothing}\n                  </div>`\n                : nothing}\n              ${this.ctaNote\n                ? html`<p class=\"cta-note\" part=\"cta-note\">${this.ctaNoteIcon\n                    ? html`<iconify-icon icon=${this.ctaNoteIcon} aria-hidden=\"true\"></iconify-icon>`\n                    : CTA_NOTE_ICON}<span>${this.ctaNote}</span></p>`\n                : nothing}\n            </div>`\n          : nothing}\n        ${this.highlights.length\n          ? html`<ul class=\"highlights\" part=\"highlights\">\n              ${this.highlights.map(\n                (text) => html`<li class=\"highlight\" part=\"highlight\">${HIGHLIGHT_ICON}<span>${text}</span></li>`\n              )}\n            </ul>`\n          : nothing}\n        <slot></slot>\n      </div>\n      ${this.layout === 'split' && this.imageSrc\n        ? html`<figure class=${inset ? 'media has-inset' : 'media'} part=\"media\">\n            ${this.renderImageBar()}\n            <img class=${this.imageLabel ? 'image has-bar' : 'image'} part=\"image\" src=${this.imageSrc} alt=${this.imageAlt} />\n            ${inset ? this.renderMediaInset(inset) : this.renderMediaBadge()}\n          </figure>`\n        : nothing}\n    `;\n  }\n}\n","/** The three pieces of a title around its first highlighted substring. */\nexport interface TitleHighlightParts {\n  before: string;\n  match: string;\n  after: string;\n}\n\n/**\n * Splits `title` around the first occurrence of `highlight`. Returns `null` when there is nothing\n * to highlight (empty `highlight`, or it does not occur), so the caller renders the plain title.\n * Plain string handling only: the caller renders the pieces as text, never as HTML.\n */\nexport function splitTitleHighlight(title: string, highlight: string): TitleHighlightParts | null {\n  if (!highlight) return null;\n  const index = title.indexOf(highlight);\n  if (index === -1) return null;\n  return {\n    before: title.slice(0, index),\n    match: highlight,\n    after: title.slice(index + highlight.length)\n  };\n}\n"],"mappings":"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AA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA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","names":[]}