@sankhyatronics/sankhya-cms 0.1.18 → 0.3.0

package/dist/chunk-XWB4CKDU.js

@@ -1,708 +0,0 @@
-import {
-  chevronIcon,
-  closeIcon,
-  menuIcon
-} from "./chunk-WTD2YIAA.js";
-import {
-  BREAKPOINT_TABLET,
-  buttonResetStyles,
-  controlBaseStyles,
-  dropdownPanelStyles,
-  rootFontFamilyStyles
-} from "./chunk-KMU6ABQF.js";
-import {
-  __decorateClass
-} from "./chunk-EUXUH3YW.js";
-
-// src/header/Header.ts
-import { LitElement, css, html, nothing } from "lit";
-import { customElement, property, state } from "lit/decorators.js";
-var Header = class extends LitElement {
-  constructor() {
-    super(...arguments);
-    this.title = "";
-    this.brandImageUrl = "";
-    this.altText = "Logo";
-    this.logoHref = "";
-    this.logoTarget = "_self";
-    this.logoClassName = "";
-    this.inverted = false;
-    this.sticky = false;
-    this.transparent = false;
-    this.hideOnScroll = false;
-    this.scrollThreshold = 8;
-    this.scrolled = false;
-    this.scrollHidden = false;
-    this.lastScrollY = 0;
-    this.scrollFrame = 0;
-    this.onScroll = () => {
-      if (this.scrollFrame) return;
-      this.scrollFrame = requestAnimationFrame(() => {
-        this.scrollFrame = 0;
-        const y = Math.max(0, window.scrollY);
-        this.scrolled = y > this.scrollThreshold;
-        if (this.hideOnScroll) {
-          const delta = y - this.lastScrollY;
-          if (Math.abs(delta) > 4) this.scrollHidden = delta > 0 && y > this.offsetHeight && !this.mobileOpen;
-        } else {
-          this.scrollHidden = false;
-        }
-        this.lastScrollY = y;
-      });
-    };
-    this.languages = [];
-    this.currentLanguageCode = "";
-    this.languageMenuLabel = "Language";
-    this.mobileOpen = false;
-    this.compact = false;
-    this.languageMenuOpen = false;
-    this.hasUtility = false;
-    this.hasBrandExtra = false;
-    /** The dropdowns this header switched to `inline` — only these are switched back, so a caller's
-     * own `inline` setting is left alone. */
-    this.inlinedDropdowns = /* @__PURE__ */ new Set();
-    /** While the hamburger layout is on, the dropdowns in the header open in the flow of the
-     * full-screen panel instead of floating over it (SankhyaUI's touch-device layout). */
-    this.syncInlineDropdowns = () => {
-      const collapsed = this.compact || !!this.narrowQuery?.matches;
-      const dropdowns = Array.from(this.querySelectorAll("st-dropdown"));
-      if (collapsed) {
-        for (const dropdown of dropdowns) {
-          if (dropdown.inline) continue;
-          dropdown.inline = true;
-          this.inlinedDropdowns.add(dropdown);
-        }
-      } else {
-        for (const dropdown of this.inlinedDropdowns) dropdown.inline = false;
-        this.inlinedDropdowns.clear();
-      }
-    };
-    this.onBrandExtraSlotChange = (event) => {
-      this.hasBrandExtra = event.target.assignedElements({ flatten: true }).length > 0;
-      this.evaluateFit();
-    };
-    this.onUtilitySlotChange = (event) => {
-      this.hasUtility = event.target.assignedElements({ flatten: true }).length > 0;
-      this.evaluateFit();
-    };
-    this.onMenuSlotChange = () => {
-      this.evaluateFit();
-      this.syncInlineDropdowns();
-    };
-    /** The bar width at which the menu last overflowed — the bar only expands again once it is
-     * clearly wider than this, so it can't flip back and forth right at the threshold. */
-    this.collapsedAtWidth = 0;
-    /** Collapses to the hamburger layout when the slotted menu overflows its row, and expands again
-     * once there is room. The collapsed layout hides the menu, so the room it needs can't be
-     * measured then; the width remembered when it collapsed stands in for it. */
-    this.evaluateFit = () => {
-      const width = this.clientWidth;
-      if (this.compact) {
-        if (width > this.collapsedAtWidth + 24) {
-          this.compact = false;
-          this.mobileOpen = false;
-          void this.updateComplete.then(this.evaluateFit);
-        }
-        return;
-      }
-      if (this.menuOverflows()) {
-        this.collapsedAtWidth = width;
-        this.compact = true;
-      }
-    };
-    this.closeOnEscape = (event) => {
-      if (this.mobileOpen && event.key === "Escape") this.mobileOpen = false;
-      if (this.languageMenuOpen && event.key === "Escape") this.languageMenuOpen = false;
-    };
-    this.closeLanguageMenuOnOutsideClick = (event) => {
-      if (this.languageMenuOpen && !event.composedPath().includes(this)) this.languageMenuOpen = false;
-    };
-  }
-  updated(changed) {
-    if (changed.has("compact")) this.syncInlineDropdowns();
-    if (changed.has("mobileOpen") && !this.mobileOpen) {
-      for (const dropdown of this.inlinedDropdowns) dropdown.open = false;
-    }
-  }
-  /** Whether the visible menu items reach past the right edge of the menu row. Measured from the
-   * items' own boxes (the slotted elements and their direct children), not the row's scrollWidth:
-   * a closed dropdown's absolutely positioned panel also counts towards scrollWidth, which would
-   * report overflow at any width. */
-  menuOverflows() {
-    const row = this.renderRoot.querySelector(".menu-row");
-    const slot = this.renderRoot.querySelector('slot[name="menu"]');
-    if (!row || !slot) return false;
-    const limit = row.getBoundingClientRect().right + 1;
-    let right = 0;
-    for (const el of slot.assignedElements({ flatten: true })) {
-      for (const box of [el, ...Array.from(el.children)]) {
-        const rect = box.getBoundingClientRect();
-        if (rect.width > 0) right = Math.max(right, rect.right);
-      }
-    }
-    return right > limit;
-  }
-  firstUpdated() {
-    this.resizeObserver = new ResizeObserver(this.evaluateFit);
-    this.resizeObserver.observe(this);
-    this.evaluateFit();
-    this.syncInlineDropdowns();
-  }
-  connectedCallback() {
-    super.connectedCallback();
-    window.addEventListener("keydown", this.closeOnEscape);
-    window.addEventListener("click", this.closeLanguageMenuOnOutsideClick);
-    window.addEventListener("scroll", this.onScroll, { passive: true });
-    this.onScroll();
-    this.narrowQuery = window.matchMedia(`(max-width: ${BREAKPOINT_TABLET}px)`);
-    this.narrowQuery.addEventListener("change", this.syncInlineDropdowns);
-    this.lightDomObserver = new MutationObserver(this.syncInlineDropdowns);
-    this.lightDomObserver.observe(this, { childList: true, subtree: true });
-  }
-  disconnectedCallback() {
-    this.lightDomObserver?.disconnect();
-    this.narrowQuery?.removeEventListener("change", this.syncInlineDropdowns);
-    this.resizeObserver?.disconnect();
-    window.removeEventListener("keydown", this.closeOnEscape);
-    window.removeEventListener("click", this.closeLanguageMenuOnOutsideClick);
-    window.removeEventListener("scroll", this.onScroll);
-    if (this.scrollFrame) cancelAnimationFrame(this.scrollFrame);
-    this.scrollFrame = 0;
-    super.disconnectedCallback();
-  }
-  renderLanguageMenu() {
-    if (this.languages.length < 2) return nothing;
-    const current = this.languages.find((lang) => lang.code === this.currentLanguageCode);
-    return html`
-      <div class="lang-menu" part="language-menu">
-        <button
-          part="language-menu-trigger"
-          type="button"
-          class="lang-trigger"
-          aria-label=${this.languageMenuLabel}
-          aria-expanded=${this.languageMenuOpen}
-          @click=${(event) => {
-      event.stopPropagation();
-      this.languageMenuOpen = !this.languageMenuOpen;
-    }}
-        >
-          <span part="language-menu-current">${current?.label ?? this.languageMenuLabel}</span>
-          ${chevronIcon("down", 10)}
-        </button>
-        ${this.languageMenuOpen ? html`
-              <div part="language-dropdown" class="lang-dropdown">
-                ${this.languages.map(
-      (lang) => html`
-                    <button
-                      part="language-option"
-                      type="button"
-                      class="lang-option ${lang.code === this.currentLanguageCode ? "active" : ""}"
-                      aria-current=${lang.code === this.currentLanguageCode}
-                      @click=${() => this.onLanguageSelect(lang.code)}
-                    >
-                      ${lang.label}
-                    </button>
-                  `
-    )}
-              </div>
-            ` : nothing}
-      </div>
-    `;
-  }
-  onLanguageSelect(code) {
-    this.languageMenuOpen = false;
-    if (code === this.currentLanguageCode) return;
-    this.dispatchEvent(new CustomEvent("language-change", { detail: { code }, bubbles: true, composed: true }));
-  }
-  renderBrand() {
-    const content = html`
-      ${this.brandImageUrl ? html`<img part="brand-mark" class="brand-mark" src=${this.brandImageUrl} alt=${this.altText} /> ` : nothing}
-      <span part="brand-title" class="brand-title">${this.title}</span>
-    `;
-    return this.logoHref ? html`<a part="brand" class="brand ${this.logoClassName}" href=${this.logoHref} target=${this.logoTarget}>${content}</a>` : html`<div part="brand" class="brand ${this.logoClassName}">${content}</div>`;
-  }
-  render() {
-    return html`
-      ${this.renderBrand()}
-      <div class="brand-extra ${this.hasBrandExtra ? "" : "empty"}" part="brand-extra"><slot name="brand-extra" @slotchange=${this.onBrandExtraSlotChange}></slot></div>
-
-      <div class="mobile-panel" part="mobile-panel" @click=${() => this.mobileOpen = false}>
-        <div class="menu-row" part="menu-row"><slot name="menu" @slotchange=${this.onMenuSlotChange}></slot></div>
-        <div class="utility-row ${this.hasUtility || this.languages.length >= 2 ? "" : "empty"}" part="utility-row">
-          ${this.renderLanguageMenu()}<slot name="utility" @slotchange=${this.onUtilitySlotChange}></slot>
-        </div>
-      </div>
-
-      <button
-        part="toggle"
-        type="button"
-        class="toggle"
-        aria-label=${this.mobileOpen ? "Close menu" : "Open menu"}
-        aria-expanded=${this.mobileOpen}
-        @click=${() => this.mobileOpen = !this.mobileOpen}
-      >
-        <slot name="menu-icon" ?hidden=${this.mobileOpen}>${menuIcon()}</slot>
-        <slot name="close-icon" ?hidden=${!this.mobileOpen}>${closeIcon()}</slot>
-      </button>
-    `;
-  }
-};
-Header.styles = css`
-    ${controlBaseStyles}
-
-    :host {
-      display: flex;
-      align-items: center;
-      /* The containing block of an st-dropdown[mega] panel, which spans the bar. */
-      position: relative;
-      /* Spacing between brand, menu and utility controls is the rows' own margins (SankhyaUI's
-         layout), not a flex gap. */
-      gap: 0;
-      /* !important on the box-model properties only: a shadow host's own :host rule always loses
-       * to ANY rule the consuming page has for the same property on that element, regardless of
-       * specificity (see st-footer's own padding/border-top for the same fix). Without
-       * box-sizing: border-box pinned here, a page that also sets its own padding on this host
-       * (e.g. a p-2 utility class) adds that padding on TOP of the fixed 64px height instead of
-       * being absorbed inside it — which is exactly what happens in Template Hub, the one app that
-       * doesn't load Tailwind Preflight (Preflight's own box-sizing: border-box reset is what
-       * silently keeps every other app's header at the intended 64px). */
-      box-sizing: border-box !important;
-      padding: 0 2rem !important;
-      height: 64px !important;
-      background: var(--st-color-surface);
-      border-bottom: 1px solid var(--st-color-border) !important;
-      ${rootFontFamilyStyles}
-      color: var(--st-color-text-strong);
-    }
-
-    :host([sticky]) {
-      position: sticky;
-      top: 0;
-      z-index: 100;
-    }
-
-    /* Toggle icons: a host's slotted icon, else the built-in glyph; only the current state's shows. */
-    .toggle slot {
-      display: contents;
-    }
-
-    .toggle slot[hidden] {
-      display: none;
-    }
-
-    .toggle ::slotted(*) {
-      flex: none;
-      width: var(--st-header-toggle-icon-size, 20px);
-      height: var(--st-header-toggle-icon-size, 20px);
-    }
-
-    :host([inverted]) {
-      background: var(--st-color-text-strong);
-      color: var(--st-color-on-solid);
-      border-bottom-color: transparent;
-    }
-
-    :host([sticky]),
-    :host([transparent]),
-    :host([hide-on-scroll]) {
-      transition:
-        background-color 0.3s ease,
-        color 0.3s ease,
-        box-shadow 0.3s ease,
-        border-color 0.3s ease,
-        transform 0.3s ease;
-    }
-
-    /* Once the page has scrolled, a sticky/fixed header lifts off the content. */
-    :host([scrolled][sticky]),
-    :host([scrolled][transparent]),
-    :host([scrolled][hide-on-scroll]) {
-      box-shadow: 0 4px 16px var(--st-shadow-color-md);
-      border-bottom-color: transparent !important;
-    }
-
-    /* transparent: fixed over the top of the page (e.g. a dark hero), see-through until scrolled. */
-    :host([transparent]) {
-      position: fixed;
-      top: 0;
-      left: 0;
-      right: 0;
-      z-index: 100;
-    }
-
-    :host([transparent]:not([scrolled]):not([mobile-open])) {
-      background: transparent;
-      border-bottom-color: transparent !important;
-      color: var(--st-header-transparent-color, var(--st-color-on-solid));
-      /* Read by st-menu-item / st-dropdown triggers in the bar (their panels reset them). */
-      --st-nav-color: var(--st-header-transparent-color, var(--st-color-on-solid));
-      --st-nav-hover-bg: color-mix(in oklch, currentColor 14%, transparent);
-    }
-
-    :host([transparent]:not([scrolled]):not([mobile-open])) .utility-row {
-      border-left-color: color-mix(in oklch, currentColor 35%, transparent);
-    }
-
-    :host([transparent]:not([scrolled]):not([mobile-open])) .lang-trigger {
-      color: inherit;
-    }
-
-    :host([transparent]:not([scrolled]):not([mobile-open])) .lang-trigger:hover,
-    :host([transparent]:not([scrolled]):not([mobile-open])) .toggle:hover {
-      background: color-mix(in oklch, currentColor 14%, transparent);
-    }
-
-    /* hide-on-scroll: slides away while scrolling down, back as soon as the user scrolls up. */
-    :host([hide-on-scroll]:not([sticky]):not([transparent])) {
-      position: sticky;
-      top: 0;
-      z-index: 100;
-    }
-
-    :host([scroll-hidden]:not([mobile-open])) {
-      transform: translateY(-100%);
-      box-shadow: none;
-    }
-
-    .brand {
-      display: flex;
-      align-items: center;
-      gap: var(--st-space-10);
-      flex: none;
-      text-decoration: none;
-      color: inherit;
-    }
-
-    .brand-mark {
-      width: var(--st-size-28);
-      height: var(--st-size-28);
-      border-radius: var(--st-radius-sm);
-      flex: none;
-      object-fit: contain;
-    }
-
-    .brand-title {
-      font-size: var(--st-text-xl);
-      font-weight: var(--st-font-weight-bold);
-      letter-spacing: var(--st-tracking-tight);
-      white-space: nowrap;
-    }
-
-    /* Optional slot="brand-extra" (e.g. an edition badge) right after the brand. Outside the
-       mobile panel, so it stays beside the logo at every width; no box at all when empty. */
-    .brand-extra {
-      display: flex;
-      align-items: center;
-      gap: var(--st-space-8);
-      flex: none;
-      margin-left: var(--st-space-10);
-      white-space: nowrap;
-    }
-
-    .brand-extra.empty {
-      display: none;
-    }
-
-    /* Desktop: a transparent pass-through so .menu-row/.utility-row lay out directly as :host's
-       own flex children. Mobile (see below) turns this into the actual overlay box. */
-    .mobile-panel {
-      display: contents;
-    }
-
-    /* Desktop layout from SankhyaUI's Header: the menu starts 4rem after the brand and takes the
-       free width; the utility controls sit after a vertical divider. Between 901px and 1200px the
-       gaps tighten so the menu still fits down to the 900px hamburger breakpoint. */
-    .menu-row {
-      flex: 1;
-      display: flex;
-      align-items: center;
-      gap: 1.5rem;
-      min-width: 0;
-      margin-left: 4rem;
-    }
-
-    .utility-row {
-      flex: none;
-      display: flex;
-      align-items: center;
-      gap: 1rem;
-      margin-left: 1.5rem;
-      padding-left: 1.5rem;
-      border-left: 1px solid var(--st-color-border);
-    }
-
-    :host([inverted]) .utility-row {
-      border-left-color: currentColor;
-    }
-
-    .utility-row.empty {
-      display: none;
-    }
-
-    @media (max-width: 1200px) {
-      :host {
-        padding: 0 1rem !important;
-      }
-
-      .menu-row {
-        margin-left: 0.5rem;
-      }
-
-      .utility-row {
-        margin-left: 0.5rem;
-        padding-left: 0.5rem;
-      }
-    }
-
-    @keyframes st-header-fade-in {
-      from {
-        opacity: 0;
-      }
-      to {
-        opacity: 1;
-      }
-    }
-
-    .toggle {
-      display: none;
-      align-items: center;
-      justify-content: center;
-      flex: none;
-      position: relative;
-      z-index: 1002;
-      width: var(--st-size-32);
-      height: var(--st-size-32);
-      margin-left: auto;
-      padding: 0.5rem;
-      border: 0;
-      border-radius: var(--st-radius-sm);
-      background: transparent;
-      color: inherit;
-      cursor: pointer;
-    }
-
-    .toggle:hover {
-      background: var(--st-color-hover);
-    }
-
-    .lang-menu {
-      position: relative;
-      flex: none;
-    }
-
-    .lang-trigger {
-      ${buttonResetStyles}
-      display: flex;
-      align-items: center;
-      gap: var(--st-space-4);
-      height: var(--st-size-32);
-      padding: 0 var(--st-space-8);
-      border-radius: var(--st-radius-sm);
-      font-size: var(--st-text-base);
-      font-weight: var(--st-font-weight-semibold);
-      color: var(--st-color-text-muted);
-    }
-
-    .lang-trigger:hover {
-      background: var(--st-color-hover);
-      color: var(--st-color-text-strong);
-    }
-
-    .lang-dropdown {
-      ${dropdownPanelStyles}
-      min-width: 140px;
-    }
-
-    .lang-option {
-      ${buttonResetStyles}
-      display: block;
-      width: 100%;
-      padding: var(--st-space-10) var(--st-space-14);
-      font-size: var(--st-text-base);
-      font-weight: var(--st-font-weight-semibold);
-      text-align: left;
-      color: inherit;
-    }
-
-    .lang-option:hover {
-      background: var(--st-color-hover);
-    }
-
-    .lang-option.active {
-      color: var(--st-color-accent-text);
-    }
-
-    /* Hamburger layout from SankhyaUI's Header: a full-screen layer under the toggle, menu above
-       the utility controls, the menu's dropdowns opening in the flow (see syncInlineDropdowns). */
-    @media (max-width: ${BREAKPOINT_TABLET}px) {
-      :host {
-        padding: 0 1rem !important;
-      }
-
-      .mobile-panel {
-        display: none;
-      }
-
-      .toggle {
-        display: inline-flex;
-      }
-
-      :host([mobile-open]) .mobile-panel {
-        display: flex;
-        flex-direction: column;
-        gap: 2rem;
-        position: fixed;
-        inset: 0;
-        background: var(--st-color-surface);
-        padding: 5rem 1.5rem 2rem;
-        overflow-y: auto;
-        z-index: 1001;
-        animation: st-header-fade-in 0.3s ease;
-      }
-
-      :host([mobile-open]) .menu-row,
-      :host([mobile-open]) .utility-row {
-        flex-direction: column;
-        align-items: stretch;
-        gap: 1.5rem;
-        margin-left: 0;
-      }
-
-      :host([mobile-open]) .utility-row {
-        padding: 1.5rem 0 0;
-        border-left: 0;
-        border-top: 1px solid var(--st-color-border);
-      }
-
-      /* Apps usually slot one flex-row wrapper per slot; stack its items as the source does. */
-      :host([mobile-open]) ::slotted([slot='menu']),
-      :host([mobile-open]) ::slotted([slot='utility']) {
-        flex-direction: column !important;
-        align-items: stretch !important;
-        margin: 0 !important;
-      }
-    }
-
-    /* The same collapsed layout, switched on by script when the menu no longer fits the bar at
-       desktop width (see evaluateFit) — without it the menu spills over the utility controls. */
-    :host([compact]) .mobile-panel {
-      display: none;
-    }
-
-    :host([compact]) .toggle {
-      display: inline-flex;
-    }
-
-    :host([compact][mobile-open]) .mobile-panel {
-      display: flex;
-      flex-direction: column;
-      gap: 2rem;
-      position: fixed;
-      inset: 0;
-      background: var(--st-color-surface);
-      padding: 5rem 1.5rem 2rem;
-      overflow-y: auto;
-      z-index: 1001;
-      animation: st-header-fade-in 0.3s ease;
-    }
-
-    :host([compact][mobile-open]) .menu-row,
-    :host([compact][mobile-open]) .utility-row {
-      flex-direction: column;
-      align-items: stretch;
-      gap: 1.5rem;
-      margin-left: 0;
-    }
-
-    :host([compact][mobile-open]) .utility-row {
-      padding: 1.5rem 0 0;
-      border-left: 0;
-      border-top: 1px solid var(--st-color-border);
-    }
-
-    :host([compact][mobile-open]) ::slotted([slot='menu']),
-    :host([compact][mobile-open]) ::slotted([slot='utility']) {
-      flex-direction: column !important;
-      align-items: stretch !important;
-      margin: 0 !important;
-    }
-
-    @media (prefers-reduced-motion: reduce) {
-      :host,
-      .mobile-panel {
-        animation: none !important;
-        transition: none !important;
-      }
-    }
-  `;
-__decorateClass([
-  property({ type: String })
-], Header.prototype, "title", 2);
-__decorateClass([
-  property({ type: String, attribute: "brand-image-url" })
-], Header.prototype, "brandImageUrl", 2);
-__decorateClass([
-  property({ type: String, attribute: "alt-text" })
-], Header.prototype, "altText", 2);
-__decorateClass([
-  property({ type: String })
-], Header.prototype, "logoHref", 2);
-__decorateClass([
-  property({ type: String, attribute: "logo-target" })
-], Header.prototype, "logoTarget", 2);
-__decorateClass([
-  property({ type: String, attribute: "logo-class-name" })
-], Header.prototype, "logoClassName", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], Header.prototype, "inverted", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], Header.prototype, "sticky", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], Header.prototype, "transparent", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true, attribute: "hide-on-scroll" })
-], Header.prototype, "hideOnScroll", 2);
-__decorateClass([
-  property({ type: Number, attribute: "scroll-threshold" })
-], Header.prototype, "scrollThreshold", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], Header.prototype, "scrolled", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true, attribute: "scroll-hidden" })
-], Header.prototype, "scrollHidden", 2);
-__decorateClass([
-  property({ attribute: false })
-], Header.prototype, "languages", 2);
-__decorateClass([
-  property({ type: String, attribute: "current-language-code" })
-], Header.prototype, "currentLanguageCode", 2);
-__decorateClass([
-  property({ type: String, attribute: "language-menu-label" })
-], Header.prototype, "languageMenuLabel", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true, attribute: "mobile-open" })
-], Header.prototype, "mobileOpen", 2);
-__decorateClass([
-  property({ type: Boolean, reflect: true })
-], Header.prototype, "compact", 2);
-__decorateClass([
-  state()
-], Header.prototype, "languageMenuOpen", 2);
-__decorateClass([
-  state()
-], Header.prototype, "hasUtility", 2);
-__decorateClass([
-  state()
-], Header.prototype, "hasBrandExtra", 2);
-Header = __decorateClass([
-  customElement("st-header")
-], Header);
-
-export {
-  Header
-};
-//# sourceMappingURL=chunk-XWB4CKDU.js.map