@sankhyatronics/sankhya-cms 0.1.16 → 0.2.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sankhyatronics/sankhya-cms",
-  "version": "0.1.16",
+  "version": "0.2.0",
   "repository": {
     "type": "git",
     "url": "https://github.com/sankhyatronics/SankhyaCMS.git",
@@ -136,6 +136,18 @@
       "types": "./dist/stats/index.d.ts",
       "import": "./dist/stats/index.js"
     },
+    "./steps": {
+      "types": "./dist/steps/index.d.ts",
+      "import": "./dist/steps/index.js"
+    },
+    "./tag-strip": {
+      "types": "./dist/tag-strip/index.d.ts",
+      "import": "./dist/tag-strip/index.js"
+    },
+    "./flow": {
+      "types": "./dist/flow/index.d.ts",
+      "import": "./dist/flow/index.js"
+    },
     "./testimonials": {
       "types": "./dist/testimonials/index.d.ts",
       "import": "./dist/testimonials/index.js"
@@ -181,7 +193,7 @@
     "access": "public"
   },
   "scripts": {
-    "build": "tsup src/index.ts src/schema/index.ts src/theming/index.ts src/shared/styles.ts src/shared/icons.ts src/attention-panel/index.ts src/bar-chart/index.ts src/chip/index.ts src/date-tile/index.ts src/kpi-card/index.ts src/segmented-control/index.ts src/tooltip/index.ts src/bento-grid/index.ts src/card/index.ts src/carousel/index.ts src/content-block/index.ts src/cookie-consent/index.ts src/dropdown/index.ts src/feature-split/index.ts src/features-section/index.ts src/footer/index.ts src/header/index.ts src/hero/index.ts src/icon-button/index.ts src/items-accordion/index.ts src/markdown/index.ts src/mega-menu/index.ts src/menu-grid/index.ts src/menu-grid-item/index.ts src/menu-item/index.ts src/promo-banner/index.ts src/section/index.ts src/select/index.ts src/stats/index.ts src/testimonials/index.ts --format esm --dts --sourcemap --clean && node scripts/copy-theme.mjs && node scripts/copy-fonts.mjs && cem analyze",
+    "build": "tsup src/index.ts src/schema/index.ts src/theming/index.ts src/shared/styles.ts src/shared/icons.ts src/attention-panel/index.ts src/bar-chart/index.ts src/chip/index.ts src/date-tile/index.ts src/kpi-card/index.ts src/segmented-control/index.ts src/tooltip/index.ts src/bento-grid/index.ts src/card/index.ts src/carousel/index.ts src/content-block/index.ts src/cookie-consent/index.ts src/dropdown/index.ts src/feature-split/index.ts src/features-section/index.ts src/footer/index.ts src/header/index.ts src/hero/index.ts src/icon-button/index.ts src/items-accordion/index.ts src/markdown/index.ts src/mega-menu/index.ts src/menu-grid/index.ts src/menu-grid-item/index.ts src/menu-item/index.ts src/promo-banner/index.ts src/section/index.ts src/select/index.ts src/stats/index.ts src/steps/index.ts src/tag-strip/index.ts src/flow/index.ts src/testimonials/index.ts --format esm --dts --sourcemap --clean && node scripts/copy-theme.mjs && node scripts/copy-fonts.mjs && cem analyze",
     "dev": "tsup src/index.ts --watch --format esm --dts",
     "typecheck": "tsc --noEmit",
     "lint": "oxlint",

package/dist/chunk-5EBWMPJS.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/markdown/Markdown.ts"],"sourcesContent":["import { LitElement, css, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport { unsafeHTML } from 'lit/directives/unsafe-html.js';\nimport DOMPurify from 'dompurify';\nimport { marked } from 'marked';\n\nimport { controlBaseStyles, fontFamilyStyles } from '../shared/styles';\nimport type { MarkdownErrorEventDetail } from './MarkdownEvents';\n\n/**\n * Renders Markdown (GFM, single newlines become `<br>`) from either an inline `content` string or\n * a `src` URL it fetches. Ports `SankhyaUI`'s `useMarkdown` hook + `react-markdown` (remark-gfm,\n * remark-breaks); output is sanitized with DOMPurify. `src` wins over `content` when both are set.\n * While a fetch is pending it shows \"Loading content...\"; on failure \"Error loading content.\" and\n * a `markdown-error` event (detail: `{ error }`).\n *\n * Text color is inherited from the parent so inverted containers just work.\n */\n@customElement('st-markdown')\nexport class Markdown extends LitElement {\n  static styles = css`\n    ${controlBaseStyles}\n\n    :host {\n      display: block;\n      ${fontFamilyStyles}\n      line-height: 1.7;\n    }\n\n    :host > div > :first-child {\n      margin-top: 0;\n    }\n\n    h1,\n    h2,\n    h3,\n    h4 {\n      color: inherit;\n      font-weight: var(--st-font-weight-bold);\n      line-height: 1.3;\n    }\n\n    h2 {\n      font-size: var(--st-text-2xl);\n      margin: var(--st-space-48) 0 var(--st-space-24);\n    }\n\n    h3 {\n      font-size: var(--st-text-xl);\n      font-weight: var(--st-font-weight-semibold);\n      margin: var(--st-space-32) 0 var(--st-space-16);\n    }\n\n    p {\n      margin: 0 0 var(--st-space-24);\n    }\n\n    ul,\n    ol {\n      margin: 0 0 var(--st-space-24);\n      padding-left: var(--st-space-24);\n    }\n\n    li {\n      margin-bottom: var(--st-space-8);\n    }\n\n    a {\n      color: inherit;\n      text-decoration: underline;\n      text-underline-offset: 4px;\n    }\n\n    a:hover {\n      color: var(--st-color-text-strong);\n    }\n\n    img {\n      max-width: 100%;\n      height: auto;\n      border-radius: var(--st-radius-sm);\n      margin: var(--st-space-32) 0;\n    }\n\n    blockquote {\n      border-left: 4px solid var(--st-color-border);\n      margin: var(--st-space-32) 0;\n      padding-left: var(--st-space-24);\n      font-style: italic;\n    }\n\n    table {\n      border-collapse: collapse;\n      margin: 0 0 var(--st-space-24);\n    }\n\n    th,\n    td {\n      border: 1px solid var(--st-color-border);\n      padding: var(--st-space-8) var(--st-space-12);\n    }\n\n    pre,\n    code {\n      background: var(--st-color-subtle);\n      border-radius: var(--st-radius-xs);\n    }\n\n    code {\n      padding: 0 var(--st-space-4);\n    }\n\n    pre {\n      padding: var(--st-space-16);\n      overflow-x: auto;\n    }\n\n    pre code {\n      padding: 0;\n    }\n  `;\n\n  /** Inline Markdown source. Ignored when `src` is set. */\n  @property({ type: String })\n  content = '';\n\n  /** URL of a Markdown file to fetch. */\n  @property({ type: String })\n  src = '';\n\n  @state() private fetched = '';\n  @state() private loading = false;\n  @state() private error: Error | null = null;\n\n  private abort?: AbortController;\n\n  willUpdate(changed: Map<string, unknown>): void {\n    if (changed.has('src')) void this.load();\n  }\n\n  disconnectedCallback(): void {\n    this.abort?.abort();\n    super.disconnectedCallback();\n  }\n\n  private async load(): Promise<void> {\n    this.abort?.abort();\n    this.fetched = '';\n    this.error = null;\n    if (!this.src) {\n      this.loading = false;\n      return;\n    }\n    const controller = new AbortController();\n    this.abort = controller;\n    this.loading = true;\n    try {\n      const response = await fetch(this.src, { signal: controller.signal });\n      if (!response.ok) throw new Error(`Failed to fetch markdown: ${response.statusText}`);\n      const text = await response.text();\n      if (controller.signal.aborted) return;\n      this.fetched = text;\n    } catch (err) {\n      if (controller.signal.aborted) return;\n      this.error = err instanceof Error ? err : new Error('Unknown error fetching markdown');\n      this.dispatchEvent(\n        new CustomEvent<MarkdownErrorEventDetail>('markdown-error', {\n          detail: { error: this.error },\n          bubbles: true,\n          composed: true\n        })\n      );\n    }\n    this.loading = false;\n  }\n\n  render() {\n    if (this.loading) return html`<div part=\"loading\">Loading content...</div>`;\n    if (this.error) return html`<div part=\"error\">Error loading content.</div>`;\n    const source = this.src ? this.fetched : this.content;\n    if (!source) return nothing;\n    const rendered = DOMPurify.sanitize(marked.parse(source, { gfm: true, breaks: true, async: false }));\n    return html`<div part=\"body\">${unsafeHTML(rendered)}</div>`;\n  }\n}\n"],"mappings":"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","names":[]}

package/dist/chunk-76AVBQUA.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/bento-grid/BentoGrid.ts"],"sourcesContent":["import { LitElement, css, html, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport 'iconify-icon';\n\nimport { controlBaseStyles, fontFamilyStyles } from '../shared/styles';\nimport {\n  cardTitleStyles,\n  iconTileStyles,\n  reducedMotionStyles,\n  sectionHeaderStyles,\n  sectionSubtitleStyles,\n  sectionTitleStyles, invertedSectionTextStyles } from '../shared/section-styles';\n\nexport interface BentoGridItem {\n  title: string;\n  description?: string;\n  /** Iconify icon name, e.g. `mdi:home`. */\n  icon?: string;\n  imageSrc?: string;\n  imageAlt?: string;\n  colSpan?: 1 | 2 | 3 | 4;\n  rowSpan?: 1 | 2;\n  /** Turns the card into a link. */\n  href?: string;\n}\n\n/**\n * A responsive 4-column bento grid of icon/image cards. Items are set via the `items` property.\n *\n * @cssprop --st-bento-grid-padding - Overrides the block's padding.\n */\n@customElement('st-bento-grid')\nexport class BentoGrid extends LitElement {\n  static styles = css`\n    ${controlBaseStyles}\n\n    :host {\n      display: block;\n      /* !important: a page-level reset (e.g. Tailwind Preflight) otherwise zeroes a shadow host's\n         padding; override with --st-bento-grid-padding instead. */\n      padding: var(--st-bento-grid-padding, var(--st-cms-section-padding) var(--st-space-24)) !important;\n      background: var(--st-color-page);\n      ${fontFamilyStyles}\n    }\n\n    :host([inverted]) {\n      background: var(--st-color-text-strong);\n    }\n\n    .container {\n      max-width: var(--st-cms-container-max);\n      margin: 0 auto;\n    }\n\n    .header {\n      ${sectionHeaderStyles}\n    }\n\n    .title {\n      ${sectionTitleStyles}\n    }\n\n    .subtitle {\n      ${sectionSubtitleStyles}\n      margin-bottom: 0;\n    }\n\n    ${invertedSectionTextStyles}\n\n    .grid {\n      display: grid;\n      grid-template-columns: repeat(4, 1fr);\n      grid-auto-rows: minmax(240px, auto);\n      gap: var(--st-space-24);\n    }\n\n    .card {\n      position: relative;\n      display: flex;\n      flex-direction: column;\n      overflow: hidden;\n      border: 1px solid var(--st-color-border);\n      border-radius: var(--st-space-24);\n      background: var(--st-color-surface);\n      color: inherit;\n      text-decoration: none;\n      transition:\n        transform 0.3s ease,\n        box-shadow 0.3s ease;\n    }\n\n    :host([inverted]) .card {\n      background: var(--st-color-text-strong);\n      border-color: var(--st-color-text);\n    }\n\n    .card:hover {\n      transform: translateY(-4px);\n      box-shadow: 0 12px 24px -10px var(--st-shadow-color-lg);\n      z-index: 1;\n    }\n\n    .image-wrapper {\n      position: absolute;\n      inset: 0;\n    }\n\n    .image-wrapper::after {\n      content: '';\n      position: absolute;\n      inset: 0;\n      background: linear-gradient(to bottom, transparent 0%, var(--st-shadow-color-xl) 100%);\n    }\n\n    .image {\n      width: 100%;\n      height: 100%;\n      object-fit: cover;\n      transition: transform 0.5s ease;\n    }\n\n    .card:hover .image {\n      transform: scale(1.05);\n    }\n\n    .content {\n      position: relative;\n      z-index: 1;\n      margin-top: auto;\n      padding: var(--st-space-24);\n      display: flex;\n      flex-direction: column;\n      gap: var(--st-space-16);\n    }\n\n    .icon {\n      ${iconTileStyles}\n      width: var(--st-size-40);\n      height: var(--st-size-40);\n      font-size: 24px;\n    }\n\n    .text {\n      padding: var(--st-space-16);\n      border-radius: var(--st-radius-md);\n    }\n\n    .card-title {\n      ${cardTitleStyles}\n      font-size: var(--st-text-lg);\n    }\n\n    .card-description {\n      margin: 0;\n      font-size: var(--st-text-md);\n      color: var(--st-color-text-muted);\n    }\n\n    :host([inverted]) .card-title {\n      color: var(--st-color-on-solid);\n    }\n\n    :host([inverted]) .card-description {\n      color: var(--st-color-border);\n    }\n\n    .card.has-image .card-title,\n    .card.has-image .card-description {\n      color: var(--st-color-on-solid);\n    }\n\n    .card.has-image .icon {\n      background: var(--st-shadow-color-lg);\n      color: var(--st-color-on-solid);\n      backdrop-filter: blur(4px);\n    }\n\n    .col-1 { grid-column: span 1; }\n    .col-2 { grid-column: span 2; }\n    .col-3 { grid-column: span 3; }\n    .col-4 { grid-column: span 4; }\n    .row-1 { grid-row: span 1; }\n    .row-2 { grid-row: span 2; }\n\n    @media (max-width: 1024px) {\n      .grid {\n        grid-template-columns: repeat(2, 1fr);\n      }\n      .col-3,\n      .col-4 {\n        grid-column: span 2;\n      }\n    }\n\n    @media (max-width: 640px) {\n      .grid {\n        grid-template-columns: 1fr;\n      }\n      .col-1,\n      .col-2,\n      .col-3,\n      .col-4 {\n        grid-column: span 1;\n      }\n    }\n\n    ${reducedMotionStyles}\n  `;\n\n  @property({ type: Boolean, reflect: true })\n  inverted = false;\n\n  @property({ type: String })\n  title = '';\n\n  @property({ type: String })\n  subtitle = '';\n\n  @property({ attribute: false })\n  items: BentoGridItem[] = [];\n\n  private renderCard(item: BentoGridItem) {\n    const classes = `card col-${item.colSpan ?? 1} row-${item.rowSpan ?? 1} ${item.imageSrc ? 'has-image' : ''}`;\n    const body = html`\n      ${item.imageSrc\n        ? html`<div class=\"image-wrapper\" part=\"image-wrapper\">\n            <img class=\"image\" part=\"image\" src=${item.imageSrc} alt=${item.imageAlt ?? item.title} />\n          </div>`\n        : nothing}\n      <div class=\"content\" part=\"content\">\n        ${item.icon ? html`<div class=\"icon\" part=\"icon\"><iconify-icon icon=${item.icon}></iconify-icon></div>` : nothing}\n        <div class=\"text\">\n          <h3 class=\"card-title\" part=\"card-title\">${item.title}</h3>\n          ${item.description ? html`<p class=\"card-description\" part=\"card-description\">${item.description}</p>` : nothing}\n        </div>\n      </div>\n    `;\n    return item.href\n      ? html`<a part=\"card\" class=${classes} href=${item.href}>${body}</a>`\n      : html`<div part=\"card\" class=${classes}>${body}</div>`;\n  }\n\n  render() {\n    return html`\n      <div class=\"container\" part=\"container\">\n        ${this.title || this.subtitle\n          ? html`<div class=\"header\" part=\"header\">\n              ${this.title ? html`<h2 class=\"title\" part=\"title\">${this.title}</h2>` : nothing}\n              ${this.subtitle ? html`<p class=\"subtitle\" part=\"subtitle\">${this.subtitle}</p>` : nothing}\n            </div>`\n          : nothing}\n        <div class=\"grid\" part=\"grid\">${this.items.map((item) => this.renderCard(item))}</div>\n      </div>\n    `;\n  }\n}\n"],"mappings":"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","names":[]}

package/dist/chunk-7NLZND6Q.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/section/Section.ts"],"sourcesContent":["import { LitElement, css, html, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { controlBaseStyles, rootFontFamilyStyles } from '../shared/styles';\nimport { sectionSubtitleStyles, sectionTitleStyles } from '../shared/section-styles';\n\n/**\n * A page band that holds other content: sets the background, the spacing above and below, and\n * the content width, with an optional eyebrow/title/subtitle heading over its slotted children.\n * Use it to give a run of components one dark or tinted backdrop and a consistent vertical rhythm,\n * the way enterprise marketing pages stack full-width sections.\n *\n * @slot - The section's content.\n * @cssprop --st-section-bg - Overrides the background colour picked by `background`.\n * @cssprop --st-section-padding-inline - Overrides the left/right padding (not with `width=\"full\"`).\n * @csspart inner - The width-limited content box.\n * @csspart header - The heading block.\n */\n@customElement('st-section')\nexport class Section extends LitElement {\n  static styles = css`\n    ${controlBaseStyles}\n\n    :host {\n      --st-section-space-none: 0;\n      --st-section-space-s: var(--st-space-24);\n      --st-section-space-m: var(--st-space-48);\n      --st-section-space-l: 4.5rem;\n      --st-section-space-xl: 6rem;\n      --st-section-space-xxl: 8rem;\n\n      display: block;\n      box-sizing: border-box;\n      width: 100%;\n      /* !important on every padding rule: a page-level reset (e.g. Tailwind Preflight) otherwise\n         zeroes a shadow host's padding. Rescale it with the --st-section-space-* tokens. */\n      padding: var(--st-section-space-m) var(--st-section-padding-inline, var(--st-space-24)) !important;\n      background: var(--st-section-bg, var(--st-color-surface));\n      color: var(--st-color-text-strong);\n      ${rootFontFamilyStyles}\n    }\n\n    :host([background='subtle']) {\n      background: var(--st-section-bg, var(--st-color-subtle));\n    }\n\n    :host([background='dark']) {\n      background: var(--st-section-bg, var(--st-cms-band-dark-bg));\n      color: var(--st-cms-band-dark-color);\n    }\n\n    :host([background='accent']) {\n      background: var(--st-section-bg, var(--st-color-accent));\n      color: var(--st-color-on-solid);\n    }\n\n    :host([background='transparent']) {\n      background: var(--st-section-bg, transparent);\n    }\n\n    :host([spacing-above='none']) { padding-top: var(--st-section-space-none) !important; }\n    :host([spacing-above='s']) { padding-top: var(--st-section-space-s) !important; }\n    :host([spacing-above='l']) { padding-top: var(--st-section-space-l) !important; }\n    :host([spacing-above='xl']) { padding-top: var(--st-section-space-xl) !important; }\n    :host([spacing-above='xxl']) { padding-top: var(--st-section-space-xxl) !important; }\n\n    :host([spacing-below='none']) { padding-bottom: var(--st-section-space-none) !important; }\n    :host([spacing-below='s']) { padding-bottom: var(--st-section-space-s) !important; }\n    :host([spacing-below='l']) { padding-bottom: var(--st-section-space-l) !important; }\n    :host([spacing-below='xl']) { padding-bottom: var(--st-section-space-xl) !important; }\n    :host([spacing-below='xxl']) { padding-bottom: var(--st-section-space-xxl) !important; }\n\n    :host([width='full']) {\n      padding-left: 0 !important;\n      padding-right: 0 !important;\n    }\n\n    .inner {\n      max-width: var(--st-cms-container-max);\n      margin: 0 auto;\n    }\n\n    :host([width='narrow']) .inner {\n      max-width: 800px;\n    }\n\n    :host([width='full']) .inner {\n      max-width: none;\n    }\n\n    .header {\n      margin-bottom: var(--st-space-48);\n    }\n\n    :host([text-alignment='center']) .header {\n      text-align: center;\n    }\n\n    :host([text-alignment='center']) .subtitle {\n      margin-inline: auto;\n    }\n\n    :host([width='full']) .header {\n      max-width: var(--st-cms-container-max);\n      margin-inline: auto;\n      padding-inline: var(--st-space-24);\n      box-sizing: border-box;\n    }\n\n    .eyebrow {\n      margin: 0 0 var(--st-space-12);\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: var(--st-color-text-muted);\n    }\n\n    .title {\n      ${sectionTitleStyles}\n      color: inherit;\n      letter-spacing: -0.02em;\n      max-width: 24ch;\n    }\n\n    :host([text-alignment='center']) .title {\n      margin-inline: auto;\n    }\n\n    .subtitle {\n      ${sectionSubtitleStyles}\n      max-width: 60ch;\n      margin-bottom: 0;\n    }\n\n    :host([background='dark']) .eyebrow,\n    :host([background='dark']) .subtitle {\n      color: color-mix(in oklch, var(--st-cms-band-dark-color) 80%, transparent);\n    }\n\n    :host([background='accent']) .eyebrow,\n    :host([background='accent']) .subtitle {\n      color: color-mix(in oklch, var(--st-color-on-solid) 80%, transparent);\n    }\n\n    @media (max-width: 768px) {\n      :host {\n        --st-section-space-l: 3.5rem;\n        --st-section-space-xl: 4.5rem;\n        --st-section-space-xxl: 5.5rem;\n        --st-section-padding-inline: var(--st-space-20);\n      }\n    }\n  `;\n\n  @property({ type: String })\n  eyebrow = '';\n\n  @property({ type: String })\n  title = '';\n\n  @property({ type: String })\n  subtitle = '';\n\n  /** `default` (page surface), `subtle`, `dark`, `accent` or `transparent`. */\n  @property({ type: String, reflect: true })\n  background: 'default' | 'subtle' | 'dark' | 'accent' | 'transparent' = 'default';\n\n  /** Space above the content: `none`, `s`, `m` (default), `l`, `xl` or `xxl`. */\n  @property({ type: String, reflect: true, attribute: 'spacing-above' })\n  spacingAbove: 'none' | 's' | 'm' | 'l' | 'xl' | 'xxl' = 'm';\n\n  /** Space below the content: `none`, `s`, `m` (default), `l`, `xl` or `xxl`. */\n  @property({ type: String, reflect: true, attribute: 'spacing-below' })\n  spacingBelow: 'none' | 's' | 'm' | 'l' | 'xl' | 'xxl' = 'm';\n\n  /** `contained` (default, the page container width), `narrow` (reading width) or `full` (edge to edge). */\n  @property({ type: String, reflect: true })\n  width: 'contained' | 'narrow' | 'full' = 'contained';\n\n  /** Alignment of the heading. */\n  @property({ type: String, reflect: true, attribute: 'text-alignment' })\n  textAlignment: 'left' | 'center' = 'left';\n\n  render() {\n    const heading = this.eyebrow || this.title || this.subtitle;\n    return html`\n      <div class=\"inner\" part=\"inner\">\n        ${heading\n          ? html`<div class=\"header\" part=\"header\">\n              ${this.eyebrow ? html`<p class=\"eyebrow\" part=\"eyebrow\">${this.eyebrow}</p>` : nothing}\n              ${this.title ? html`<h2 class=\"title\" part=\"title\">${this.title}</h2>` : nothing}\n              ${this.subtitle ? html`<p class=\"subtitle\" part=\"subtitle\">${this.subtitle}</p>` : nothing}\n            </div>`\n          : nothing}\n        <slot></slot>\n      </div>\n    `;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;AAAA,SAAS,YAAY,KAAK,MAAM,eAAe;AAC/C,SAAS,eAAe,gBAAgB;AAkBjC,IAAM,UAAN,cAAsB,WAAW;AAAA,EAAjC;AAAA;AAyIL,mBAAU;AAGV,iBAAQ;AAGR,oBAAW;AAIX,sBAAuE;AAIvE,wBAAwD;AAIxD,wBAAwD;AAIxD,iBAAyC;AAIzC,yBAAmC;AAAA;AAAA,EAEnC,SAAS;AACP,UAAM,UAAU,KAAK,WAAW,KAAK,SAAS,KAAK;AACnD,WAAO;AAAA;AAAA,UAED,UACE;AAAA,gBACI,KAAK,UAAU,yCAAyC,KAAK,OAAO,SAAS,OAAO;AAAA,gBACpF,KAAK,QAAQ,sCAAsC,KAAK,KAAK,UAAU,OAAO;AAAA,gBAC9E,KAAK,WAAW,2CAA2C,KAAK,QAAQ,SAAS,OAAO;AAAA,sBAE5F,OAAO;AAAA;AAAA;AAAA;AAAA,EAIjB;AACF;AApLa,QACJ,SAAS;AAAA,MACZ,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAkBf,oBAAoB;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,QAgFpB,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAWlB,qBAAqB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA0B3B;AAAA,EADC,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GAxIf,QAyIX;AAGA;AAAA,EADC,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GA3If,QA4IX;AAGA;AAAA,EADC,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GA9If,QA+IX;AAIA;AAAA,EADC,SAAS,EAAE,MAAM,QAAQ,SAAS,KAAK,CAAC;AAAA,GAlJ9B,QAmJX;AAIA;AAAA,EADC,SAAS,EAAE,MAAM,QAAQ,SAAS,MAAM,WAAW,gBAAgB,CAAC;AAAA,GAtJ1D,QAuJX;AAIA;AAAA,EADC,SAAS,EAAE,MAAM,QAAQ,SAAS,MAAM,WAAW,gBAAgB,CAAC;AAAA,GA1J1D,QA2JX;AAIA;AAAA,EADC,SAAS,EAAE,MAAM,QAAQ,SAAS,KAAK,CAAC;AAAA,GA9J9B,QA+JX;AAIA;AAAA,EADC,SAAS,EAAE,MAAM,QAAQ,SAAS,MAAM,WAAW,iBAAiB,CAAC;AAAA,GAlK3D,QAmKX;AAnKW,UAAN;AAAA,EADN,cAAc,YAAY;AAAA,GACd;","names":[]}

package/dist/chunk-ALI26WOB.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/items-accordion/ItemsAccordion.ts"],"sourcesContent":["import { LitElement, css, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\nimport 'iconify-icon';\n\nimport { buttonResetStyles, controlBaseStyles, fontFamilyStyles } from '../shared/styles';\nimport {\n  reducedMotionStyles,\n  sectionHeaderStyles,\n  sectionSubtitleStyles,\n  sectionTitleStyles,\n} from '../shared/section-styles';\nimport type { AccordionToggleEventDetail } from './ItemsAccordionEvents';\n\nexport interface AccordionItem {\n  id: string;\n  title: string;\n  content: string;\n}\n\n/**\n * A vertical list of collapsible title/content rows; one open at a time unless `allow-multiple`.\n *\n * @cssprop --st-items-accordion-padding - Overrides the block's padding.\n */\n@customElement('st-items-accordion')\nexport class ItemsAccordion extends LitElement {\n  static styles = css`\n    ${controlBaseStyles}\n\n    :host {\n      display: block;\n      /* !important: a page-level reset (e.g. Tailwind Preflight) otherwise zeroes a shadow host's\n         padding; override with --st-items-accordion-padding instead. */\n      padding: var(--st-items-accordion-padding, var(--st-cms-section-padding) var(--st-space-24)) !important;\n      background: var(--st-color-page);\n      ${fontFamilyStyles}\n    }\n\n    .container {\n      max-width: 800px;\n      margin: 0 auto;\n    }\n\n    .header {\n      ${sectionHeaderStyles}\n    }\n\n    .title {\n      ${sectionTitleStyles}\n      font-size: var(--st-text-2xl);\n      margin-bottom: var(--st-space-12);\n    }\n\n    .subtitle {\n      ${sectionSubtitleStyles}\n      font-size: var(--st-text-base);\n      margin: 0;\n    }\n\n    .list {\n      display: flex;\n      flex-direction: column;\n      gap: var(--st-space-16);\n    }\n\n    .item {\n      border: 1px solid var(--st-color-border);\n      border-radius: var(--st-radius-lg);\n      background: var(--st-color-surface);\n      overflow: hidden;\n      transition:\n        border-color 0.2s ease,\n        box-shadow 0.2s ease;\n    }\n\n    .item.open {\n      border-color: var(--st-color-border-strong);\n      box-shadow: 0 4px 6px -1px var(--st-shadow-color-sm);\n    }\n\n    .trigger {\n      ${buttonResetStyles}\n      width: 100%;\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      padding: var(--st-space-24);\n      text-align: left;\n      font-size: var(--st-text-lg);\n      font-weight: var(--st-font-weight-semibold);\n      color: var(--st-color-text-strong);\n    }\n\n    .trigger:hover {\n      background: var(--st-color-hover);\n    }\n\n    .chevron {\n      flex-shrink: 0;\n      margin-left: var(--st-space-16);\n      font-size: 24px;\n      color: var(--st-color-text-faint);\n      transition: transform 0.3s ease;\n    }\n\n    .open .chevron {\n      transform: rotate(180deg);\n    }\n\n    .content {\n      display: grid;\n      grid-template-rows: 0fr;\n      transition: grid-template-rows 0.3s ease;\n    }\n\n    .open .content {\n      grid-template-rows: 1fr;\n    }\n\n    .content-clip {\n      overflow: hidden;\n      min-height: 0;\n    }\n\n    .content-inner {\n      padding: 0 var(--st-space-24) var(--st-space-24);\n      color: var(--st-color-text);\n      line-height: 1.6;\n    }\n\n    @media (max-width: 768px) {\n      :host {\n        padding: var(--st-items-accordion-padding, var(--st-space-48) var(--st-space-20)) !important;\n      }\n\n      .title {\n        font-size: var(--st-text-xl);\n      }\n    }\n\n    ${reducedMotionStyles}\n  `;\n\n  @property({ type: String })\n  title = '';\n\n  @property({ type: String })\n  subtitle = '';\n\n  @property({ attribute: false })\n  items: AccordionItem[] = [];\n\n  @property({ type: Boolean, attribute: 'allow-multiple' })\n  allowMultiple = false;\n\n  @state() private openIds = new Set<string>();\n\n  private toggle(id: string) {\n    const wasOpen = this.openIds.has(id);\n    const next = new Set(this.allowMultiple ? this.openIds : []);\n    if (wasOpen) next.delete(id);\n    else next.add(id);\n    this.openIds = next;\n    this.dispatchEvent(\n      new CustomEvent<AccordionToggleEventDetail>('accordion-toggle', {\n        detail: { id, open: !wasOpen },\n        bubbles: true,\n        composed: true,\n      }),\n    );\n  }\n\n  render() {\n    return html`\n      <div class=\"container\" part=\"container\">\n        ${this.title || this.subtitle\n          ? html`<div class=\"header\" part=\"header\">\n              ${this.title ? html`<h2 class=\"title\" part=\"title\">${this.title}</h2>` : nothing}\n              ${this.subtitle ? html`<p class=\"subtitle\" part=\"subtitle\">${this.subtitle}</p>` : nothing}\n            </div>`\n          : nothing}\n        <div class=\"list\" part=\"list\">\n          ${this.items.map((item) => {\n            const open = this.openIds.has(item.id);\n            return html`\n              <div class=\"item ${open ? 'open' : ''}\" part=\"item\">\n                <button\n                  class=\"trigger\"\n                  part=\"trigger\"\n                  type=\"button\"\n                  aria-expanded=${open ? 'true' : 'false'}\n                  aria-controls=\"content-${item.id}\"\n                  @click=${() => this.toggle(item.id)}\n                >\n                  <span>${item.title}</span>\n                  <iconify-icon class=\"chevron\" icon=\"mdi:chevron-down\"></iconify-icon>\n                </button>\n                <div class=\"content\" id=\"content-${item.id}\" part=\"content\" role=\"region\" ?inert=${!open}>\n                  <div class=\"content-clip\">\n                    <div class=\"content-inner\">${item.content}</div>\n                  </div>\n                </div>\n              </div>\n            `;\n          })}\n        </div>\n      </div>\n    `;\n  }\n}\n"],"mappings":"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","names":[]}

package/dist/chunk-BMHMNXIA.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/content-block/ContentBlock.ts"],"sourcesContent":["import { LitElement, css, html, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { controlBaseStyles, fontFamilyStyles } from '../shared/styles';\nimport { sectionSubtitleStyles, sectionTitleStyles, sectionHeaderStyles } from '../shared/section-styles';\nimport '../markdown';\n\n/**\n * A long-form article section: centered title/subtitle, an optional featured image with caption,\n * then Markdown body text. Ports `SankhyaUI`'s React `ContentBlock`. The body comes from\n * `content-src` (a Markdown URL, as in the source) or an inline `content` string (added so the\n * block works without a fetch); `content-src` wins when both are set.\n *\n * @cssprop --st-content-block-padding - Overrides the block's padding.\n */\n@customElement('st-content-block')\nexport class ContentBlock extends LitElement {\n  static styles = css`\n    ${controlBaseStyles}\n\n    :host {\n      display: block;\n      ${fontFamilyStyles}\n      /* !important: a page-level reset (e.g. Tailwind Preflight) otherwise zeroes a shadow host's\n         padding; override with --st-content-block-padding instead. */\n      padding: var(--st-content-block-padding, var(--st-space-24)) !important;\n      background: var(--st-color-surface);\n      color: var(--st-color-text-strong);\n    }\n\n    :host([inverted]) {\n      background: var(--st-color-text-strong);\n      color: var(--st-color-on-solid);\n    }\n\n    .container {\n      max-width: var(--st-cms-container-max);\n      padding: 0 var(--st-space-48);\n      margin: 0 auto;\n    }\n\n    .header {\n      ${sectionHeaderStyles}\n    }\n\n    .title {\n      ${sectionTitleStyles}\n      line-height: 1.1;\n    }\n\n    .subtitle {\n      ${sectionSubtitleStyles}\n    }\n\n    :host([inverted]) .title,\n    :host([inverted]) .subtitle {\n      color: inherit;\n    }\n\n    .featured-image {\n      margin: 0 0 var(--st-space-48);\n      border-radius: var(--st-radius-lg);\n      overflow: hidden;\n    }\n\n    .featured-image img {\n      width: 100%;\n      height: auto;\n      display: block;\n    }\n\n    figcaption {\n      padding: var(--st-space-12);\n      text-align: center;\n      color: var(--st-color-text-muted);\n      font-size: var(--st-text-xs);\n    }\n\n    st-markdown {\n      color: var(--st-color-text);\n      font-size: var(--st-text-xl);\n    }\n\n    :host([inverted]) st-markdown {\n      color: inherit;\n    }\n\n    @media (max-width: 768px) {\n      :host {\n        padding: var(--st-content-block-padding, var(--st-space-48) var(--st-space-24)) !important;\n      }\n\n      .container {\n        padding: 0;\n      }\n    }\n  `;\n\n  @property({ type: String })\n  title = '';\n\n  @property({ type: String })\n  subtitle = '';\n\n  /** URL of a Markdown file. */\n  @property({ type: String, attribute: 'content-src' })\n  contentSrc = '';\n\n  /** Inline Markdown, used when `content-src` is not set. */\n  @property({ type: String })\n  content = '';\n\n  @property({ type: String, attribute: 'image-src' })\n  imageSrc = '';\n\n  @property({ type: String, attribute: 'image-alt' })\n  imageAlt = '';\n\n  @property({ type: String, attribute: 'image-caption' })\n  imageCaption = '';\n\n  @property({ type: Boolean, reflect: true })\n  inverted = false;\n\n  render() {\n    return html`\n      <section class=\"container\" part=\"container\">\n        <div class=\"header\" part=\"header\">\n          ${this.title ? html`<div class=\"title\" part=\"title\">${this.title}</div>` : nothing}\n          ${this.subtitle ? html`<div class=\"subtitle\" part=\"subtitle\">${this.subtitle}</div>` : nothing}\n        </div>\n        ${this.imageSrc\n          ? html`\n              <figure class=\"featured-image\" part=\"image\">\n                <img src=${this.imageSrc} alt=${this.imageAlt || this.title} />\n                ${this.imageCaption ? html`<figcaption>${this.imageCaption}</figcaption>` : nothing}\n              </figure>\n            `\n          : nothing}\n        <st-markdown part=\"body\" .src=${this.contentSrc} .content=${this.content}></st-markdown>\n      </section>\n    `;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;AAAA,SAAS,YAAY,KAAK,MAAM,eAAe;AAC/C,SAAS,eAAe,gBAAgB;AAejC,IAAM,eAAN,cAA2B,WAAW;AAAA,EAAtC;AAAA;AAmFL,iBAAQ;AAGR,oBAAW;AAIX,sBAAa;AAIb,mBAAU;AAGV,oBAAW;AAGX,oBAAW;AAGX,wBAAe;AAGf,oBAAW;AAAA;AAAA,EAEX,SAAS;AACP,WAAO;AAAA;AAAA;AAAA,YAGC,KAAK,QAAQ,uCAAuC,KAAK,KAAK,WAAW,OAAO;AAAA,YAChF,KAAK,WAAW,6CAA6C,KAAK,QAAQ,WAAW,OAAO;AAAA;AAAA,UAE9F,KAAK,WACH;AAAA;AAAA,2BAEe,KAAK,QAAQ,QAAQ,KAAK,YAAY,KAAK,KAAK;AAAA,kBACzD,KAAK,eAAe,mBAAmB,KAAK,YAAY,kBAAkB,OAAO;AAAA;AAAA,gBAGvF,OAAO;AAAA,wCACqB,KAAK,UAAU,aAAa,KAAK,OAAO;AAAA;AAAA;AAAA,EAG9E;AACF;AA/Ha,aACJ,SAAS;AAAA,MACZ,iBAAiB;AAAA;AAAA;AAAA;AAAA,QAIf,gBAAgB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAoBhB,mBAAmB;AAAA;AAAA;AAAA;AAAA,QAInB,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA,QAKlB,qBAAqB;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;AAgD3B;AAAA,EADC,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GAlFf,aAmFX;AAGA;AAAA,EADC,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GArFf,aAsFX;AAIA;AAAA,EADC,SAAS,EAAE,MAAM,QAAQ,WAAW,cAAc,CAAC;AAAA,GAzFzC,aA0FX;AAIA;AAAA,EADC,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GA7Ff,aA8FX;AAGA;AAAA,EADC,SAAS,EAAE,MAAM,QAAQ,WAAW,YAAY,CAAC;AAAA,GAhGvC,aAiGX;AAGA;AAAA,EADC,SAAS,EAAE,MAAM,QAAQ,WAAW,YAAY,CAAC;AAAA,GAnGvC,aAoGX;AAGA;AAAA,EADC,SAAS,EAAE,MAAM,QAAQ,WAAW,gBAAgB,CAAC;AAAA,GAtG3C,aAuGX;AAGA;AAAA,EADC,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAzG/B,aA0GX;AA1GW,eAAN;AAAA,EADN,cAAc,kBAAkB;AAAA,GACpB;","names":[]}

package/dist/chunk-FLY7TNRT.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/features-section/FeaturesSection.ts","../src/features-section/FeatureItem.ts"],"sourcesContent":["import { LitElement, css, html, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { controlBaseStyles, fontFamilyStyles } from '../shared/styles';\nimport { sectionSubtitleStyles, sectionTitleStyles, sectionHeaderStyles } from '../shared/section-styles';\nimport './FeatureItem';\n\n/** Data for one tile when using the `items` property (mirrors `st-feature-item`'s properties). */\nexport interface FeatureItemData {\n  icon?: string;\n  title: string;\n  description: string;\n  href?: string;\n}\n\n/**\n * A titled grid of feature tiles. Ports `SankhyaUI`'s React `FeaturesSection`: tiles come from the\n * `items` property, from slotted `st-feature-item` elements (the source's `children`), or both\n * (slotted first). `columns` sets the grid width (default 2; one column below 768px). `inverted`\n * is passed on to the `items` tiles; slotted tiles need their own `inverted` attribute.\n *\n * @cssprop --st-features-section-padding - Overrides the section's padding.\n */\n@customElement('st-features-section')\nexport class FeaturesSection extends LitElement {\n  static styles = css`\n    ${controlBaseStyles}\n\n    :host {\n      display: block;\n      ${fontFamilyStyles}\n      /* !important: a page-level reset (e.g. Tailwind Preflight) otherwise zeroes a shadow host's\n         padding; override with --st-features-section-padding instead. */\n      padding: var(--st-features-section-padding, var(--st-cms-section-padding) var(--st-space-24)) !important;\n      background: var(--st-color-surface);\n    }\n\n    :host([inverted]) {\n      background: var(--st-color-text-strong);\n    }\n\n    .container {\n      max-width: var(--st-cms-container-max);\n      margin: 0 auto;\n    }\n\n    .header {\n      ${sectionHeaderStyles}\n    }\n\n    .title {\n      ${sectionTitleStyles}\n      margin: 0;\n    }\n\n    .subtitle {\n      ${sectionSubtitleStyles}\n      margin: 0 auto;\n    }\n\n    :host([inverted]) .title,\n    :host([inverted]) .subtitle {\n      color: var(--st-color-on-solid);\n    }\n\n    .grid {\n      display: grid;\n      grid-template-columns: repeat(var(--features-columns, 2), 1fr);\n      gap: var(--st-space-32);\n    }\n\n    @media (max-width: 768px) {\n      :host {\n        padding: var(--st-features-section-padding, var(--st-space-48) var(--st-space-16)) !important;\n      }\n\n      .grid {\n        grid-template-columns: 1fr;\n      }\n    }\n  `;\n\n  @property({ type: String })\n  title = '';\n\n  @property({ type: String })\n  subtitle = '';\n\n  /** Applied to every tile built from `items`. */\n  @property({ type: String, attribute: 'action-label' })\n  actionLabel = 'Learn more';\n\n  @property({ type: Number })\n  columns = 0;\n\n  @property({ type: Boolean, reflect: true })\n  inverted = false;\n\n  /** Tiles to render (property only). */\n  @property({ attribute: false })\n  items: FeatureItemData[] = [];\n\n  render() {\n    const gridStyle = this.columns ? `--features-columns: ${this.columns}` : nothing;\n    return html`\n      <section class=\"container\" part=\"container\">\n        <div class=\"header\" part=\"header\">\n          <div class=\"title\" part=\"title\">${this.title}</div>\n          ${this.subtitle ? html`<div class=\"subtitle\" part=\"subtitle\">${this.subtitle}</div>` : nothing}\n        </div>\n        <div class=\"grid\" part=\"grid\" style=${gridStyle}>\n          <slot></slot>\n          ${this.items.map(\n            (item) => html`\n              <st-feature-item\n                .icon=${item.icon ?? ''}\n                .title=${item.title}\n                .description=${item.description}\n                .href=${item.href ?? ''}\n                .actionLabel=${this.actionLabel}\n                ?inverted=${this.inverted}\n              ></st-feature-item>\n            `\n          )}\n        </div>\n      </section>\n    `;\n  }\n}\n","import { LitElement, css, html, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\nimport 'iconify-icon';\n\nimport { controlBaseStyles, fontFamilyStyles } from '../shared/styles';\nimport { cardDescriptionStyles, cardTitleStyles } from '../shared/section-styles';\nimport '../card';\nimport '../markdown';\n\n/**\n * One feature tile for `st-features-section`: optional icon, title, Markdown description and an\n * optional \"Learn more\" link, rendered on an `st-card`. `icon` is an Iconify name (e.g.\n * `mdi:rocket`). The link is a plain `<a>` (the source used react-router's `Link` for non-http\n * hrefs; there is no Lit equivalent). The click is composed, so an SPA router can intercept it\n * (e.g. via `event.composedPath()`) and navigate client-side; `http(s)` links open in a new tab.\n */\n@customElement('st-feature-item')\nexport class FeatureItem extends LitElement {\n  static styles = css`\n    ${controlBaseStyles}\n\n    :host {\n      display: block;\n      ${fontFamilyStyles}\n    }\n\n    st-card {\n      height: 100%;\n    }\n\n    .content {\n      display: flex;\n      flex-direction: column;\n      align-items: flex-start;\n      gap: var(--st-space-16);\n      height: 100%;\n    }\n\n    .icon {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      width: 48px;\n      height: 48px;\n      border-radius: var(--st-radius-lg);\n      background: var(--st-color-subtle);\n      color: var(--st-color-text-strong);\n      margin-bottom: var(--st-space-8);\n      font-size: 24px;\n    }\n\n    :host([inverted]) .icon {\n      background: var(--st-color-text-muted);\n      color: var(--st-color-on-solid);\n    }\n\n    .title {\n      ${cardTitleStyles}\n      margin: 0;\n    }\n\n    .description {\n      ${cardDescriptionStyles}\n      margin: 0;\n    }\n\n    :host([inverted]) .title,\n    :host([inverted]) .description {\n      color: inherit;\n    }\n\n    .link {\n      display: flex;\n      align-items: center;\n      gap: var(--st-space-4);\n      margin-top: auto;\n      color: var(--st-color-text-muted);\n      font-weight: var(--st-font-weight-medium);\n      font-size: var(--st-text-md);\n      text-decoration: none;\n      transition: color 0.2s ease;\n    }\n\n    .link:hover {\n      color: var(--st-color-text-strong);\n      text-decoration: underline;\n    }\n\n    :host([inverted]) .link,\n    :host([inverted]) .link:hover {\n      color: inherit;\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      .link {\n        transition: none;\n      }\n    }\n  `;\n\n  /** Iconify icon name, e.g. `mdi:rocket`. */\n  @property({ type: String })\n  icon = '';\n\n  @property({ type: String })\n  title = '';\n\n  /** Markdown. */\n  @property({ type: String })\n  description = '';\n\n  @property({ type: String })\n  href = '';\n\n  @property({ type: String, attribute: 'action-label' })\n  actionLabel = 'Learn more';\n\n  @property({ type: Boolean, reflect: true })\n  inverted = false;\n\n  render() {\n    const external = this.href.startsWith('http');\n    return html`\n      <st-card hoverable elevation=\"sm\" ?inverted=${this.inverted} part=\"card\">\n        <div class=\"content\" part=\"content\">\n          ${this.icon\n            ? html`<div class=\"icon\" part=\"icon\"><iconify-icon icon=${this.icon}></iconify-icon></div>`\n            : nothing}\n          <h3 class=\"title\" part=\"title\">${this.title}</h3>\n          <st-markdown class=\"description\" part=\"description\" .content=${this.description}></st-markdown>\n          ${this.href\n            ? html`\n                <a\n                  class=\"link\"\n                  part=\"link\"\n                  href=${this.href}\n                  target=${external ? '_blank' : '_self'}\n                  rel=${external ? 'noopener noreferrer' : nothing}\n                >\n                  ${this.actionLabel} <span>&rarr;</span>\n                </a>\n              `\n            : nothing}\n        </div>\n      </st-card>\n    `;\n  }\n}\n"],"mappings":"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","names":["LitElement","css","html","nothing","customElement","property","LitElement","nothing","html","css","property","customElement"]}

package/dist/chunk-JKBWZLG4.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/hero/Hero.ts"],"sourcesContent":["import { LitElement, css, html, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { controlBaseStyles, rootFontFamilyStyles } from '../shared/styles';\nimport { ctaLinkStyles, paddingScaleStyles } from '../shared/section-styles';\nimport type { HeroActionEventDetail } from './HeroEvents';\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. Port of `SankhyaUI`'s React `Hero`; the\n * framer-motion entrance is redone as CSS keyframes (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 * @fires action - Cancelable, before navigating. 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 * @csspart eyebrow - The small label above the title.\n * @csspart secondary-action - The outlined second button.\n */\n@customElement('st-hero')\nexport class Hero extends LitElement {\n  static styles = css`\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      ${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      ${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    @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    @media (prefers-reduced-motion: reduce) {\n      :host, .eyebrow, .title, .subtitle, .cta { 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  @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  @property({ type: String, attribute: 'secondary-href' })\n  secondaryHref = '';\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  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  protected willUpdate(): void {\n    this.style.backgroundImage = 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 onClick = (event: MouseEvent): void => this.emitAction(event, this.href, 'primary');\n\n  private onSecondaryClick = (event: MouseEvent): void => this.emitAction(event, this.secondaryHref, 'secondary');\n\n  render() {\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        <h1 class=\"title\" part=\"title\">${this.title}</h1>\n        ${this.subtitle ? html`<p class=\"subtitle\" part=\"subtitle\">${this.subtitle}</p>` : nothing}\n        ${this.actionLabel || this.secondaryActionLabel\n          ? html`<div class=\"actions\" part=\"actions\">\n              ${this.actionLabel\n                ? html`<a class=\"cta\" part=\"action\" href=${this.href || nothing} @click=${this.onClick}>${this.actionLabel}</a>`\n                : nothing}\n              ${this.secondaryActionLabel\n                ? html`<a class=\"cta secondary\" part=\"secondary-action\" href=${this.secondaryHref || nothing} @click=${this.onSecondaryClick}\n                    >${this.secondaryActionLabel}</a\n                  >`\n                : nothing}\n            </div>`\n          : nothing}\n        <slot></slot>\n      </div>\n    `;\n  }\n}\n"],"mappings":"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","names":[]}

package/dist/chunk-JQY2G4QK.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/menu-grid-item/MenuGridItem.ts"],"sourcesContent":["import { LitElement, css, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\n\nimport { controlBaseStyles, fontFamilyStyles } from '../shared/styles';\nimport type { MenuGridItemSelectEventDetail } from './MenuGridItemEvents';\n\n/**\n * One entry in an `st-menu-grid` — icon (via `slot=\"icon\"`) + title on one line, an optional\n * description below, and an optional corner badge (\"New\", \"Popular\", ...). A 1:1 port of\n * `SankhyaUI`'s React `MenuGridItem` (`SankhyaCMS/SankhyaUI/src/components/Menu`): same markup and\n * CSS, with its `motion` effects redone in CSS — fades up the first time it scrolls into view,\n * scales to 1.02 on hover / 0.98 while pressed, the icon tilts on hover, the badge pops in.\n * Colors come from the suite theme rather than per-item utility classes.\n *\n * An `http(s)` `href` opens in a new tab, like the source. Any other `href` fires a *cancelable*\n * `menu-grid-item-select` event (detail: `{ href }`) first: a host doing client-side routing calls\n * `event.preventDefault()` on it, which also cancels the anchor's own navigation (the source used\n * react-router's `Link` here; the suite apps have no router).\n */\n@customElement('st-menu-grid-item')\nexport class MenuGridItem extends LitElement {\n  /** `focus()` on the element focuses its link, so `st-dropdown` can arrow-key between items. */\n  static shadowRootOptions = { ...LitElement.shadowRootOptions, delegatesFocus: true };\n\n  static styles = css`\n    ${controlBaseStyles}\n\n    :host {\n      display: block;\n      ${fontFamilyStyles}\n    }\n\n    @keyframes st-menu-grid-badge-pop {\n      from {\n        transform: scale(0);\n      }\n      70% {\n        transform: scale(1.12);\n      }\n      to {\n        transform: scale(1);\n      }\n    }\n\n    .menu-grid-item {\n      display: flex;\n      flex-direction: column;\n      border-radius: 8px;\n      position: relative;\n      overflow: hidden;\n      color: var(--st-color-text);\n      transition:\n        opacity 0.4s ease-out,\n        transform 0.2s ease,\n        background-color 0.2s ease;\n    }\n\n    .menu-grid-item.pending {\n      opacity: 0;\n      transform: translateY(20px);\n    }\n\n    .menu-grid-item.regular {\n      padding: 16px;\n    }\n\n    .menu-grid-item.compact {\n      padding: 12px;\n    }\n\n    /* Keyboard focus gets the same treatment as hover. */\n    .menu-grid-item:hover,\n    .menu-grid-item:has(.menu-grid-link:focus-visible) {\n      background: var(--st-color-hover);\n      transform: scale(1.02);\n    }\n\n    .menu-grid-item:active {\n      transform: scale(0.98);\n    }\n\n    .menu-grid-link {\n      display: flex;\n      flex-direction: column;\n      text-decoration: none;\n      color: inherit;\n      width: 100%;\n      height: 100%;\n      gap: 8px;\n    }\n\n    .menu-grid-badge {\n      position: absolute;\n      top: 2px;\n      right: 8px;\n      font-size: 0.5rem;\n      padding: 2px 8px;\n      border-radius: 9999px;\n      font-weight: 500;\n      z-index: 1;\n      background-color: var(--st-color-text-strong);\n      color: var(--st-color-on-solid);\n      animation: st-menu-grid-badge-pop 0.35s ease-out;\n    }\n\n    .menu-grid-header {\n      display: flex;\n      align-items: center;\n      gap: 12px;\n      width: 100%;\n    }\n\n    .menu-grid-icon {\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      width: 32px;\n      height: 32px;\n      border-radius: 6px;\n      transition:\n        background-color 0.2s ease,\n        transform 0.2s ease;\n      flex-shrink: 0;\n      padding: 0;\n      margin-bottom: 0;\n    }\n\n    .menu-grid-icon:hover {\n      transform: rotate(5deg) scale(1.1);\n    }\n\n    .menu-grid-icon[hidden] {\n      display: none;\n    }\n\n    .menu-grid-icon ::slotted(*) {\n      width: 18px;\n      height: 18px;\n    }\n\n    .menu-grid-title {\n      font-size: 0.875rem;\n      font-weight: 500;\n      color: var(--st-color-text-strong);\n      transition: color 0.2s ease;\n      flex: 1;\n      min-width: 0;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n      margin-bottom: 0;\n    }\n\n    .menu-grid-description {\n      font-size: 0.75rem;\n      color: var(--st-color-text-muted);\n      display: -webkit-box;\n      -webkit-box-orient: vertical;\n      overflow: hidden;\n      line-height: 1.4;\n      transition: color 0.2s ease;\n    }\n\n    .menu-grid-item.compact .menu-grid-header {\n      gap: 8px;\n    }\n\n    .menu-grid-item.compact .menu-grid-icon {\n      width: 24px;\n      height: 24px;\n    }\n\n    .menu-grid-item.compact .menu-grid-icon ::slotted(*) {\n      width: 14px;\n      height: 14px;\n    }\n\n    .menu-grid-item.compact .menu-grid-title {\n      font-size: 0.75rem;\n    }\n\n    .menu-grid-item.compact .menu-grid-description {\n      font-size: 0.75rem;\n    }\n\n    .menu-grid-header.icon-only {\n      justify-content: center;\n    }\n\n    @media (max-width: 480px) {\n      .menu-grid-header {\n        gap: 8px;\n      }\n\n      .menu-grid-icon {\n        width: 28px;\n        height: 28px;\n      }\n\n      .menu-grid-icon ::slotted(*) {\n        width: 16px;\n        height: 16px;\n      }\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      .menu-grid-item,\n      .menu-grid-icon {\n        transition: none;\n      }\n\n      .menu-grid-item.pending {\n        opacity: 1;\n        transform: none;\n      }\n\n      .menu-grid-badge {\n        animation: none;\n      }\n    }\n  `;\n\n  @property({ type: String })\n  title = '';\n\n  @property({ type: String })\n  description = '';\n\n  @property({ type: String })\n  href = '';\n\n  /** Small corner label, e.g. \"New\"/\"Beta\" — omit for none. */\n  @property({ type: String })\n  badge = '';\n\n  @property({ type: Boolean, reflect: true })\n  compact = false;\n\n  /** Suppresses the description even when `description` is set (source: `showDescription`, default `true`). */\n  @property({ type: Boolean, attribute: 'show-description' })\n  showDescription = true;\n\n  /** Whether `slot=\"icon\"` has content, so an omitted icon leaves no empty box. */\n  @state() private hasIcon = false;\n\n  /** True until the item first scrolls into view (the source's `whileInView ... once`). */\n  @state() private pending = true;\n\n  private observer?: IntersectionObserver;\n\n  connectedCallback(): void {\n    super.connectedCallback();\n    if (typeof IntersectionObserver === 'undefined') {\n      this.pending = false;\n      return;\n    }\n    this.observer = new IntersectionObserver((entries) => {\n      if (entries.some((entry) => entry.isIntersecting)) {\n        this.pending = false;\n        this.observer?.disconnect();\n      }\n    });\n    this.observer.observe(this);\n  }\n\n  disconnectedCallback(): void {\n    this.observer?.disconnect();\n    super.disconnectedCallback();\n  }\n\n  private onIconSlotChange = (event: Event): void => {\n    this.hasIcon = (event.target as HTMLSlotElement).assignedNodes({ flatten: true }).length > 0;\n  };\n\n  private get isExternal(): boolean {\n    return this.href.startsWith('http');\n  }\n\n  private onClick = (event: MouseEvent): void => {\n    if (this.isExternal) return;\n    const selectEvent = new CustomEvent<MenuGridItemSelectEventDetail>('menu-grid-item-select', {\n      detail: { href: this.href },\n      bubbles: true,\n      composed: true,\n      cancelable: true\n    });\n    this.dispatchEvent(selectEvent);\n    if (selectEvent.defaultPrevented) event.preventDefault();\n  };\n\n  render() {\n    const iconOnly = this.hasIcon && !this.title;\n    return html`\n      <div class=\"menu-grid-item ${this.compact ? 'compact' : 'regular'} ${this.pending ? 'pending' : ''}\" part=\"item\">\n        <a\n          part=\"link\"\n          class=\"menu-grid-link\"\n          href=${this.href}\n          target=${this.isExternal ? '_blank' : '_self'}\n          rel=${this.isExternal ? 'noopener noreferrer' : nothing}\n          @click=${this.onClick}\n        >\n          ${this.badge ? html`<span part=\"badge\" class=\"menu-grid-badge\">${this.badge}</span>` : nothing}\n          <span class=\"menu-grid-header ${iconOnly ? 'icon-only' : ''}\" part=\"header\">\n            <span class=\"menu-grid-icon\" part=\"icon\" ?hidden=${!this.hasIcon}><slot name=\"icon\" @slotchange=${this.onIconSlotChange}></slot></span>\n            ${this.title ? html`<span part=\"title\" class=\"menu-grid-title\">${this.title}</span>` : nothing}\n          </span>\n          ${this.description && this.showDescription\n            ? html`<span part=\"description\" class=\"menu-grid-description\">${this.description}</span>`\n            : nothing}\n        </a>\n      </div>\n    `;\n  }\n}\n"],"mappings":"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","names":[]}

package/dist/chunk-LEXZKGQX.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/dropdown/Dropdown.ts"],"sourcesContent":["import { LitElement, css, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\n\nimport { chevronIcon } from '../shared/icons';\nimport { buttonResetStyles, controlBaseStyles, fontFamilyStyles } from '../shared/styles';\nimport type { DropdownToggleEventDetail } from './DropdownEvents';\n\n/**\n * A labeled trigger + slotted dropdown panel — nav menus (typically holding an `st-menu-grid`),\n * action menus, anything \"click a trigger, show content under it\". A 1:1 port of `SankhyaUI`'s\n * React `Dropdown` (`SankhyaCMS/SankhyaUI/src/components/Dropdown`): same markup\n * (`.menu` > `.menu-title` + `.menu-dropdown`), sizes, 0.3s slide/fade, and behavior —\n *\n * - only one dropdown is open at a time (the source's `DropdownProvider`, built in here, so no\n *   provider element is needed);\n * - a mousedown outside, Escape, or a click inside the panel closes it;\n * - an `href` trigger toggles the panel when it has content, and is a plain link when it doesn't;\n * - `inline` opens the panel in the flow, the source's `.touch-device` layout.\n *\n * Colors and the panel's surface come from the suite theme (the source left those to the\n * consumer's `className`/`itemGroupClassName` utility classes). Two source rules are left out\n * because they break existing suite uses (`st-source-bar`'s site/library menus): the 100vw panel\n * at <=768px (overflows the screen from wherever the trigger sits; the header uses `inline`\n * instead) and `overflow: hidden` on slotted children (clips their focus rings). Suite additions\n * kept on top: `align`, `active`, `disabled`, `inline`, and the `dropdown-toggle` event — plus\n * `mega` and `open-on-hover` for an okta.com-style mega menu (see `st-mega-menu`).\n *\n * @cssprop --st-mega-menu-max-width - Maximum width of a `mega` panel (default `1400px`).\n * @cssprop --st-mega-menu-inset - Minimum space between a `mega` panel and the header's sides (default `1rem`).\n * @cssprop --st-mega-menu-gap - Space between the header and a `mega` panel (default `12px`).\n * @cssprop --st-mega-menu-radius - Corner radius of a `mega` panel (default `24px`).\n */\n@customElement('st-dropdown')\nexport class Dropdown extends LitElement {\n  /** The open dropdown, if any — the source's `DropdownContext.activeDropdown`. */\n  private static openDropdown: Dropdown | null = null;\n\n  static styles = css`\n    ${controlBaseStyles}\n\n    :host {\n      display: inline-block;\n      position: relative;\n      ${fontFamilyStyles}\n    }\n\n    .menu-title {\n      ${buttonResetStyles}\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      box-sizing: border-box;\n      min-height: 40px;\n      padding: 12px;\n      gap: 8px;\n      text-align: center;\n      width: fit-content;\n      border-radius: var(--st-radius-sm);\n      /* --st-nav-*: set by a host bar (st-header's transparent state) to recolour its nav items. */\n      color: var(--st-nav-color, var(--st-color-text));\n      font-size: 0.875rem;\n      text-decoration: none;\n      white-space: nowrap;\n      transition: background-color 0.3s ease;\n    }\n\n    .menu-title:hover,\n    .menu-title[aria-expanded='true'] {\n      background: var(--st-nav-hover-bg, var(--st-color-hover));\n      color: var(--st-nav-color, var(--st-color-text-strong));\n    }\n\n    :host([active]) .menu-title {\n      background: var(--st-color-accent-subtle);\n      color: var(--st-color-accent-text);\n    }\n\n    :host([disabled]) .menu-title {\n      color: var(--st-color-text-muted);\n      cursor: not-allowed;\n      pointer-events: none;\n    }\n\n    .icon {\n      display: inline-flex;\n      flex: none;\n      align-items: center;\n      justify-content: center;\n    }\n\n    .icon[hidden] {\n      display: none;\n    }\n\n    .arrow {\n      display: inline-block;\n      margin-left: 8px;\n      font-size: 0.75rem;\n      transition: transform 0.3s ease;\n    }\n\n    .menu-title[aria-expanded='true'] .arrow {\n      transform: rotate(180deg);\n    }\n\n    .menu-dropdown {\n      position: absolute;\n      top: 100%;\n      left: 0;\n      z-index: 100;\n      padding: 16px;\n      background: var(--st-color-surface);\n      color: var(--st-color-text);\n      /* The panel has its own surface: items in it never take the bar's nav colours. */\n      --st-nav-color: initial;\n      --st-nav-hover-bg: initial;\n      border: 1px solid var(--st-color-border);\n      border-radius: var(--st-radius-sm);\n      box-shadow: 0 4px 16px var(--st-shadow-color-sm);\n      opacity: 0;\n      visibility: hidden;\n      transform: translateY(-10px);\n      /* visibility flips at once on open (so keyboard focus can move into the panel on the same\n         frame) and only after the 0.3s fade on close. */\n      transition:\n        opacity 0.3s ease,\n        transform 0.3s ease,\n        visibility 0s linear 0.3s;\n      pointer-events: none;\n    }\n\n    .menu-dropdown.align-right {\n      left: auto;\n      right: 0;\n    }\n\n    .menu-dropdown.show {\n      opacity: 1;\n      visibility: visible;\n      transform: translateY(0);\n      pointer-events: auto;\n      transition-delay: 0s;\n    }\n\n    /* Inline: the panel opens in the flow under its trigger and pushes what follows down, instead\n       of floating — the source's .touch-device layout. st-header turns this on for its menu while\n       the hamburger panel is showing. */\n    :host([inline]) {\n      display: block;\n    }\n\n    :host([inline]) .menu-title {\n      width: 100%;\n      justify-content: flex-start;\n    }\n\n    :host([inline]) .arrow {\n      margin-left: auto;\n    }\n\n    :host([inline]) .menu-dropdown {\n      display: none;\n      position: relative;\n      top: auto;\n      left: auto;\n      right: auto;\n      width: 100%;\n      box-sizing: border-box;\n      box-shadow: none;\n      opacity: 1;\n      visibility: visible;\n      transform: none;\n    }\n\n    :host([inline]) .menu-dropdown.show {\n      display: block;\n      pointer-events: auto;\n    }\n\n    /* Mega (okta.com): the panel is a large rounded card floating under the whole bar, centred on\n       the nearest positioned ancestor (st-header) instead of hanging off the trigger — the host\n       stops being the panel's containing block. */\n    :host([mega]:not([inline])) {\n      position: static;\n    }\n\n    :host([mega]:not([inline])) .menu-dropdown {\n      top: calc(100% + var(--st-mega-menu-gap, 12px));\n      left: var(--st-mega-menu-inset, 1rem);\n      right: var(--st-mega-menu-inset, 1rem);\n      max-width: var(--st-mega-menu-max-width, 1400px);\n      margin: 0 auto;\n      padding: 0;\n      max-height: calc(100dvh - var(--st-mega-menu-offset, 96px));\n      overflow-y: auto;\n      border: 0;\n      border-radius: var(--st-mega-menu-radius, 24px);\n      box-shadow: 0 24px 48px var(--st-shadow-color-md);\n    }\n\n    /* The open section's trigger becomes an accent pill — also for a plain dropdown marked \\`bar\\`,\n       so it matches the mega triggers (and st-menu-item variant=\"bar\") beside it. */\n    :host([mega]:not([inline])) .menu-title,\n    :host([bar]:not([inline])) .menu-title {\n      border-radius: 9999px;\n    }\n\n    :host([mega]:not([inline])) .menu-title[aria-expanded='true'],\n    :host([bar]:not([inline])) .menu-title[aria-expanded='true'] {\n      background: var(--st-color-accent);\n      color: var(--st-color-on-solid);\n    }\n\n    .mega-back-bar,\n    .mega-heading {\n      display: none;\n    }\n\n    /* Mega in st-header's hamburger panel: rather than an accordion, the panel slides in over the\n       whole screen with a Back button (okta.com's phone menu). Fixed to the viewport, stacked\n       inside the header's own full-screen layer, so the header's close toggle stays on top. */\n    :host([mega][inline]) .menu-dropdown {\n      display: block;\n      position: fixed;\n      inset: 0;\n      z-index: 1;\n      padding: 0 1.5rem 2rem;\n      overflow-y: auto;\n      border: 0;\n      border-radius: 0;\n      visibility: hidden;\n      transform: translateX(100%);\n      transition:\n        transform 0.3s ease,\n        visibility 0s linear 0.3s;\n    }\n\n    :host([mega][inline]) .menu-dropdown.show {\n      visibility: visible;\n      transform: none;\n      transition-delay: 0s;\n    }\n\n    :host([mega][inline]) .mega-back-bar {\n      display: flex;\n      align-items: center;\n      position: sticky;\n      top: 0;\n      z-index: 1;\n      height: 64px;\n      margin: 0 -1.5rem;\n      padding: 0 1rem;\n      background: inherit;\n      border-bottom: 1px solid var(--st-color-border);\n    }\n\n    .mega-back {\n      ${buttonResetStyles}\n      display: inline-flex;\n      align-items: center;\n      gap: 6px;\n      height: 40px;\n      padding: 0 12px 0 6px;\n      border-radius: var(--st-radius-sm);\n      font-size: 0.875rem;\n      font-weight: 600;\n      color: var(--st-color-text-strong);\n    }\n\n    .mega-back:hover {\n      background: var(--st-color-hover);\n    }\n\n    :host([mega][inline]) .mega-heading {\n      display: block;\n      margin: 1.25rem 0 0.75rem;\n      font-size: 1.375rem;\n      font-weight: 600;\n      color: var(--st-color-text-strong);\n    }\n\n    /* The drill-down replaces the trigger's open state, so the caret points the way it goes. */\n    :host([mega][inline]) .arrow {\n      transform: rotate(-90deg);\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      .menu-dropdown,\n      .arrow,\n      :host([mega][inline]) .menu-dropdown {\n        transition: none;\n      }\n    }\n  `;\n\n  /** Trigger label text (source: `title`, renamed because `title` is the native tooltip\n   * attribute). Leave empty to show only `slot=\"icon\"`. */\n  @property({ type: String })\n  label = '';\n\n  /** Renders the trigger as an `<a href>`. With panel content the click toggles the panel (as in\n   * the source); with none it navigates. */\n  @property({ type: String })\n  href = '';\n\n  @property({ type: String, attribute: 'icon-position' })\n  iconPosition: 'left' | 'right' = 'left';\n\n  /** Inline `width`/`height` of the `slot=\"icon\"` wrapper (source: `iconSize`, default `1.2rem`). */\n  @property({ type: String, attribute: 'icon-size' })\n  iconSize = '1.2rem';\n\n  /** Inline `color` of the `slot=\"icon\"` wrapper (source: `iconColor`). */\n  @property({ type: String, attribute: 'icon-color' })\n  iconColor = 'currentColor';\n\n  /** Which edge of the trigger the panel lines up with. */\n  @property({ type: String })\n  align: 'left' | 'right' = 'left';\n\n  /** `target` of an `href` trigger (source default `_self`). */\n  @property({ type: String })\n  target = '_self';\n\n  /** Extra class(es) on the trigger (source: `className`; a `class` on `st-dropdown` styles the host). */\n  @property({ type: String, attribute: 'trigger-class-name' })\n  triggerClassName = '';\n\n  /** Extra class(es) on the panel (source: `itemGroupClassName`). */\n  @property({ type: String, attribute: 'item-group-class-name' })\n  itemGroupClassName = '';\n\n  /** Unused, as in the source (`itemClassName` is never read there); kept for prop parity. */\n  @property({ type: String, attribute: 'item-class-name' })\n  itemClassName = '';\n\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  /** Highlights the trigger as the current section (e.g. the current page is one of its items). */\n  @property({ type: Boolean, reflect: true })\n  active = false;\n\n  /** Opens the panel in the flow under the trigger instead of floating over the page (see the\n   * styles). `st-header` sets this on its own menu's dropdowns while its hamburger panel shows. */\n  @property({ type: Boolean, reflect: true })\n  inline = false;\n\n  /** Whether the panel is showing. Follows user toggles; may also be set from outside. */\n  @property({ type: Boolean, reflect: true })\n  open = false;\n\n  /**\n   * Mega-menu panel (okta.com style), typically holding an `st-mega-menu`: the panel spans the\n   * full width of the nearest positioned ancestor — `st-header` — right under it, instead of\n   * hanging off the trigger. In `st-header`'s hamburger layout (`inline`) it slides in over the\n   * screen with a Back button rather than opening as an accordion. A click inside the panel only\n   * closes it when it lands on a link.\n   */\n  @property({ type: Boolean, reflect: true })\n  mega = false;\n\n  /** Styles a non-`mega` trigger like a mega one — a pill that turns solid accent while open — so\n   * a plain dropdown (e.g. \"+ New\") lines up with mega triggers in the same header bar. */\n  @property({ type: Boolean, reflect: true })\n  bar = false;\n\n  /** Opens the panel while a mouse hovers the trigger or panel (touch and keyboard still click). Off while `inline`. */\n  @property({ type: Boolean, attribute: 'open-on-hover' })\n  openOnHover = false;\n\n  /** Text of the Back button in the `mega` + `inline` drill-down panel. */\n  @property({ type: String, attribute: 'back-label' })\n  backLabel = 'Back';\n\n  private hoverTimer = 0;\n\n  /** When hover last opened the panel — a click right after that keeps it open instead of toggling it shut. */\n  private hoverOpenedAt = 0;\n\n  /** Whether the default slot has content — the source's `children` check. */\n  @state() private hasContent = false;\n\n  /** Whether `slot=\"icon\"` has content. */\n  @state() private hasIcon = false;\n\n  connectedCallback(): void {\n    super.connectedCallback();\n    document.addEventListener('mousedown', this.closeOnOutsideMouseDown);\n    window.addEventListener('keydown', this.closeOnEscape);\n    this.addEventListener('pointerenter', this.onPointerEnter);\n    this.addEventListener('pointerleave', this.onPointerLeave);\n  }\n\n  disconnectedCallback(): void {\n    document.removeEventListener('mousedown', this.closeOnOutsideMouseDown);\n    window.removeEventListener('keydown', this.closeOnEscape);\n    this.removeEventListener('pointerenter', this.onPointerEnter);\n    this.removeEventListener('pointerleave', this.onPointerLeave);\n    clearTimeout(this.hoverTimer);\n    if (Dropdown.openDropdown === this) Dropdown.openDropdown = null;\n    super.disconnectedCallback();\n  }\n\n  protected updated(changed: Map<string, unknown>): void {\n    if (!changed.has('open')) return;\n    if (this.open) {\n      const previous = Dropdown.openDropdown;\n      Dropdown.openDropdown = this;\n      if (previous && previous !== this) previous.setOpen(false);\n    } else if (Dropdown.openDropdown === this) {\n      Dropdown.openDropdown = null;\n    }\n  }\n\n  private setOpen(open: boolean): void {\n    if (this.open === open) return;\n    this.open = open;\n    this.dispatchEvent(new CustomEvent<DropdownToggleEventDetail>('dropdown-toggle', { detail: { open }, bubbles: true, composed: true }));\n  }\n\n  private hovers(event: PointerEvent): boolean {\n    return this.openOnHover && !this.inline && !this.disabled && this.hasContent && event.pointerType === 'mouse';\n  }\n\n  /** Short delays so a pointer crossing the gap between trigger and panel doesn't close it. */\n  private onPointerEnter = (event: PointerEvent): void => {\n    if (!this.hovers(event)) return;\n    clearTimeout(this.hoverTimer);\n    this.hoverTimer = window.setTimeout(() => {\n      if (!this.open) this.hoverOpenedAt = Date.now();\n      this.setOpen(true);\n    }, 80);\n  };\n\n  private onPointerLeave = (event: PointerEvent): void => {\n    if (!this.hovers(event)) return;\n    clearTimeout(this.hoverTimer);\n    this.hoverTimer = window.setTimeout(() => this.setOpen(false), 200);\n  };\n\n  private onBackClick = (event: Event): void => {\n    event.stopPropagation();\n    this.setOpen(false);\n    this.trigger()?.focus();\n  };\n\n  private closeOnOutsideMouseDown = (event: Event): void => {\n    if (this.open && !event.composedPath().includes(this)) this.setOpen(false);\n  };\n\n  private closeOnEscape = (event: KeyboardEvent): void => {\n    if (!this.open || event.key !== 'Escape') return;\n    const focusWasInside = event.composedPath().includes(this);\n    this.setOpen(false);\n    if (focusWasInside) this.trigger()?.focus();\n  };\n\n  private trigger(): HTMLElement | null {\n    return this.renderRoot.querySelector<HTMLElement>('.menu-title');\n  }\n\n  /** Keyboard-reachable entries in the panel, in order: menu items (they delegate focus to their\n   * own link) plus any plain links/buttons/tabbable elements a caller slots in. */\n  private panelItems(): HTMLElement[] {\n    const slot = this.renderRoot.querySelector<HTMLSlotElement>('.menu-dropdown slot');\n    if (!slot) return [];\n    const selector =\n      'st-menu-item, st-menu-grid-item, st-mega-menu-feature, a[href], button:not([disabled]), input:not([disabled]), [tabindex]:not([tabindex=\"-1\"])';\n    const items: HTMLElement[] = [];\n    for (const el of slot.assignedElements({ flatten: true })) {\n      if (el.matches(selector)) items.push(el as HTMLElement);\n      items.push(...Array.from(el.querySelectorAll<HTMLElement>(selector)));\n    }\n    return items;\n  }\n\n  /** Moves focus into the panel once it has become visible (it is `visibility: hidden` until the\n   * `show` class lands, and hidden elements can't take focus). */\n  private focusItem(pick: (items: HTMLElement[]) => HTMLElement | undefined): void {\n    void this.updateComplete.then(() => pick(this.panelItems())?.focus());\n  }\n\n  /** Enter/Space/ArrowDown open the panel and focus its first entry; ArrowUp its last. */\n  private onTitleKeyDown = (event: KeyboardEvent): void => {\n    if (!this.hasContent || this.disabled) return;\n    if (event.key === 'ArrowDown' || event.key === 'Enter' || event.key === ' ') {\n      event.preventDefault();\n      event.stopPropagation();\n      this.setOpen(true);\n      this.focusItem((items) => items[0]);\n    } else if (event.key === 'ArrowUp') {\n      event.preventDefault();\n      event.stopPropagation();\n      this.setOpen(true);\n      this.focusItem((items) => items[items.length - 1]);\n    }\n  };\n\n  /** Arrow keys/Home/End move between the panel's entries; Tab closes the panel and moves on. */\n  private onPanelKeyDown = (event: KeyboardEvent): void => {\n    if (event.key === 'Tab') {\n      this.setOpen(false);\n      return;\n    }\n    if (!['ArrowDown', 'ArrowUp', 'Home', 'End'].includes(event.key)) return;\n    const items = this.panelItems();\n    if (items.length === 0) return;\n    event.preventDefault();\n    event.stopPropagation();\n    const path = event.composedPath();\n    const current = items.findIndex((item) => path.includes(item));\n    const last = items.length - 1;\n    const next =\n      event.key === 'Home'\n        ? 0\n        : event.key === 'End'\n          ? last\n          : event.key === 'ArrowDown'\n            ? current < 0 || current === last ? 0 : current + 1\n            : current <= 0 ? last : current - 1;\n    items[next].focus();\n  };\n\n  private onTitleClick = (event: Event): void => {\n    event.stopPropagation();\n    if (!this.hasContent) return;\n    event.preventDefault();\n    clearTimeout(this.hoverTimer);\n    if (this.open && Date.now() - this.hoverOpenedAt < 400) return;\n    this.setOpen(!this.open);\n  };\n\n  /** A click anywhere inside the panel closes it, as in the source — for `mega`, only a click on a\n   * link: a big panel has headings and gaps, and a click there shouldn't also close st-header's\n   * hamburger layer. */\n  private onPanelClick = (event: Event): void => {\n    if (this.mega && !event.composedPath().some((node) => node instanceof HTMLAnchorElement)) {\n      event.stopPropagation();\n      return;\n    }\n    this.setOpen(false);\n  };\n\n  private onContentSlotChange = (event: Event): void => {\n    this.hasContent = (event.target as HTMLSlotElement).assignedNodes({ flatten: true }).some(\n      (node) => node.nodeType === Node.ELEMENT_NODE || !!node.textContent?.trim()\n    );\n  };\n\n  private onIconSlotChange = (event: Event): void => {\n    this.hasIcon = (event.target as HTMLSlotElement).assignedNodes({ flatten: true }).length > 0;\n  };\n\n  render() {\n    const icon = html`<span\n      class=\"icon ${this.iconPosition === 'left' ? 'icon-left' : 'icon-right'}\"\n      ?hidden=${!this.hasIcon}\n      style=\"width:${this.iconSize};height:${this.iconSize};color:${this.iconColor}\"\n      ><slot name=\"icon\" @slotchange=${this.onIconSlotChange}></slot\n    ></span>`;\n    const titleContent = html`\n      ${this.iconPosition === 'left' ? icon : nothing} ${this.label ? html`<span part=\"label\">${this.label}</span>` : nothing}\n      ${this.iconPosition === 'right' ? icon : nothing}\n      ${this.hasContent ? html`<span class=\"arrow\" part=\"caret\" aria-hidden=\"true\">▼</span>` : nothing}\n    `;\n    const titleClass = `menu-title ${this.triggerClassName} ${this.open ? 'active' : ''}`;\n\n    return html`\n      <div class=\"menu\" part=\"menu\">\n        ${this.href\n          ? html`\n              <a\n                part=\"trigger\"\n                class=${titleClass}\n                href=${this.href}\n                target=${this.target}\n                aria-haspopup=${this.hasContent ? 'true' : 'false'}\n                aria-expanded=${this.open}\n                aria-disabled=${this.disabled ? 'true' : nothing}\n                @click=${this.onTitleClick}\n                @keydown=${this.onTitleKeyDown}\n              >\n                ${titleContent}\n              </a>\n            `\n          : html`\n              <button\n                part=\"trigger\"\n                class=${titleClass}\n                type=\"button\"\n                aria-haspopup=\"true\"\n                aria-expanded=${this.open}\n                ?disabled=${this.disabled}\n                @click=${this.onTitleClick}\n                @keydown=${this.onTitleKeyDown}\n              >\n                ${titleContent}\n              </button>\n            `}\n        <div\n          part=\"panel\"\n          class=\"menu-dropdown align-${this.align} ${this.itemGroupClassName} ${this.open ? 'show' : ''}\"\n          role=\"menu\"\n          @click=${this.onPanelClick}\n          @keydown=${this.onPanelKeyDown}\n        >\n          ${this.mega\n            ? html`\n                <div class=\"mega-back-bar\" part=\"back-bar\">\n                  <button type=\"button\" class=\"mega-back\" part=\"back\" @click=${this.onBackClick}>\n                    ${chevronIcon('left', 16)} ${this.backLabel}\n                  </button>\n                </div>\n                ${this.label ? html`<p class=\"mega-heading\" part=\"mobile-heading\">${this.label}</p>` : nothing}\n              `\n            : nothing}\n          <slot @slotchange=${this.onContentSlotChange}></slot>\n        </div>\n      </div>\n    `;\n  }\n}\n"],"mappings":"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","names":[]}

package/dist/chunk-R5G6KFTJ.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/menu-item/MenuItem.ts"],"sourcesContent":["import { LitElement, css, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\n\nimport { arrowUpRightIcon } from '../shared/icons';\nimport { controlBaseStyles, fontFamilyStyles } from '../shared/styles';\nimport type { MenuItemSelectEventDetail } from './MenuItemEvents';\n\n/**\n * A single flat nav row — icon (`slot=\"icon\"`) + title + badge on one line, an optional\n * description below — as opposed to `st-menu-grid-item`'s card for a multi-column grid. A 1:1\n * port of `SankhyaUI`'s React `MenuItem` (`SankhyaCMS/SankhyaUI/src/components/Menu`): same\n * markup and CSS, with its `motion` effects redone in CSS — nudges right and scales to 1.01 on\n * hover / 0.99 while pressed, the icon tilts on hover, the badge pops in, the description fades\n * in. Colors come from the suite theme rather than per-item utility classes.\n *\n * Renders a real `<a href>` but fires a *cancelable* `menu-item-select` event (detail: `{ href }`)\n * before navigating — a host doing client-side routing calls `event.preventDefault()` on it (the\n * source used react-router's `Link` here; the suite apps have no router).\n *\n * @slot icon - The row's icon, sized to `icon-size` (16px, or 14px when `compact`).\n * @cssprop --st-menu-item-icon-size - Width and height of the slotted icon; `icon-size` sets it.\n */\n@customElement('st-menu-item')\nexport class MenuItem extends LitElement {\n  /** `focus()` on the element focuses its link, so `st-dropdown` can arrow-key between items. */\n  static shadowRootOptions = { ...LitElement.shadowRootOptions, delegatesFocus: true };\n\n  static styles = css`\n    ${controlBaseStyles}\n\n    :host {\n      display: block;\n      ${fontFamilyStyles}\n    }\n\n    @keyframes st-menu-item-badge-pop {\n      from {\n        transform: scale(0);\n      }\n      70% {\n        transform: scale(1.12);\n      }\n      to {\n        transform: scale(1);\n      }\n    }\n\n    @keyframes st-menu-item-fade-in {\n      from {\n        opacity: 0;\n      }\n      to {\n        opacity: 1;\n      }\n    }\n\n    .menu-item {\n      display: flex;\n      align-items: flex-start;\n      gap: 12px;\n      padding: 12px 16px;\n      font-size: 0.875rem;\n      text-decoration: none;\n      /* --st-nav-*: set by a host bar (st-header's transparent state) to recolour its nav items. */\n      color: var(--st-nav-color, var(--st-color-text));\n      border-radius: 6px;\n      /* The source's 'all 0.15s', minus visibility: animating the visibility this link inherits\n         from a dropdown panel kept it unfocusable for a frame after the panel opened. */\n      transition-property: background-color, color, padding, transform, border-color;\n      transition-duration: 0.15s;\n      transition-timing-function: ease;\n      box-sizing: border-box;\n    }\n\n    /* The source's hover nudge (x: 4px) is done with padding, not a transform: a transform would\n       spill past a scrolling panel's edge (st-source-bar's menus) and show a horizontal scrollbar.\n       Keyboard focus gets the same treatment as hover. */\n    .menu-item:hover,\n    .menu-item:focus-visible {\n      background: var(--st-nav-hover-bg, var(--st-color-hover));\n      color: var(--st-nav-color, var(--st-color-text-strong));\n      padding-left: 20px;\n      transition-duration: 0.1s;\n    }\n\n    .menu-item.compact:hover,\n    .menu-item.compact:focus-visible {\n      padding-left: 16px;\n    }\n\n    .menu-item:active {\n      transform: scale(0.99);\n      transition-duration: 0.1s;\n    }\n\n    .menu-item.active {\n      background-color: var(--st-color-accent-subtle);\n      color: var(--st-color-accent-text);\n      border-left: 4px solid var(--st-color-accent);\n    }\n\n    .menu-item-icon {\n      display: flex;\n      flex-shrink: 0;\n      margin-top: 2px;\n      transition: transform 0.2s ease;\n    }\n\n    .menu-item-icon:hover {\n      transform: rotate(5deg);\n    }\n\n    .menu-item-icon[hidden] {\n      display: none;\n    }\n\n    .menu-item-icon ::slotted(*) {\n      width: var(--st-menu-item-icon-size, 16px);\n      height: var(--st-menu-item-icon-size, 16px);\n    }\n\n    .menu-item-content {\n      flex: 1;\n      min-width: 0;\n    }\n\n    .menu-item-header {\n      display: flex;\n      align-items: center;\n      justify-content: space-between;\n      gap: 8px;\n    }\n\n    .menu-item-title {\n      font-weight: 500;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n\n    .menu-item-badge {\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      min-width: 20px;\n      height: 20px;\n      padding: 0 6px;\n      font-size: 0.75rem;\n      font-weight: 500;\n      border-radius: 9999px;\n      flex-shrink: 0;\n      background: var(--st-color-accent-subtle);\n      color: var(--st-color-accent-text);\n      animation: st-menu-item-badge-pop 0.35s ease-out;\n    }\n\n    .menu-item-description {\n      display: -webkit-box;\n      margin: 4px 0 0;\n      font-size: 0.75rem;\n      color: var(--st-color-text-muted);\n      -webkit-box-orient: vertical;\n      overflow: hidden;\n      line-height: 1.4;\n      animation: st-menu-item-fade-in 0.2s ease;\n    }\n\n    .menu-item.compact {\n      padding: 8px 12px;\n      gap: 8px;\n    }\n\n    .menu-item.compact .menu-item-icon ::slotted(*) {\n      width: var(--st-menu-item-icon-size, 14px);\n      height: var(--st-menu-item-icon-size, 14px);\n    }\n\n    .menu-item.compact .menu-item-title {\n      font-size: 0.75rem;\n    }\n\n    .menu-item.compact .menu-item-description {\n      font-size: 0.75rem;\n    }\n\n    /* link: a plain text link (okta.com mega-menu columns) — no box, no nudge, the badge right\n       after the title, long titles wrap. */\n    .menu-item.link {\n      padding: 7px 0;\n      gap: 10px;\n      font-size: 0.9375rem;\n      color: var(--st-nav-color, var(--st-color-text));\n    }\n\n    .menu-item.link:hover,\n    .menu-item.link:focus-visible {\n      padding-left: 0;\n      background: transparent;\n      color: var(--st-nav-color, var(--st-color-text-strong));\n    }\n\n    .menu-item.link:hover .menu-item-title,\n    .menu-item.link:focus-visible .menu-item-title {\n      text-decoration: underline;\n      text-underline-offset: 4px;\n    }\n\n    .menu-item.link:active {\n      transform: none;\n    }\n\n    .menu-item.link.active {\n      border-left: 0;\n      background: transparent;\n      font-weight: 600;\n    }\n\n    .menu-item.link .menu-item-header {\n      justify-content: flex-start;\n    }\n\n    .menu-item.link .menu-item-title {\n      white-space: normal;\n      font-weight: 400;\n    }\n\n    .menu-item.link .menu-item-description {\n      margin-top: 2px;\n      font-size: 0.8125rem;\n    }\n\n    /* bar: a top-level item in a header bar next to mega st-dropdowns (e.g. \"Dashboard\" beside\n       \"Masters ▼\") — the same pill, size and active look as their triggers, so the row reads as\n       one set. Wins over compact (declared after it). */\n    .menu-item.bar {\n      align-items: center;\n      min-height: 40px;\n      padding: 12px;\n      gap: 8px;\n      border-radius: 9999px;\n      white-space: nowrap;\n    }\n\n    /* Hover fills like a mega trigger opening on hover. */\n    .menu-item.bar:hover,\n    .menu-item.bar:focus-visible {\n      padding-left: 12px;\n      background: var(--st-color-accent);\n      color: var(--st-color-on-solid);\n    }\n\n    .menu-item.bar.active {\n      border-left: 0;\n    }\n\n    .menu-item.bar .menu-item-icon {\n      margin-top: 0;\n    }\n\n    .menu-item.bar .menu-item-title {\n      font-size: 0.875rem;\n      font-weight: 400;\n    }\n\n    .external {\n      display: inline-flex;\n      margin-left: 3px;\n      vertical-align: 0.05em;\n    }\n\n    .menu-item.no-description {\n      align-items: center;\n    }\n\n    .menu-item.no-description .menu-item-icon {\n      margin-top: 0;\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      .menu-item,\n      .menu-item-icon {\n        transition: none;\n      }\n\n      .menu-item:active,\n      .menu-item-icon:hover {\n        transform: none;\n      }\n\n      .menu-item-badge,\n      .menu-item-description {\n        animation: none;\n      }\n    }\n  `;\n\n  @property({ type: String })\n  title = '';\n\n  @property({ type: String })\n  href = '';\n\n  @property({ type: String })\n  description = '';\n\n  /** Small trailing label, e.g. a count or \"New\"/\"Beta\" — omit for none. */\n  @property({ type: String })\n  badge = '';\n\n  /** Highlights this row as the current page (source: `isActive`). */\n  @property({ type: Boolean, reflect: true })\n  active = false;\n\n  @property({ type: Boolean, reflect: true })\n  compact = false;\n\n  /** Suppresses the description even when `description` is set (source: `showDescription`, default `true`). */\n  @property({ type: Boolean, attribute: 'show-description' })\n  showDescription = true;\n\n  /** `target` for the `<a>` (source default `_self`). */\n  @property({ type: String })\n  target = '_self';\n\n  /** `default` (a row with a hover box), `link` (a plain text link, as in `st-mega-menu-column`;\n   * marked with an arrow when it opens a new tab) or `bar` (a top-level item in a header bar,\n   * shaped like a mega `st-dropdown`'s trigger pill so it lines up with the dropdowns beside it). */\n  @property({ type: String, reflect: true })\n  variant: 'default' | 'link' | 'bar' = 'default';\n\n  /** Size of the slotted icon, any CSS length (e.g. `36px`); empty keeps 16px (14px when `compact`). */\n  @property({ type: String, attribute: 'icon-size' })\n  iconSize = '';\n\n  /** Whether `slot=\"icon\"` has content, so an omitted icon leaves no empty box. */\n  @state() private hasIcon = false;\n\n  private onIconSlotChange = (event: Event): void => {\n    this.hasIcon = (event.target as HTMLSlotElement).assignedNodes({ flatten: true }).length > 0;\n  };\n\n  private onClick = (event: MouseEvent): void => {\n    const selectEvent = new CustomEvent<MenuItemSelectEventDetail>('menu-item-select', {\n      detail: { href: this.href },\n      bubbles: true,\n      composed: true,\n      cancelable: true\n    });\n    this.dispatchEvent(selectEvent);\n    if (selectEvent.defaultPrevented) event.preventDefault();\n  };\n\n  render() {\n    const showDescription = !!this.description && this.showDescription;\n    const link = this.variant === 'link';\n    const classes = [\n      'menu-item',\n      link ? 'link' : '',\n      this.variant === 'bar' ? 'bar' : '',\n      this.active ? 'active' : '',\n      this.compact ? 'compact' : '',\n      showDescription ? '' : 'no-description'\n    ]\n      .filter(Boolean)\n      .join(' ');\n    const external = link && this.target === '_blank';\n    return html`\n      <a\n        part=\"item\"\n        class=${classes}\n        href=${this.href}\n        target=${this.target}\n        rel=${this.target === '_blank' ? 'noopener noreferrer' : nothing}\n        @click=${this.onClick}\n      >\n        <span\n          class=\"menu-item-icon\"\n          part=\"icon\"\n          ?hidden=${!this.hasIcon}\n          style=${this.iconSize ? `--st-menu-item-icon-size: ${this.iconSize}` : nothing}\n          ><slot name=\"icon\" @slotchange=${this.onIconSlotChange}></slot\n        ></span>\n        <span class=\"menu-item-content\" part=\"content\">\n          <span class=\"menu-item-header\" part=\"header\">\n            <span part=\"title\" class=\"menu-item-title\"\n              >${this.title}${external ? html`<span class=\"external\">${arrowUpRightIcon(11)}</span>` : nothing}</span\n            >\n            ${this.badge ? html`<span part=\"badge\" class=\"menu-item-badge\">${this.badge}</span>` : nothing}\n          </span>\n          ${showDescription ? html`<p part=\"description\" class=\"menu-item-description\">${this.description}</p>` : nothing}\n        </span>\n      </a>\n    `;\n  }\n}\n"],"mappings":"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","names":[]}

package/dist/chunk-SMLR736E.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/menu-grid/MenuGrid.ts"],"sourcesContent":["import { LitElement, css, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { controlBaseStyles } from '../shared/styles';\n\n/**\n * A responsive grid of `st-menu-grid-item`s — the \"rich\" nav-menu layout (icon + title +\n * description per entry, arranged in columns), typically slotted into `st-dropdown`'s default\n * slot. A 1:1 port of `SankhyaUI`'s React `MenuGrid` (`SankhyaCMS/SankhyaUI/src/components/Menu`):\n * same markup (`.menu-grid-container` > `.menu-grid.columns-N`), gap and breakpoints (768px: 2–4\n * columns → 2; 480px: everything → 1; a 1-column grid stays 1).\n */\n@customElement('st-menu-grid')\nexport class MenuGrid extends LitElement {\n  static styles = css`\n    ${controlBaseStyles}\n\n    :host {\n      display: block;\n    }\n\n    .menu-grid-container {\n      width: 100%;\n    }\n\n    .menu-grid {\n      display: grid;\n      gap: 12px;\n    }\n\n    .menu-grid.columns-1 {\n      grid-template-columns: repeat(1, 1fr);\n    }\n\n    .menu-grid.columns-2 {\n      grid-template-columns: repeat(2, 1fr);\n    }\n\n    .menu-grid.columns-3 {\n      grid-template-columns: repeat(3, 1fr);\n    }\n\n    .menu-grid.columns-4 {\n      grid-template-columns: repeat(4, 1fr);\n    }\n\n    @media (max-width: 768px) {\n      .menu-grid.columns-2,\n      .menu-grid.columns-3,\n      .menu-grid.columns-4 {\n        grid-template-columns: repeat(2, 1fr);\n      }\n    }\n\n    @media (max-width: 480px) {\n      .menu-grid.columns-1,\n      .menu-grid.columns-2,\n      .menu-grid.columns-3,\n      .menu-grid.columns-4 {\n        grid-template-columns: 1fr;\n      }\n    }\n  `;\n\n  /** Number of columns at full width (1–4, same as the source component's `columns-N` classes). */\n  @property({ type: Number })\n  columns = 3;\n\n  /** Extra class(es) appended to the inner grid element — the source component's `gridClassName`.\n   * Its outer `className` is the host element itself here: set a `class` attribute on `st-menu-grid`. */\n  @property({ type: String, attribute: 'grid-class-name' })\n  gridClassName = '';\n\n  render() {\n    const columns = Math.min(4, Math.max(1, Math.round(this.columns) || 1));\n    return html`\n      <div class=\"menu-grid-container\" part=\"container\">\n        <div part=\"grid\" class=\"menu-grid columns-${columns} ${this.gridClassName}\">\n          <slot></slot>\n        </div>\n      </div>\n    `;\n  }\n}\n"],"mappings":";;;;;;;;AAAA,SAAS,YAAY,KAAK,YAAY;AACtC,SAAS,eAAe,gBAAgB;AAYjC,IAAM,WAAN,cAAuB,WAAW;AAAA,EAAlC;AAAA;AAqDL,mBAAU;AAKV,yBAAgB;AAAA;AAAA,EAEhB,SAAS;AACP,UAAM,UAAU,KAAK,IAAI,GAAG,KAAK,IAAI,GAAG,KAAK,MAAM,KAAK,OAAO,KAAK,CAAC,CAAC;AACtE,WAAO;AAAA;AAAA,oDAEyC,OAAO,IAAI,KAAK,aAAa;AAAA;AAAA;AAAA;AAAA;AAAA,EAK/E;AACF;AAtEa,SACJ,SAAS;AAAA,MACZ,iBAAiB;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;AAmDrB;AAAA,EADC,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GApDf,SAqDX;AAKA;AAAA,EADC,SAAS,EAAE,MAAM,QAAQ,WAAW,kBAAkB,CAAC;AAAA,GAzD7C,SA0DX;AA1DW,WAAN;AAAA,EADN,cAAc,cAAc;AAAA,GAChB;","names":[]}

package/dist/chunk-VWS53WY4.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/promo-banner/PromoBanner.ts"],"sourcesContent":["import { LitElement, css, html, nothing } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { buttonResetStyles, controlBaseStyles, rootFontFamilyStyles } from '../shared/styles';\nimport { ctaLinkStyles, sectionSubtitleStyles, sectionTitleStyles } from '../shared/section-styles';\nimport type { HeroActionEventDetail } from '../hero/HeroEvents';\n\n/**\n * Rounded call-to-action banner (title, subtitle, one outlined button) on a dark panel or a\n * background image. Port of `SankhyaUI`'s React `PromoBanner`; the button fires an `action` event\n * (detail `{ href }`, empty unless set) in place of `onAction`.\n *\n * @cssprop --st-promo-banner-margin - Overrides the banner's margin.\n * @cssprop --st-promo-banner-padding - Overrides the banner's padding.\n */\n@customElement('st-promo-banner')\nexport class PromoBanner extends LitElement {\n  static styles = css`\n    ${controlBaseStyles}\n\n    :host {\n      display: block;\n      box-sizing: border-box;\n      width: calc(100% - 48px);\n      max-width: var(--st-cms-container-max);\n      /* !important: a page-level reset (e.g. Tailwind Preflight) otherwise zeroes a shadow host's\n         margin/padding; override with --st-promo-banner-margin/-padding instead. */\n      margin: var(--st-promo-banner-margin, var(--st-space-40) auto) !important;\n      padding: var(--st-promo-banner-padding, 100px var(--st-space-24)) !important;\n      border-radius: var(--st-space-24);\n      background-color: var(--st-color-text-strong);\n      background-size: cover;\n      background-position: center;\n      color: var(--st-color-on-solid);\n      text-align: center;\n      ${rootFontFamilyStyles}\n    }\n\n    :host([inverted]) {\n      background-color: var(--st-color-subtle);\n      color: var(--st-color-text-strong);\n    }\n\n    .container {\n      max-width: 800px;\n      margin: 0 auto;\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      gap: var(--st-space-32);\n    }\n\n    .title {\n      ${sectionTitleStyles}\n      color: inherit;\n      margin: 0;\n      letter-spacing: -0.02em;\n    }\n\n    .subtitle {\n      ${sectionSubtitleStyles}\n      color: inherit;\n      opacity: 0.8;\n      margin: 0;\n    }\n\n    .actions {\n      margin-top: var(--st-space-16);\n    }\n\n    .cta {\n      ${buttonResetStyles}\n      ${ctaLinkStyles}\n      border: 1px solid currentColor;\n      color: inherit;\n    }\n\n    .cta:hover {\n      transform: scale(1.05);\n    }\n\n    @media (max-width: 768px) {\n      :host {\n        width: auto;\n        margin: var(--st-promo-banner-margin, var(--st-space-24)) !important;\n        padding: var(--st-promo-banner-padding, 60px var(--st-space-24)) !important;\n        border-radius: var(--st-radius-lg);\n      }\n      .actions,\n      .cta {\n        width: 100%;\n      }\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      .cta {\n        transition: none;\n      }\n    }\n  `;\n\n  @property({ type: String })\n  title = '';\n\n  @property({ type: String })\n  subtitle = '';\n\n  @property({ type: String, attribute: 'action-label' })\n  actionLabel = '';\n\n  @property({ type: String })\n  href = '';\n\n  @property({ type: String, attribute: 'image-src' })\n  imageSrc = '';\n\n  @property({ type: Boolean, reflect: true })\n  inverted = false;\n\n  protected willUpdate(): void {\n    this.style.backgroundImage = this.imageSrc ? `url(${JSON.stringify(this.imageSrc)})` : '';\n  }\n\n  private onAction = (): void => {\n    this.dispatchEvent(\n      new CustomEvent<HeroActionEventDetail>('action', { detail: { href: this.href }, bubbles: true, composed: true })\n    );\n  };\n\n  render() {\n    return html`\n      <div class=\"container\" part=\"container\">\n        <h2 class=\"title\" part=\"title\">${this.title}</h2>\n        ${this.subtitle ? html`<p class=\"subtitle\" part=\"subtitle\">${this.subtitle}</p>` : nothing}\n        <slot></slot>\n        ${this.actionLabel\n          ? html`<div class=\"actions\" part=\"actions\">\n              <button class=\"cta\" part=\"action\" type=\"button\" @click=${this.onAction}>${this.actionLabel}</button>\n            </div>`\n          : nothing}\n      </div>\n    `;\n  }\n}\n"],"mappings":";;;;;;;;;;;;;;;AAAA,SAAS,YAAY,KAAK,MAAM,eAAe;AAC/C,SAAS,eAAe,gBAAgB;AAejC,IAAM,cAAN,cAA0B,WAAW;AAAA,EAArC;AAAA;AAsFL,iBAAQ;AAGR,oBAAW;AAGX,uBAAc;AAGd,gBAAO;AAGP,oBAAW;AAGX,oBAAW;AAMX,SAAQ,WAAW,MAAY;AAC7B,WAAK;AAAA,QACH,IAAI,YAAmC,UAAU,EAAE,QAAQ,EAAE,MAAM,KAAK,KAAK,GAAG,SAAS,MAAM,UAAU,KAAK,CAAC;AAAA,MACjH;AAAA,IACF;AAAA;AAAA,EARU,aAAmB;AAC3B,SAAK,MAAM,kBAAkB,KAAK,WAAW,OAAO,KAAK,UAAU,KAAK,QAAQ,CAAC,MAAM;AAAA,EACzF;AAAA,EAQA,SAAS;AACP,WAAO;AAAA;AAAA,yCAE8B,KAAK,KAAK;AAAA,UACzC,KAAK,WAAW,2CAA2C,KAAK,QAAQ,SAAS,OAAO;AAAA;AAAA,UAExF,KAAK,cACH;AAAA,uEAC2D,KAAK,QAAQ,IAAI,KAAK,WAAW;AAAA,sBAE5F,OAAO;AAAA;AAAA;AAAA,EAGjB;AACF;AA/Ha,YACJ,SAAS;AAAA,MACZ,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAiBf,oBAAoB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAkBpB,kBAAkB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAOlB,qBAAqB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAWrB,iBAAiB;AAAA,QACjB,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;AA8BnB;AAAA,EADC,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GArFf,YAsFX;AAGA;AAAA,EADC,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GAxFf,YAyFX;AAGA;AAAA,EADC,SAAS,EAAE,MAAM,QAAQ,WAAW,eAAe,CAAC;AAAA,GA3F1C,YA4FX;AAGA;AAAA,EADC,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GA9Ff,YA+FX;AAGA;AAAA,EADC,SAAS,EAAE,MAAM,QAAQ,WAAW,YAAY,CAAC;AAAA,GAjGvC,YAkGX;AAGA;AAAA,EADC,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GApG/B,YAqGX;AArGW,cAAN;AAAA,EADN,cAAc,iBAAiB;AAAA,GACnB;","names":[]}

package/dist/chunk-XCA3XFFG.js

@@ -1,74 +0,0 @@
-import {
-  fontFamilyStyles
-} from "./chunk-KMU6ABQF.js";
-import {
-  __decorateClass
-} from "./chunk-EUXUH3YW.js";
-
-// src/tooltip/Tooltip.ts
-import { LitElement, css, html } from "lit";
-import { customElement, property } from "lit/decorators.js";
-var Tooltip = class extends LitElement {
-  constructor() {
-    super(...arguments);
-    this.text = "";
-  }
-  render() {
-    return html`<slot></slot><span class="bubble" part="bubble" aria-hidden="true">${this.text}</span>`;
-  }
-};
-Tooltip.styles = css`
-    ${fontFamilyStyles}
-
-    :host {
-      position: relative;
-      display: inline-flex;
-    }
-
-    .bubble {
-      position: absolute;
-      bottom: calc(100% + 6px);
-      left: 50%;
-      transform: translateX(-50%);
-      z-index: 20;
-      padding: var(--st-space-4) var(--st-space-8);
-      border-radius: var(--st-radius-xs);
-      background: var(--st-color-text-strong);
-      color: var(--st-color-on-solid);
-      font-size: var(--st-text-xs);
-      font-weight: var(--st-font-weight-medium);
-      line-height: 1.3;
-      white-space: nowrap;
-      pointer-events: none;
-      opacity: 0;
-      transition: opacity 0.12s ease;
-    }
-
-    /* Hover waits a moment, so a passing pointer doesn't flash a label; keyboard focus shows it at once. */
-    :host(:hover) .bubble {
-      opacity: 1;
-      transition-delay: var(--st-tooltip-delay, 300ms);
-    }
-
-    :host(:focus-within) .bubble {
-      opacity: 1;
-      transition-delay: 0s;
-    }
-
-    @media (prefers-reduced-motion: reduce) {
-      .bubble {
-        transition: none;
-      }
-    }
-  `;
-__decorateClass([
-  property({ type: String })
-], Tooltip.prototype, "text", 2);
-Tooltip = __decorateClass([
-  customElement("st-tooltip")
-], Tooltip);
-
-export {
-  Tooltip
-};
-//# sourceMappingURL=chunk-XCA3XFFG.js.map

package/dist/chunk-XCA3XFFG.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/tooltip/Tooltip.ts"],"sourcesContent":["import { LitElement, css, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { fontFamilyStyles } from '../shared/styles';\n\n/**\n * A small label that shows above a control on hover and on keyboard focus. Wrap the control (a button\n * or an icon button) in it and pass the same words as its accessible name in `text`. The bubble is\n * decorative (`aria-hidden`): the control's own `aria-label` is what a screen reader announces, so the\n * words aren't read twice.\n *\n * The bubble is positioned by the wrapper, so put the tooltip where it has room above: it's not\n * clipped by the wrapper's own box, but it is clipped by an ancestor with `overflow: hidden`.\n */\n@customElement('st-tooltip')\nexport class Tooltip extends LitElement {\n  static styles = css`\n    ${fontFamilyStyles}\n\n    :host {\n      position: relative;\n      display: inline-flex;\n    }\n\n    .bubble {\n      position: absolute;\n      bottom: calc(100% + 6px);\n      left: 50%;\n      transform: translateX(-50%);\n      z-index: 20;\n      padding: var(--st-space-4) var(--st-space-8);\n      border-radius: var(--st-radius-xs);\n      background: var(--st-color-text-strong);\n      color: var(--st-color-on-solid);\n      font-size: var(--st-text-xs);\n      font-weight: var(--st-font-weight-medium);\n      line-height: 1.3;\n      white-space: nowrap;\n      pointer-events: none;\n      opacity: 0;\n      transition: opacity 0.12s ease;\n    }\n\n    /* Hover waits a moment, so a passing pointer doesn't flash a label; keyboard focus shows it at once. */\n    :host(:hover) .bubble {\n      opacity: 1;\n      transition-delay: var(--st-tooltip-delay, 300ms);\n    }\n\n    :host(:focus-within) .bubble {\n      opacity: 1;\n      transition-delay: 0s;\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      .bubble {\n        transition: none;\n      }\n    }\n  `;\n\n  /** The words shown in the bubble: the same words as the control's accessible name. */\n  @property({ type: String })\n  text = '';\n\n  render() {\n    return html`<slot></slot><span class=\"bubble\" part=\"bubble\" aria-hidden=\"true\">${this.text}</span>`;\n  }\n}\n"],"mappings":";;;;;;;;AAAA,SAAS,YAAY,KAAK,YAAY;AACtC,SAAS,eAAe,gBAAgB;AAcjC,IAAM,UAAN,cAAsB,WAAW;AAAA,EAAjC;AAAA;AAgDL,gBAAO;AAAA;AAAA,EAEP,SAAS;AACP,WAAO,0EAA0E,KAAK,IAAI;AAAA,EAC5F;AACF;AArDa,QACJ,SAAS;AAAA,MACZ,gBAAgB;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;AA8CpB;AAAA,EADC,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GA/Cf,QAgDX;AAhDW,UAAN;AAAA,EADN,cAAc,YAAY;AAAA,GACd;","names":[]}

package/dist/chunk-XWB4CKDU.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/header/Header.ts"],"sourcesContent":["import { LitElement, css, html, nothing } from 'lit';\nimport { customElement, property, state } from 'lit/decorators.js';\n\nimport { chevronIcon, closeIcon, menuIcon } from '../shared/icons';\nimport { BREAKPOINT_TABLET, buttonResetStyles, controlBaseStyles, dropdownPanelStyles, rootFontFamilyStyles } from '../shared/styles';\nimport type { LanguageChangedEventDetail } from './HeaderEvents';\n\n/**\n * The app-shell header bar — brand (image + title, or title alone) on the left, a `slot=\"menu\"`\n * for primary nav (e.g. `st-dropdown`/`st-menu-grid` mega-menus, or plain links) taking the\n * middle, and a `slot=\"utility\"` for account/app-switcher/theme controls on the right. Ported\n * from `SankhyaUI`'s React `Header` (a separate, unrelated marketing-site project) to this\n * package's Lit conventions and this workspace's actual needs — that source component takes an\n * `imageSrc` logo with no text fallback, but none of this suite's apps has a logo image today, so\n * `title` is the primary brand prop here and `brand-image-url` is optional, mirroring\n * `st-app-header`'s own brand/title split (this component's slotted-menu/utility shape is a\n * deliberately different, more generic surface than `st-app-header`'s fixed nav-links/user-menu\n * props — pick whichever fits a given app's header).\n *\n * Layout follows the source's `Header.css`: the menu starts 4rem after the brand, the utility\n * controls sit after a vertical divider, and below `BREAKPOINT_TABLET` (900px here; 768px in the\n * source) `menu`/`utility` collapse behind a hamburger toggle into a full-screen layer under the\n * toggle (closes on Escape or a click inside it), where the menu's `st-dropdown`s are switched to\n * `inline` so they open in the flow — the same two slotted elements just get repositioned by CSS\n * (`.mobile-panel`'s `display: contents` at desktop width vs. a real fixed-position box below\n * `BREAKPOINT_TABLET`), rather than the slots being duplicated in the template, since a shadow\n * root can only ever assign a given light-DOM child to the *first* slot of a given name.\n *\n * An optional `slot=\"brand-extra\"` sits right after the brand (e.g. an edition badge such as\n * \"🇮🇳 India Edition\"); unlike `menu`/`utility` it stays in the bar at every width.\n *\n * Also carries an optional built-in language switcher (`languages`/`currentLanguageCode`, fires\n * `language-change`) — ported from `st-app-header`'s own implementation verbatim rather than\n * rebuilt, since the source `Header`'s reference story shows an equivalent flag/language `Select`\n * as a first-class header utility. Hidden entirely when `languages` has fewer than two entries.\n * This component has no translation logic itself; the consuming app owns what a language `code`\n * means and which content it re-renders in response.\n *\n * @slot menu - Primary navigation.\n * @slot utility - Account, app-switcher and theme controls, after the divider.\n * @slot brand-extra - Shown right after the brand at every width (e.g. an edition badge).\n * @slot menu-icon - Replaces the hamburger on the narrow-screen toggle (the built-in glyph when empty).\n * @slot close-icon - Replaces the close (X) on the toggle while the menu is open (the built-in glyph when empty).\n * @cssprop --st-header-toggle-icon-size - Width and height of a slotted toggle icon (default 20px, the built-in glyph's size).\n */\n@customElement('st-header')\nexport class Header extends LitElement {\n  static styles = css`\n    ${controlBaseStyles}\n\n    :host {\n      display: flex;\n      align-items: center;\n      /* The containing block of an st-dropdown[mega] panel, which spans the bar. */\n      position: relative;\n      /* Spacing between brand, menu and utility controls is the rows' own margins (SankhyaUI's\n         layout), not a flex gap. */\n      gap: 0;\n      /* !important on the box-model properties only: a shadow host's own :host rule always loses\n       * to ANY rule the consuming page has for the same property on that element, regardless of\n       * specificity (see st-footer's own padding/border-top for the same fix). Without\n       * box-sizing: border-box pinned here, a page that also sets its own padding on this host\n       * (e.g. a p-2 utility class) adds that padding on TOP of the fixed 64px height instead of\n       * being absorbed inside it — which is exactly what happens in Template Hub, the one app that\n       * doesn't load Tailwind Preflight (Preflight's own box-sizing: border-box reset is what\n       * silently keeps every other app's header at the intended 64px). */\n      box-sizing: border-box !important;\n      padding: 0 2rem !important;\n      height: 64px !important;\n      background: var(--st-color-surface);\n      border-bottom: 1px solid var(--st-color-border) !important;\n      ${rootFontFamilyStyles}\n      color: var(--st-color-text-strong);\n    }\n\n    :host([sticky]) {\n      position: sticky;\n      top: 0;\n      z-index: 100;\n    }\n\n    /* Toggle icons: a host's slotted icon, else the built-in glyph; only the current state's shows. */\n    .toggle slot {\n      display: contents;\n    }\n\n    .toggle slot[hidden] {\n      display: none;\n    }\n\n    .toggle ::slotted(*) {\n      flex: none;\n      width: var(--st-header-toggle-icon-size, 20px);\n      height: var(--st-header-toggle-icon-size, 20px);\n    }\n\n    :host([inverted]) {\n      background: var(--st-color-text-strong);\n      color: var(--st-color-on-solid);\n      border-bottom-color: transparent;\n    }\n\n    :host([sticky]),\n    :host([transparent]),\n    :host([hide-on-scroll]) {\n      transition:\n        background-color 0.3s ease,\n        color 0.3s ease,\n        box-shadow 0.3s ease,\n        border-color 0.3s ease,\n        transform 0.3s ease;\n    }\n\n    /* Once the page has scrolled, a sticky/fixed header lifts off the content. */\n    :host([scrolled][sticky]),\n    :host([scrolled][transparent]),\n    :host([scrolled][hide-on-scroll]) {\n      box-shadow: 0 4px 16px var(--st-shadow-color-md);\n      border-bottom-color: transparent !important;\n    }\n\n    /* transparent: fixed over the top of the page (e.g. a dark hero), see-through until scrolled. */\n    :host([transparent]) {\n      position: fixed;\n      top: 0;\n      left: 0;\n      right: 0;\n      z-index: 100;\n    }\n\n    :host([transparent]:not([scrolled]):not([mobile-open])) {\n      background: transparent;\n      border-bottom-color: transparent !important;\n      color: var(--st-header-transparent-color, var(--st-color-on-solid));\n      /* Read by st-menu-item / st-dropdown triggers in the bar (their panels reset them). */\n      --st-nav-color: var(--st-header-transparent-color, var(--st-color-on-solid));\n      --st-nav-hover-bg: color-mix(in oklch, currentColor 14%, transparent);\n    }\n\n    :host([transparent]:not([scrolled]):not([mobile-open])) .utility-row {\n      border-left-color: color-mix(in oklch, currentColor 35%, transparent);\n    }\n\n    :host([transparent]:not([scrolled]):not([mobile-open])) .lang-trigger {\n      color: inherit;\n    }\n\n    :host([transparent]:not([scrolled]):not([mobile-open])) .lang-trigger:hover,\n    :host([transparent]:not([scrolled]):not([mobile-open])) .toggle:hover {\n      background: color-mix(in oklch, currentColor 14%, transparent);\n    }\n\n    /* hide-on-scroll: slides away while scrolling down, back as soon as the user scrolls up. */\n    :host([hide-on-scroll]:not([sticky]):not([transparent])) {\n      position: sticky;\n      top: 0;\n      z-index: 100;\n    }\n\n    :host([scroll-hidden]:not([mobile-open])) {\n      transform: translateY(-100%);\n      box-shadow: none;\n    }\n\n    .brand {\n      display: flex;\n      align-items: center;\n      gap: var(--st-space-10);\n      flex: none;\n      text-decoration: none;\n      color: inherit;\n    }\n\n    .brand-mark {\n      width: var(--st-size-28);\n      height: var(--st-size-28);\n      border-radius: var(--st-radius-sm);\n      flex: none;\n      object-fit: contain;\n    }\n\n    .brand-title {\n      font-size: var(--st-text-xl);\n      font-weight: var(--st-font-weight-bold);\n      letter-spacing: var(--st-tracking-tight);\n      white-space: nowrap;\n    }\n\n    /* Optional slot=\"brand-extra\" (e.g. an edition badge) right after the brand. Outside the\n       mobile panel, so it stays beside the logo at every width; no box at all when empty. */\n    .brand-extra {\n      display: flex;\n      align-items: center;\n      gap: var(--st-space-8);\n      flex: none;\n      margin-left: var(--st-space-10);\n      white-space: nowrap;\n    }\n\n    .brand-extra.empty {\n      display: none;\n    }\n\n    /* Desktop: a transparent pass-through so .menu-row/.utility-row lay out directly as :host's\n       own flex children. Mobile (see below) turns this into the actual overlay box. */\n    .mobile-panel {\n      display: contents;\n    }\n\n    /* Desktop layout from SankhyaUI's Header: the menu starts 4rem after the brand and takes the\n       free width; the utility controls sit after a vertical divider. Between 901px and 1200px the\n       gaps tighten so the menu still fits down to the 900px hamburger breakpoint. */\n    .menu-row {\n      flex: 1;\n      display: flex;\n      align-items: center;\n      gap: 1.5rem;\n      min-width: 0;\n      margin-left: 4rem;\n    }\n\n    .utility-row {\n      flex: none;\n      display: flex;\n      align-items: center;\n      gap: 1rem;\n      margin-left: 1.5rem;\n      padding-left: 1.5rem;\n      border-left: 1px solid var(--st-color-border);\n    }\n\n    :host([inverted]) .utility-row {\n      border-left-color: currentColor;\n    }\n\n    .utility-row.empty {\n      display: none;\n    }\n\n    @media (max-width: 1200px) {\n      :host {\n        padding: 0 1rem !important;\n      }\n\n      .menu-row {\n        margin-left: 0.5rem;\n      }\n\n      .utility-row {\n        margin-left: 0.5rem;\n        padding-left: 0.5rem;\n      }\n    }\n\n    @keyframes st-header-fade-in {\n      from {\n        opacity: 0;\n      }\n      to {\n        opacity: 1;\n      }\n    }\n\n    .toggle {\n      display: none;\n      align-items: center;\n      justify-content: center;\n      flex: none;\n      position: relative;\n      z-index: 1002;\n      width: var(--st-size-32);\n      height: var(--st-size-32);\n      margin-left: auto;\n      padding: 0.5rem;\n      border: 0;\n      border-radius: var(--st-radius-sm);\n      background: transparent;\n      color: inherit;\n      cursor: pointer;\n    }\n\n    .toggle:hover {\n      background: var(--st-color-hover);\n    }\n\n    .lang-menu {\n      position: relative;\n      flex: none;\n    }\n\n    .lang-trigger {\n      ${buttonResetStyles}\n      display: flex;\n      align-items: center;\n      gap: var(--st-space-4);\n      height: var(--st-size-32);\n      padding: 0 var(--st-space-8);\n      border-radius: var(--st-radius-sm);\n      font-size: var(--st-text-base);\n      font-weight: var(--st-font-weight-semibold);\n      color: var(--st-color-text-muted);\n    }\n\n    .lang-trigger:hover {\n      background: var(--st-color-hover);\n      color: var(--st-color-text-strong);\n    }\n\n    .lang-dropdown {\n      ${dropdownPanelStyles}\n      min-width: 140px;\n    }\n\n    .lang-option {\n      ${buttonResetStyles}\n      display: block;\n      width: 100%;\n      padding: var(--st-space-10) var(--st-space-14);\n      font-size: var(--st-text-base);\n      font-weight: var(--st-font-weight-semibold);\n      text-align: left;\n      color: inherit;\n    }\n\n    .lang-option:hover {\n      background: var(--st-color-hover);\n    }\n\n    .lang-option.active {\n      color: var(--st-color-accent-text);\n    }\n\n    /* Hamburger layout from SankhyaUI's Header: a full-screen layer under the toggle, menu above\n       the utility controls, the menu's dropdowns opening in the flow (see syncInlineDropdowns). */\n    @media (max-width: ${BREAKPOINT_TABLET}px) {\n      :host {\n        padding: 0 1rem !important;\n      }\n\n      .mobile-panel {\n        display: none;\n      }\n\n      .toggle {\n        display: inline-flex;\n      }\n\n      :host([mobile-open]) .mobile-panel {\n        display: flex;\n        flex-direction: column;\n        gap: 2rem;\n        position: fixed;\n        inset: 0;\n        background: var(--st-color-surface);\n        padding: 5rem 1.5rem 2rem;\n        overflow-y: auto;\n        z-index: 1001;\n        animation: st-header-fade-in 0.3s ease;\n      }\n\n      :host([mobile-open]) .menu-row,\n      :host([mobile-open]) .utility-row {\n        flex-direction: column;\n        align-items: stretch;\n        gap: 1.5rem;\n        margin-left: 0;\n      }\n\n      :host([mobile-open]) .utility-row {\n        padding: 1.5rem 0 0;\n        border-left: 0;\n        border-top: 1px solid var(--st-color-border);\n      }\n\n      /* Apps usually slot one flex-row wrapper per slot; stack its items as the source does. */\n      :host([mobile-open]) ::slotted([slot='menu']),\n      :host([mobile-open]) ::slotted([slot='utility']) {\n        flex-direction: column !important;\n        align-items: stretch !important;\n        margin: 0 !important;\n      }\n    }\n\n    /* The same collapsed layout, switched on by script when the menu no longer fits the bar at\n       desktop width (see evaluateFit) — without it the menu spills over the utility controls. */\n    :host([compact]) .mobile-panel {\n      display: none;\n    }\n\n    :host([compact]) .toggle {\n      display: inline-flex;\n    }\n\n    :host([compact][mobile-open]) .mobile-panel {\n      display: flex;\n      flex-direction: column;\n      gap: 2rem;\n      position: fixed;\n      inset: 0;\n      background: var(--st-color-surface);\n      padding: 5rem 1.5rem 2rem;\n      overflow-y: auto;\n      z-index: 1001;\n      animation: st-header-fade-in 0.3s ease;\n    }\n\n    :host([compact][mobile-open]) .menu-row,\n    :host([compact][mobile-open]) .utility-row {\n      flex-direction: column;\n      align-items: stretch;\n      gap: 1.5rem;\n      margin-left: 0;\n    }\n\n    :host([compact][mobile-open]) .utility-row {\n      padding: 1.5rem 0 0;\n      border-left: 0;\n      border-top: 1px solid var(--st-color-border);\n    }\n\n    :host([compact][mobile-open]) ::slotted([slot='menu']),\n    :host([compact][mobile-open]) ::slotted([slot='utility']) {\n      flex-direction: column !important;\n      align-items: stretch !important;\n      margin: 0 !important;\n    }\n\n    @media (prefers-reduced-motion: reduce) {\n      :host,\n      .mobile-panel {\n        animation: none !important;\n        transition: none !important;\n      }\n    }\n  `;\n\n  @property({ type: String })\n  title = '';\n\n  /** Optional logo image URL, shown before `title`. Omitted entirely when empty — none of this suite's apps has one today. Matches the source component's `imageSrc` (renamed here to pair with `title`/`logoHref`, since this component's only image use is the brand mark). */\n  @property({ type: String, attribute: 'brand-image-url' })\n  brandImageUrl = '';\n\n  /** `alt` text for the brand image — matches the source component's `altText` (default `'Logo'`). */\n  @property({ type: String, attribute: 'alt-text' })\n  altText = 'Logo';\n\n  /** Wraps the brand in an `<a>` when set (e.g. `/`); a plain non-link `<div>` otherwise. */\n  @property({ type: String })\n  logoHref = '';\n\n  /** `target` for the brand `<a>` — matches the source component's `logoTarget` (default `_self`). No effect when `logoHref` isn't set. */\n  @property({ type: String, attribute: 'logo-target' })\n  logoTarget = '_self';\n\n  /** Extra class(es) appended to the brand link/div — matches the source component's `logoClassName`. */\n  @property({ type: String, attribute: 'logo-class-name' })\n  logoClassName = '';\n\n  /** Inverts the header's color roles (light-on-dark instead of dark-on-light) — matches the\n   * source component's `inverted` (from its shared `BaseProps`). */\n  @property({ type: Boolean, reflect: true })\n  inverted = false;\n\n  @property({ type: Boolean, reflect: true })\n  sticky = false;\n\n  /**\n   * Fixes the header over the top of the page and makes it see-through, with light text\n   * (`--st-header-transparent-color`), until the page scrolls past `scroll-threshold` — for a\n   * header laid over a dark hero. It then takes its normal background and a shadow. The page\n   * content starts under it, so the first section should leave room for the 64px bar.\n   */\n  @property({ type: Boolean, reflect: true })\n  transparent = false;\n\n  /** Slides the header out of view while the page scrolls down and back in when it scrolls up. */\n  @property({ type: Boolean, reflect: true, attribute: 'hide-on-scroll' })\n  hideOnScroll = false;\n\n  /** Scroll distance in px after which the header counts as `scrolled`. */\n  @property({ type: Number, attribute: 'scroll-threshold' })\n  scrollThreshold = 8;\n\n  /** True once the page has scrolled past `scroll-threshold`; reflected so pages can style `st-header[scrolled]`. Set by the header, never from outside. */\n  @property({ type: Boolean, reflect: true })\n  scrolled = false;\n\n  /** True while `hide-on-scroll` has slid the header away. Set by the header, never from outside. */\n  @property({ type: Boolean, reflect: true, attribute: 'scroll-hidden' })\n  scrollHidden = false;\n\n  private lastScrollY = 0;\n  private scrollFrame = 0;\n\n  private onScroll = (): void => {\n    if (this.scrollFrame) return;\n    this.scrollFrame = requestAnimationFrame(() => {\n      this.scrollFrame = 0;\n      const y = Math.max(0, window.scrollY);\n      this.scrolled = y > this.scrollThreshold;\n      if (this.hideOnScroll) {\n        const delta = y - this.lastScrollY;\n        // Ignore tiny jitters; never hide while still at the top of the page or with the menu open.\n        if (Math.abs(delta) > 4) this.scrollHidden = delta > 0 && y > this.offsetHeight && !this.mobileOpen;\n      } else {\n        this.scrollHidden = false;\n      }\n      this.lastScrollY = y;\n    });\n  };\n\n  /**\n   * Language switcher options, e.g. `[{ code: 'en', label: 'English' }, ...]` — hidden entirely\n   * when empty or when only one language is offered (same convention as `st-app-header`'s\n   * `languages`, which this reuses verbatim). This component has no translation logic itself —\n   * selecting an option fires `language-change` (detail: `{ code }`), and the consuming app owns\n   * what `code` actually means and which content it re-renders.\n   */\n  @property({ attribute: false })\n  languages: { code: string; label: string }[] = [];\n\n  @property({ type: String, attribute: 'current-language-code' })\n  currentLanguageCode = '';\n\n  @property({ type: String, attribute: 'language-menu-label' })\n  languageMenuLabel = 'Language';\n\n  /** Internal open/closed state for the mobile nav overlay, reflected to an attribute purely so\n   * the `:host([mobile-open])` CSS selector above can react to it — not meant to be set from\n   * outside. */\n  @property({ type: Boolean, reflect: true, attribute: 'mobile-open' })\n  mobileOpen = false;\n\n  /** True while the menu doesn't fit the bar at the current width: the header then shows the same\n   * hamburger layout it uses on a narrow screen. Set by `evaluateFit`, never from outside. */\n  @property({ type: Boolean, reflect: true })\n  compact = false;\n\n  @state() private languageMenuOpen = false;\n\n  /** Whether `slot=\"utility\"` has content — an empty utility row (and its divider) is hidden. */\n  @state() private hasUtility = false;\n\n  /** Whether `slot=\"brand-extra\"` has content — an empty one takes no room beside the brand. */\n  @state() private hasBrandExtra = false;\n\n  private resizeObserver?: ResizeObserver;\n\n  /** Matches below BREAKPOINT_TABLET, where the hamburger layout is always on. */\n  private narrowQuery?: MediaQueryList;\n\n  /** The dropdowns this header switched to `inline` — only these are switched back, so a caller's\n   * own `inline` setting is left alone. */\n  private inlinedDropdowns = new Set<HTMLElement & { inline: boolean; open: boolean }>();\n\n  /** While the hamburger layout is on, the dropdowns in the header open in the flow of the\n   * full-screen panel instead of floating over it (SankhyaUI's touch-device layout). */\n  private syncInlineDropdowns = (): void => {\n    const collapsed = this.compact || !!this.narrowQuery?.matches;\n    const dropdowns = Array.from(this.querySelectorAll('st-dropdown')) as (HTMLElement & { inline: boolean; open: boolean })[];\n    if (collapsed) {\n      for (const dropdown of dropdowns) {\n        if (dropdown.inline) continue;\n        dropdown.inline = true;\n        this.inlinedDropdowns.add(dropdown);\n      }\n    } else {\n      for (const dropdown of this.inlinedDropdowns) dropdown.inline = false;\n      this.inlinedDropdowns.clear();\n    }\n  };\n\n  private onBrandExtraSlotChange = (event: Event): void => {\n    this.hasBrandExtra = (event.target as HTMLSlotElement).assignedElements({ flatten: true }).length > 0;\n    this.evaluateFit();\n  };\n\n  private onUtilitySlotChange = (event: Event): void => {\n    this.hasUtility = (event.target as HTMLSlotElement).assignedElements({ flatten: true }).length > 0;\n    this.evaluateFit();\n  };\n\n  private onMenuSlotChange = (): void => {\n    this.evaluateFit();\n    this.syncInlineDropdowns();\n  };\n\n  protected updated(changed: Map<string, unknown>): void {\n    if (changed.has('compact')) this.syncInlineDropdowns();\n    // A mega dropdown's drill-down panel would otherwise still cover the menu next time it opens.\n    if (changed.has('mobileOpen') && !this.mobileOpen) {\n      for (const dropdown of this.inlinedDropdowns) dropdown.open = false;\n    }\n  }\n\n  /** The bar width at which the menu last overflowed — the bar only expands again once it is\n   * clearly wider than this, so it can't flip back and forth right at the threshold. */\n  private collapsedAtWidth = 0;\n\n  /** Collapses to the hamburger layout when the slotted menu overflows its row, and expands again\n   * once there is room. The collapsed layout hides the menu, so the room it needs can't be\n   * measured then; the width remembered when it collapsed stands in for it. */\n  private evaluateFit = (): void => {\n    const width = this.clientWidth;\n    if (this.compact) {\n      if (width > this.collapsedAtWidth + 24) {\n        this.compact = false;\n        this.mobileOpen = false;\n        void this.updateComplete.then(this.evaluateFit);\n      }\n      return;\n    }\n    if (this.menuOverflows()) {\n      this.collapsedAtWidth = width;\n      this.compact = true;\n    }\n  };\n\n  /** Whether the visible menu items reach past the right edge of the menu row. Measured from the\n   * items' own boxes (the slotted elements and their direct children), not the row's scrollWidth:\n   * a closed dropdown's absolutely positioned panel also counts towards scrollWidth, which would\n   * report overflow at any width. */\n  private menuOverflows(): boolean {\n    const row = this.renderRoot.querySelector<HTMLElement>('.menu-row');\n    const slot = this.renderRoot.querySelector<HTMLSlotElement>('slot[name=\"menu\"]');\n    if (!row || !slot) return false;\n    const limit = row.getBoundingClientRect().right + 1;\n    let right = 0;\n    for (const el of slot.assignedElements({ flatten: true })) {\n      for (const box of [el, ...Array.from(el.children)]) {\n        const rect = box.getBoundingClientRect();\n        if (rect.width > 0) right = Math.max(right, rect.right);\n      }\n    }\n    return right > limit;\n  }\n\n  protected firstUpdated(): void {\n    this.resizeObserver = new ResizeObserver(this.evaluateFit);\n    this.resizeObserver.observe(this);\n    this.evaluateFit();\n    this.syncInlineDropdowns();\n  }\n\n  connectedCallback(): void {\n    super.connectedCallback();\n    window.addEventListener('keydown', this.closeOnEscape);\n    window.addEventListener('click', this.closeLanguageMenuOnOutsideClick);\n    window.addEventListener('scroll', this.onScroll, { passive: true });\n    this.onScroll();\n    this.narrowQuery = window.matchMedia(`(max-width: ${BREAKPOINT_TABLET}px)`);\n    this.narrowQuery.addEventListener('change', this.syncInlineDropdowns);\n    // Menus often render their dropdowns after the header (e.g. once the user's role loads),\n    // deeper than a slotchange reports.\n    this.lightDomObserver = new MutationObserver(this.syncInlineDropdowns);\n    this.lightDomObserver.observe(this, { childList: true, subtree: true });\n  }\n\n  private lightDomObserver?: MutationObserver;\n\n  disconnectedCallback(): void {\n    this.lightDomObserver?.disconnect();\n    this.narrowQuery?.removeEventListener('change', this.syncInlineDropdowns);\n    this.resizeObserver?.disconnect();\n    window.removeEventListener('keydown', this.closeOnEscape);\n    window.removeEventListener('click', this.closeLanguageMenuOnOutsideClick);\n    window.removeEventListener('scroll', this.onScroll);\n    if (this.scrollFrame) cancelAnimationFrame(this.scrollFrame);\n    this.scrollFrame = 0;\n    super.disconnectedCallback();\n  }\n\n  private closeOnEscape = (event: KeyboardEvent): void => {\n    if (this.mobileOpen && event.key === 'Escape') this.mobileOpen = false;\n    if (this.languageMenuOpen && event.key === 'Escape') this.languageMenuOpen = false;\n  };\n\n  private closeLanguageMenuOnOutsideClick = (event: Event): void => {\n    if (this.languageMenuOpen && !event.composedPath().includes(this)) this.languageMenuOpen = false;\n  };\n\n  private renderLanguageMenu() {\n    if (this.languages.length < 2) return nothing;\n    const current = this.languages.find((lang) => lang.code === this.currentLanguageCode);\n    return html`\n      <div class=\"lang-menu\" part=\"language-menu\">\n        <button\n          part=\"language-menu-trigger\"\n          type=\"button\"\n          class=\"lang-trigger\"\n          aria-label=${this.languageMenuLabel}\n          aria-expanded=${this.languageMenuOpen}\n          @click=${(event: Event) => {\n            event.stopPropagation();\n            this.languageMenuOpen = !this.languageMenuOpen;\n          }}\n        >\n          <span part=\"language-menu-current\">${current?.label ?? this.languageMenuLabel}</span>\n          ${chevronIcon('down', 10)}\n        </button>\n        ${this.languageMenuOpen\n          ? html`\n              <div part=\"language-dropdown\" class=\"lang-dropdown\">\n                ${this.languages.map(\n                  (lang) => html`\n                    <button\n                      part=\"language-option\"\n                      type=\"button\"\n                      class=\"lang-option ${lang.code === this.currentLanguageCode ? 'active' : ''}\"\n                      aria-current=${lang.code === this.currentLanguageCode}\n                      @click=${() => this.onLanguageSelect(lang.code)}\n                    >\n                      ${lang.label}\n                    </button>\n                  `\n                )}\n              </div>\n            `\n          : nothing}\n      </div>\n    `;\n  }\n\n  private onLanguageSelect(code: string): void {\n    this.languageMenuOpen = false;\n    if (code === this.currentLanguageCode) return;\n    this.dispatchEvent(new CustomEvent<LanguageChangedEventDetail>('language-change', { detail: { code }, bubbles: true, composed: true }));\n  }\n\n  private renderBrand() {\n    const content = html`\n      ${this.brandImageUrl ? html`<img part=\"brand-mark\" class=\"brand-mark\" src=${this.brandImageUrl} alt=${this.altText} /> ` : nothing}\n      <span part=\"brand-title\" class=\"brand-title\">${this.title}</span>\n    `;\n    return this.logoHref\n      ? html`<a part=\"brand\" class=\"brand ${this.logoClassName}\" href=${this.logoHref} target=${this.logoTarget}>${content}</a>`\n      : html`<div part=\"brand\" class=\"brand ${this.logoClassName}\">${content}</div>`;\n  }\n\n  render() {\n    return html`\n      ${this.renderBrand()}\n      <div class=\"brand-extra ${this.hasBrandExtra ? '' : 'empty'}\" part=\"brand-extra\"><slot name=\"brand-extra\" @slotchange=${this.onBrandExtraSlotChange}></slot></div>\n\n      <div class=\"mobile-panel\" part=\"mobile-panel\" @click=${() => (this.mobileOpen = false)}>\n        <div class=\"menu-row\" part=\"menu-row\"><slot name=\"menu\" @slotchange=${this.onMenuSlotChange}></slot></div>\n        <div class=\"utility-row ${this.hasUtility || this.languages.length >= 2 ? '' : 'empty'}\" part=\"utility-row\">\n          ${this.renderLanguageMenu()}<slot name=\"utility\" @slotchange=${this.onUtilitySlotChange}></slot>\n        </div>\n      </div>\n\n      <button\n        part=\"toggle\"\n        type=\"button\"\n        class=\"toggle\"\n        aria-label=${this.mobileOpen ? 'Close menu' : 'Open menu'}\n        aria-expanded=${this.mobileOpen}\n        @click=${() => (this.mobileOpen = !this.mobileOpen)}\n      >\n        <slot name=\"menu-icon\" ?hidden=${this.mobileOpen}>${menuIcon()}</slot>\n        <slot name=\"close-icon\" ?hidden=${!this.mobileOpen}>${closeIcon()}</slot>\n      </button>\n    `;\n  }\n}\n"],"mappings":"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","names":[]}

package/dist/chunk-YQ42EBK5.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/icon-button/IconButton.ts"],"sourcesContent":["import { LitElement, css, html } from 'lit';\nimport { customElement, property } from 'lit/decorators.js';\n\nimport { buttonResetStyles, controlBaseStyles, rootFontFamilyStyles } from '../shared/styles';\n\n/**\n * A small, icon-only action button — ported from `SankhyaUI`'s React `IconButton` (a separate,\n * unrelated marketing-site project; that source takes an iconify string `icon` prop, this package\n * has no iconify dependency, so the icon is default-slotted content instead, same convention as\n * `st-dropdown`/`st-menu-grid-item`'s `slot=\"icon\"`).\n *\n * Fires a plain native `click` — no custom event, since a caller just wants an ordinary button.\n */\n@customElement('st-icon-button')\nexport class IconButton extends LitElement {\n  static styles = css`\n    ${controlBaseStyles}\n\n    :host {\n      display: inline-flex;\n      ${rootFontFamilyStyles}\n    }\n\n    button {\n      ${buttonResetStyles}\n      display: inline-flex;\n      align-items: center;\n      justify-content: center;\n      width: var(--st-size-32);\n      height: var(--st-size-32);\n      border-radius: var(--st-radius-sm);\n      color: var(--st-color-text-muted);\n    }\n\n    button:hover {\n      background: var(--st-color-hover);\n      color: var(--st-color-text-strong);\n    }\n\n    :host([disabled]) button {\n      color: var(--st-color-text-muted);\n      cursor: not-allowed;\n      pointer-events: none;\n    }\n  `;\n\n  /** Accessible name and tooltip — matches the source component's `ariaLabel` (renamed: modern\n   * browsers already expose a native `ariaLabel` reflected property on every `Element`, so reusing\n   * that exact name as a Lit reactive property would shadow it). Required for a control with no\n   * visible text. */\n  @property({ type: String })\n  label = '';\n\n  @property({ type: Boolean, reflect: true })\n  disabled = false;\n\n  render() {\n    return html`\n      <button part=\"button\" type=\"button\" aria-label=${this.label} title=${this.label} ?disabled=${this.disabled}>\n        <slot></slot>\n      </button>\n    `;\n  }\n}\n"],"mappings":";;;;;;;;;;AAAA,SAAS,YAAY,KAAK,YAAY;AACtC,SAAS,eAAe,gBAAgB;AAajC,IAAM,aAAN,cAAyB,WAAW;AAAA,EAApC;AAAA;AAqCL,iBAAQ;AAGR,oBAAW;AAAA;AAAA,EAEX,SAAS;AACP,WAAO;AAAA,uDAC4C,KAAK,KAAK,UAAU,KAAK,KAAK,cAAc,KAAK,QAAQ;AAAA;AAAA;AAAA;AAAA,EAI9G;AACF;AAjDa,WACJ,SAAS;AAAA,MACZ,iBAAiB;AAAA;AAAA;AAAA;AAAA,QAIf,oBAAoB;AAAA;AAAA;AAAA;AAAA,QAIpB,iBAAiB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AA2BvB;AAAA,EADC,SAAS,EAAE,MAAM,OAAO,CAAC;AAAA,GApCf,WAqCX;AAGA;AAAA,EADC,SAAS,EAAE,MAAM,SAAS,SAAS,KAAK,CAAC;AAAA,GAvC/B,WAwCX;AAxCW,aAAN;AAAA,EADN,cAAc,gBAAgB;AAAA,GAClB;","names":[]}