@mdn/fred 1.9.7 → 2.0.0

package/out/static/client/{9204.23a90fff05405362.js → 9204.515db9110e143075.js}

@@ -1,8 +1,7 @@
 export const __rspack_esm_id="9204";export const __rspack_esm_ids=["9204"];export const __webpack_modules__={18150(e,a,t){t.d(a,{A:()=>p});var o=t(97825),c=t(31601),r=t.n(c),n=t(76314),l=t.n(n)()(r());l.push([e.id,':host{background-color:var(--color-background-primary);display:block}.top-placement,.top-placement-leaderboard{--place-top-background-light:var(--color-background-primary);--place-top-color-light:var(--color-text-primary);--place-top-cta-background-light:var(--color-text-primary);--place-top-cta-color-light:var(--color-background-secondary);--place-top-background-dark:var(--color-background-primary);--place-top-color-dark:var(--color-text-primary);--place-top-cta-background-dark:var(--color-text-primary);--place-top-cta-color-dark:var(--color-background-secondary);--csstools-light-dark-toggle-2c33ad20-0:var(--csstools-color-scheme--light) var(--place-top-color-dark);--place-top-color:var(--csstools-light-dark-toggle-2c33ad20-0,var(--place-top-color-light));--csstools-light-dark-toggle-2c33ad20-1:var(--csstools-color-scheme--light) var(--place-top-cta-background-dark);--place-top-cta-background:var(--csstools-light-dark-toggle-2c33ad20-1,var(--place-top-cta-background-light));--csstools-light-dark-toggle-2c33ad20-2:var(--csstools-color-scheme--light) var(--place-top-cta-color-dark);--place-top-cta-color:var(--csstools-light-dark-toggle-2c33ad20-2,var(--place-top-cta-color-light));background-color:var(--place-top-background);min-height:calc(var(--top-placement-inner-height) + var(--top-placement-inner-padding)*2);padding-inline:var(--layout-side-padding)}@supports (color:light-dark(red,red)){.top-placement,.top-placement-leaderboard{--place-top-color:light-dark(var(--place-top-color-light),var(--place-top-color-dark));--place-top-cta-background:light-dark(var(--place-top-cta-background-light),var(--place-top-cta-background-dark));--place-top-cta-color:light-dark(var(--place-top-cta-color-light),var(--place-top-cta-color-dark))}}@supports not (color:light-dark(tan,tan)){:is(.top-placement,.top-placement-leaderboard) *{--csstools-light-dark-toggle-2c33ad20-0:var(--csstools-color-scheme--light) var(--place-top-color-dark);--place-top-color:var(--csstools-light-dark-toggle-2c33ad20-0,var(--place-top-color-light));--csstools-light-dark-toggle-2c33ad20-1:var(--csstools-color-scheme--light) var(--place-top-cta-background-dark);--place-top-cta-background:var(--csstools-light-dark-toggle-2c33ad20-1,var(--place-top-cta-background-light));--csstools-light-dark-toggle-2c33ad20-2:var(--csstools-color-scheme--light) var(--place-top-cta-color-dark);--place-top-cta-color:var(--csstools-light-dark-toggle-2c33ad20-2,var(--place-top-cta-color-light))}}.top-placement{--csstools-light-dark-toggle-2c33ad20-3:var(--csstools-color-scheme--light) var(--place-top-background-dark);--place-top-background:var(--csstools-light-dark-toggle-2c33ad20-3,var(--place-top-background-light));--top-placement-inner-height:3.125rem;--top-placement-inner-padding:0.125rem;border-bottom:1px solid var(--color-border-primary);padding-bottom:.125rem}@supports (color:light-dark(red,red)){.top-placement{--place-top-background:light-dark(var(--place-top-background-light),var(--place-top-background-dark))}}@supports not (color:light-dark(tan,tan)){.top-placement *{--csstools-light-dark-toggle-2c33ad20-3:var(--csstools-color-scheme--light) var(--place-top-background-dark);--place-top-background:var(--csstools-light-dark-toggle-2c33ad20-3,var(--place-top-background-light))}}.top-placement .placement-container{align-items:center;display:grid;font-size:.75rem;grid-template-areas:"pong cta" "no note";height:100%;margin:0 auto;width:100%}@media (769px < width){.top-placement .placement-container{grid-template-areas:"pong cta note" "pong cta no";grid-template-columns:fit-content(100%) auto fit-content(100%)}}:is(.top-placement .placement-container) .placement-inner{border:none;display:contents;width:100%}:is(:is(.top-placement .placement-container) .placement-inner) .placement-link{display:contents}:is(:is(:is(.top-placement .placement-container) .placement-inner) .placement-link) .placement-content{align-items:center;color:var(--place-top-color);display:flex;flex-direction:row;grid-area:pong;padding:var(--top-placement-inner-padding);-webkit-text-decoration:none;text-decoration:none}:is(:is(:is(:is(.top-placement .placement-container) .placement-inner) .placement-link) .placement-content) img{height:var(--top-placement-inner-height);max-height:var(--top-placement-inner-height);width:auto}:is(:is(:is(:is(.top-placement .placement-container) .placement-inner) .placement-link) .placement-content) span{color:var(--place-top-color);max-height:var(--top-placement-inner-height);overflow:auto;padding:0 1rem}:is(:is(:is(.top-placement .placement-container) .placement-inner) .placement-link) .placement-cta{background-color:var(--place-top-cta-background);border-radius:.25rem;color:var(--place-top-cta-color);font-size:var(--font-size-small);grid-area:cta;height:fit-content;margin-right:auto;padding:.25rem 1rem;text-align:center}:is(:is(.top-placement .placement-container) .placement-inner) mdn-placement-note{grid-area:note;margin:.25rem 0 auto auto}:is(.top-placement .placement-container) mdn-placement-no{color:var(--place-top-color);grid-area:no;margin:auto 0 0 2rem;width:auto}.top-placement-leaderboard{--place-top-background:#0000;--top-placement-inner-height:5.625rem;--top-placement-inner-padding:0rem;padding-bottom:0}.top-placement-leaderboard .placement-container{align-items:center;display:grid;font-size:.75rem;grid-template-areas:"left pong note" "left pong no";grid-template-columns:1fr fit-content(100%) 1fr;height:100%;margin:0 auto;width:100%}:is(.top-placement-leaderboard .placement-container) .placement-inner{border:none;display:contents;width:100%}:is(:is(.top-placement-leaderboard .placement-container) .placement-inner) .placement-link{display:contents}:is(:is(:is(.top-placement-leaderboard .placement-container) .placement-inner) .placement-link) .placement-content{align-items:center;display:flex;flex-direction:column;grid-area:pong;justify-content:center;padding:0}:is(:is(:is(:is(.top-placement-leaderboard .placement-container) .placement-inner) .placement-link) .placement-content) img{height:5.625rem;width:45.5rem}:is(.top-placement-leaderboard .placement-container) mdn-placement-note{grid-area:note;margin:.25rem 0 auto auto}@media (width <= 992px){:is(.top-placement-leaderboard .placement-container) mdn-placement-note{display:none}}:is(.top-placement-leaderboard .placement-container) mdn-placement-no{color:var(--color-text-secondary);grid-area:no;margin:auto 0 .25rem auto}@media (width <= 992px){:is(.top-placement-leaderboard .placement-container) mdn-placement-no{display:none}}.top-placement.empty{border-bottom:none}.fallback{align-items:center;background-color:var(--color-background-secondary);border-bottom:1px solid var(--color-border-primary);display:flex;flex-direction:column;justify-content:center}.fallback__copy{color:var(--color-text-secondary);font-size:var(--font-size-normal);line-height:var(--top-banner-height);margin:0 auto}.fallback__copy a{color:var(--color-link-normal)}',""]);let p=(0,o.AH)([l.toString()])},9951(e,a,t){t.r(a),t.d(a,{MDNPlacementTop:()=>MDNPlacementTop});var o=t(97825),c=t(52258),r=t(5350);t(47764),t(13755);var n=t(30776),l=t(18150);let MDNPlacementTop=class MDNPlacementTop extends(0,n.N)(o.WF){static styles=l.A;renderInitial(){return(0,o.qy)`<div class="top-placement empty"></div>`}renderFallback(){return(0,o.qy)`
       <div class="fallback">
         <p class="fallback__copy">
-          Learn front-end development with high quality, interactive courses
-          from
+          Learn frontend, backend, and AI from our course partner
           <a
             href="https://scrimba.com/learn/frontend?via=mdn"
             target="_blank"
@@ -13,7 +12,7 @@ export const __rspack_esm_id="9204";export const __rspack_esm_ids=["9204"];expor
           </a>
         </p>
       </div>
-    `}renderComplete(e){if("noads"===e.status)return o.s6;let a=e?.hpTop||e?.top;if(!a)return this.renderFallback();let{status:t,click:n,view:l,copy:p,image:i,imageFormat:d,alt:s,cta:m,colors:g,version:h}=a;if("success"!==t)return this.renderFallback();this._viewedUrl||(this._viewedUrl=l,this._version=h);let{textColor:k,backgroundColor:v,ctaTextColor:b,ctaBackgroundColor:u,textColorDark:y,backgroundColorDark:f,ctaTextColorDark:_,ctaBackgroundColorDark:x}=g||{},$=Object.fromEntries([["--place-top-background-light",v],["--place-top-color-light",k],["--place-top-cta-background-light",u],["--place-top-cta-color-light",b],["--place-top-background-dark",f||v],["--place-top-color-dark",y||k],["--place-top-cta-background-dark",x||u],["--place-top-cta-color-dark",_||u]].filter(([e,a])=>!!a)),w="top-banner";return"leaderboard"===d?(0,o.qy)`<div
+    `}renderComplete(e){if("noads"===e.status)return o.s6;let a=e?.hpTop||e?.top;if(!a)return this.renderFallback();let{status:t,click:n,view:l,copy:p,image:i,imageFormat:d,alt:s,cta:m,colors:g,version:h}=a;if("success"!==t)return this.renderFallback();this._viewedUrl||(this._viewedUrl=l,this._version=h);let{textColor:k,backgroundColor:v,ctaTextColor:b,ctaBackgroundColor:u,textColorDark:f,backgroundColorDark:y,ctaTextColorDark:_,ctaBackgroundColorDark:x}=g||{},$=Object.fromEntries([["--place-top-background-light",v],["--place-top-color-light",k],["--place-top-cta-background-light",u],["--place-top-cta-color-light",b],["--place-top-background-dark",y||v],["--place-top-color-dark",f||k],["--place-top-cta-background-dark",x||u],["--place-top-cta-color-dark",_||u]].filter(([e,a])=>!!a)),w="top-banner";return"leaderboard"===d?(0,o.qy)`<div
           ${(0,c.K)(this._placementRef)}
           class="top-placement-leaderboard"
           style=${(0,r.W)($)}
@@ -69,4 +68,4 @@ export const __rspack_esm_id="9204";export const __rspack_esm_ids=["9204"];expor
             <mdn-placement-no></mdn-placement-no>
           </section>
         </div>`}};customElements.define("mdn-placement-top",MDNPlacementTop)}};
-//# sourceMappingURL=9204.23a90fff05405362.js.map
+//# sourceMappingURL=9204.515db9110e143075.js.map

package/out/static/client/{9204.23a90fff05405362.js.map → 9204.515db9110e143075.js.map}

@@ -1 +1 @@
-{"version":3,"file":"9204.23a90fff05405362.js","sources":["webpack://@mdn/fred/./components/placement-top/element.css","webpack://@mdn/fred/./components/placement-top/element.js"],"sourcesContent":["import { css } from \"lit\";\n// Imports\nimport ___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___ from \"../../node_modules/css-loader/dist/runtime/noSourceMaps.js\";\nimport ___CSS_LOADER_API_IMPORT___ from \"../../node_modules/css-loader/dist/runtime/api.js\";\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `:host{background-color:var(--color-background-primary);display:block}.top-placement,.top-placement-leaderboard{--place-top-background-light:var(--color-background-primary);--place-top-color-light:var(--color-text-primary);--place-top-cta-background-light:var(--color-text-primary);--place-top-cta-color-light:var(--color-background-secondary);--place-top-background-dark:var(--color-background-primary);--place-top-color-dark:var(--color-text-primary);--place-top-cta-background-dark:var(--color-text-primary);--place-top-cta-color-dark:var(--color-background-secondary);--csstools-light-dark-toggle-2c33ad20-0:var(--csstools-color-scheme--light) var(--place-top-color-dark);--place-top-color:var(--csstools-light-dark-toggle-2c33ad20-0,var(--place-top-color-light));--csstools-light-dark-toggle-2c33ad20-1:var(--csstools-color-scheme--light) var(--place-top-cta-background-dark);--place-top-cta-background:var(--csstools-light-dark-toggle-2c33ad20-1,var(--place-top-cta-background-light));--csstools-light-dark-toggle-2c33ad20-2:var(--csstools-color-scheme--light) var(--place-top-cta-color-dark);--place-top-cta-color:var(--csstools-light-dark-toggle-2c33ad20-2,var(--place-top-cta-color-light));background-color:var(--place-top-background);min-height:calc(var(--top-placement-inner-height) + var(--top-placement-inner-padding)*2);padding-inline:var(--layout-side-padding)}@supports (color:light-dark(red,red)){.top-placement,.top-placement-leaderboard{--place-top-color:light-dark(var(--place-top-color-light),var(--place-top-color-dark));--place-top-cta-background:light-dark(var(--place-top-cta-background-light),var(--place-top-cta-background-dark));--place-top-cta-color:light-dark(var(--place-top-cta-color-light),var(--place-top-cta-color-dark))}}@supports not (color:light-dark(tan,tan)){:is(.top-placement,.top-placement-leaderboard) *{--csstools-light-dark-toggle-2c33ad20-0:var(--csstools-color-scheme--light) var(--place-top-color-dark);--place-top-color:var(--csstools-light-dark-toggle-2c33ad20-0,var(--place-top-color-light));--csstools-light-dark-toggle-2c33ad20-1:var(--csstools-color-scheme--light) var(--place-top-cta-background-dark);--place-top-cta-background:var(--csstools-light-dark-toggle-2c33ad20-1,var(--place-top-cta-background-light));--csstools-light-dark-toggle-2c33ad20-2:var(--csstools-color-scheme--light) var(--place-top-cta-color-dark);--place-top-cta-color:var(--csstools-light-dark-toggle-2c33ad20-2,var(--place-top-cta-color-light))}}.top-placement{--csstools-light-dark-toggle-2c33ad20-3:var(--csstools-color-scheme--light) var(--place-top-background-dark);--place-top-background:var(--csstools-light-dark-toggle-2c33ad20-3,var(--place-top-background-light));--top-placement-inner-height:3.125rem;--top-placement-inner-padding:0.125rem;border-bottom:1px solid var(--color-border-primary);padding-bottom:.125rem}@supports (color:light-dark(red,red)){.top-placement{--place-top-background:light-dark(var(--place-top-background-light),var(--place-top-background-dark))}}@supports not (color:light-dark(tan,tan)){.top-placement *{--csstools-light-dark-toggle-2c33ad20-3:var(--csstools-color-scheme--light) var(--place-top-background-dark);--place-top-background:var(--csstools-light-dark-toggle-2c33ad20-3,var(--place-top-background-light))}}.top-placement .placement-container{align-items:center;display:grid;font-size:.75rem;grid-template-areas:\"pong cta\" \"no note\";height:100%;margin:0 auto;width:100%}@media (769px < width){.top-placement .placement-container{grid-template-areas:\"pong cta note\" \"pong cta no\";grid-template-columns:fit-content(100%) auto fit-content(100%)}}:is(.top-placement .placement-container) .placement-inner{border:none;display:contents;width:100%}:is(:is(.top-placement .placement-container) .placement-inner) .placement-link{display:contents}:is(:is(:is(.top-placement .placement-container) .placement-inner) .placement-link) .placement-content{align-items:center;color:var(--place-top-color);display:flex;flex-direction:row;grid-area:pong;padding:var(--top-placement-inner-padding);-webkit-text-decoration:none;text-decoration:none}:is(:is(:is(:is(.top-placement .placement-container) .placement-inner) .placement-link) .placement-content) img{height:var(--top-placement-inner-height);max-height:var(--top-placement-inner-height);width:auto}:is(:is(:is(:is(.top-placement .placement-container) .placement-inner) .placement-link) .placement-content) span{color:var(--place-top-color);max-height:var(--top-placement-inner-height);overflow:auto;padding:0 1rem}:is(:is(:is(.top-placement .placement-container) .placement-inner) .placement-link) .placement-cta{background-color:var(--place-top-cta-background);border-radius:.25rem;color:var(--place-top-cta-color);font-size:var(--font-size-small);grid-area:cta;height:fit-content;margin-right:auto;padding:.25rem 1rem;text-align:center}:is(:is(.top-placement .placement-container) .placement-inner) mdn-placement-note{grid-area:note;margin:.25rem 0 auto auto}:is(.top-placement .placement-container) mdn-placement-no{color:var(--place-top-color);grid-area:no;margin:auto 0 0 2rem;width:auto}.top-placement-leaderboard{--place-top-background:#0000;--top-placement-inner-height:5.625rem;--top-placement-inner-padding:0rem;padding-bottom:0}.top-placement-leaderboard .placement-container{align-items:center;display:grid;font-size:.75rem;grid-template-areas:\"left pong note\" \"left pong no\";grid-template-columns:1fr fit-content(100%) 1fr;height:100%;margin:0 auto;width:100%}:is(.top-placement-leaderboard .placement-container) .placement-inner{border:none;display:contents;width:100%}:is(:is(.top-placement-leaderboard .placement-container) .placement-inner) .placement-link{display:contents}:is(:is(:is(.top-placement-leaderboard .placement-container) .placement-inner) .placement-link) .placement-content{align-items:center;display:flex;flex-direction:column;grid-area:pong;justify-content:center;padding:0}:is(:is(:is(:is(.top-placement-leaderboard .placement-container) .placement-inner) .placement-link) .placement-content) img{height:5.625rem;width:45.5rem}:is(.top-placement-leaderboard .placement-container) mdn-placement-note{grid-area:note;margin:.25rem 0 auto auto}@media (width <= 992px){:is(.top-placement-leaderboard .placement-container) mdn-placement-note{display:none}}:is(.top-placement-leaderboard .placement-container) mdn-placement-no{color:var(--color-text-secondary);grid-area:no;margin:auto 0 .25rem auto}@media (width <= 992px){:is(.top-placement-leaderboard .placement-container) mdn-placement-no{display:none}}.top-placement.empty{border-bottom:none}.fallback{align-items:center;background-color:var(--color-background-secondary);border-bottom:1px solid var(--color-border-primary);display:flex;flex-direction:column;justify-content:center}.fallback__copy{color:var(--color-text-secondary);font-size:var(--font-size-normal);line-height:var(--top-banner-height);margin:0 auto}.fallback__copy a{color:var(--color-link-normal)}`, \"\"]);\n// Exports\nexport default css([___CSS_LOADER_EXPORT___.toString()]);\n","import { LitElement, html, nothing } from \"lit\";\nimport { ref } from \"lit/directives/ref.js\";\nimport { styleMap } from \"lit/directives/style-map.js\";\n\nimport \"../placement-note/element.js\";\nimport \"../placement-no/element.js\";\n\nimport { PlacementMixin } from \"../placement/mixin.js\";\n\nimport styles from \"./element.css?lit\";\n\n/**\n * @import * as Placements from \"../placement/types.js\";\n * @import { TemplateResult } from \"lit\";\n */\n\nexport class MDNPlacementTop extends PlacementMixin(LitElement) {\n  static styles = styles;\n\n  /**\n   *\n   * @returns {TemplateResult | symbol}\n   */\n  renderInitial() {\n    return html`<div class=\"top-placement empty\"></div>`;\n  }\n\n  renderFallback() {\n    return html`\n      <div class=\"fallback\">\n        <p class=\"fallback__copy\">\n          Learn front-end development with high quality, interactive courses\n          from\n          <a\n            href=\"https://scrimba.com/learn/frontend?via=mdn\"\n            target=\"_blank\"\n            rel=\"noreferrer\"\n            data-glean-id=\"banner_scrimba_click\"\n          >\n            Scrimba\n          </a>\n        </p>\n      </div>\n    `;\n  }\n\n  /**\n   *\n   * @param {Placements.PlacementContextData} placementContext\n   * @returns\n   */\n  renderComplete(placementContext) {\n    if (placementContext.status === \"noads\") {\n      return nothing;\n    }\n\n    const data = placementContext?.hpTop || placementContext?.top;\n    if (!data) {\n      return this.renderFallback();\n    }\n    const {\n      status,\n      click,\n      view,\n      copy,\n      image,\n      imageFormat,\n      alt,\n      cta,\n      colors,\n      version,\n    } = data;\n    if (status !== \"success\") {\n      return this.renderFallback();\n    }\n    if (!this._viewedUrl) {\n      this._viewedUrl = view;\n      this._version = version;\n    }\n    const {\n      textColor,\n      backgroundColor,\n      ctaTextColor,\n      ctaBackgroundColor,\n      textColorDark,\n      backgroundColorDark,\n      ctaTextColorDark,\n      ctaBackgroundColorDark,\n    } = colors || {};\n    const styles = Object.fromEntries(\n      [\n        [\"--place-top-background-light\", backgroundColor],\n        [\"--place-top-color-light\", textColor],\n        [\"--place-top-cta-background-light\", ctaBackgroundColor],\n        [\"--place-top-cta-color-light\", ctaTextColor],\n        [\"--place-top-background-dark\", backgroundColorDark || backgroundColor],\n        [\"--place-top-color-dark\", textColorDark || textColor],\n        [\n          \"--place-top-cta-background-dark\",\n          ctaBackgroundColorDark || ctaBackgroundColor,\n        ],\n        [\"--place-top-cta-color-dark\", ctaTextColorDark || ctaBackgroundColor],\n      ].filter(([_, v]) => Boolean(v)),\n    );\n    const type = \"top-banner\";\n\n    return imageFormat === \"leaderboard\"\n      ? html`<div\n          ${ref(this._placementRef)}\n          class=\"top-placement-leaderboard\"\n          style=${styleMap(styles)}\n          data-type=${type}\n        >\n          <section class=\"placement-container\">\n            <div class=\"placement-inner\">\n              <a\n                class=\"placement-link\"\n                data-glean-id=${`pong: pong->click ${type}`}\n                href=${this.clickLink(click, version)}\n                target=\"_blank\"\n                rel=\"sponsored\"\n                ><div class=\"placement-content\">\n                  <img\n                    src=${this.imgLink(image)}\n                    aria-hidden=${!alt}\n                    alt=${alt || \"\"}\n                    height=\"90\"\n                  />\n                </div>\n              </a>\n            </div>\n            <mdn-placement-note></mdn-placement-note>\n            <mdn-placement-no></mdn-placement-no>\n          </section>\n        </div>`\n      : html`<div\n          ${ref(this._placementRef)}\n          class=\"top-placement\"\n          style=${styleMap(styles)}\n          data-type=${type}\n        >\n          <section class=\"placement-container\">\n            <div class=\"placement-inner\">\n              <a\n                class=\"placement-link\"\n                data-glean-id=${`pong: pong->click ${type}`}\n                href=${this.clickLink(click, version)}\n                target=\"_blank\"\n                rel=\"sponsored\"\n                ><div class=\"placement-content\">\n                  <img\n                    src=${this.imgLink(image)}\n                    aria-hidden=${!alt}\n                    alt=${alt || \"\"}\n                    height=\"50\"\n                  /><span>${copy}</span>\n                </div>\n                <span class=\"placement-cta\">${cta}</span></a\n              >\n              <mdn-placement-note></mdn-placement-note>\n            </div>\n            <mdn-placement-no></mdn-placement-no>\n          </section>\n        </div>`;\n  }\n}\n\ncustomElements.define(\"mdn-placement-top\", MDNPlacementTop);\n"],"names":["MDNPlacementTop","i","Object","customElements"],"mappings":"yLAII,EAA0B,A,SAA4B,KAE1D,EAAwB,IAAI,CAAC,CAAC,EAAO,EAAE,CAAE,qzNAAszN,GAAG,EAEl2N,MAAe,SAAI,CAAC,EAAwB,QAAQ,GAAG,C,kJCQhD,IAAMA,gBAAN,MAAMA,uBAAwB,QAAe,IAAU,EAC5D,OAAO,OAAS,GAAM,AAAC,AAMvB,gBAAgB,CACd,MAAO,QAAI,CAAC,uCAAuC,CAAC,AACtD,CAEA,gBAAiB,CACf,MAAO,QAAI,CAAC;;;;;;;;;;;;;;;IAeZ,CAAC,AACH,CAOA,eAAe,CAAgB,CAAE,CAC/B,GAAI,AAA4B,UAA5B,EAAiB,MAAM,CACzB,OAAO,IAAO,CAGhB,IAAM,EAAO,GAAkB,OAAS,GAAkB,IAC1D,GAAI,CAAC,EACH,OAAO,IAAI,CAAC,cAAc,GAE5B,GAAM,CACJ,QAAM,CACN,OAAK,CACL,MAAI,CACJ,MAAI,CACJC,MAAAA,CAAK,CACL,aAAW,CACX,KAAG,CACH,KAAG,CACH,QAAM,CACN,SAAO,CACR,CAAG,EACJ,GAAI,AAAW,YAAX,EACF,OAAO,IAAI,CAAC,cAAc,EAEvB,KAAI,CAAC,UAAU,GAClB,IAAI,CAAC,UAAU,CAAG,EAClB,IAAI,CAAC,QAAQ,CAAG,GAElB,GAAM,CACJ,WAAS,CACT,iBAAe,CACf,cAAY,CACZ,oBAAkB,CAClB,eAAa,CACb,qBAAmB,CACnB,kBAAgB,CAChB,wBAAsB,CACvB,CAAG,GAAU,CAAC,EACT,EAASC,OAAO,WAAW,CAC/B,CACE,CAAC,+BAAgC,EAAgB,CACjD,CAAC,0BAA2B,EAAU,CACtC,CAAC,mCAAoC,EAAmB,CACxD,CAAC,8BAA+B,EAAa,CAC7C,CAAC,8BAA+B,GAAuB,EAAgB,CACvE,CAAC,yBAA0B,GAAiB,EAAU,CACtD,CACE,kCACA,GAA0B,EAC3B,CACD,CAAC,6BAA8B,GAAoB,EAAmB,CACvE,CAAC,MAAM,CAAC,CAAC,CAAC,EAAG,EAAE,GAAK,EAAQ,IAEzB,EAAO,aAEb,MAAO,AAAgB,gBAAhB,EACH,QAAI,CAAC;UACH,EAAE,QAAI,IAAI,CAAC,aAAa,EAAE;;gBAEpB,EAAE,QAAS,GAAQ;oBACf,EAAE,EAAK;;;;;;8BAMG,EAAE,CAAC,kBAAkB,EAAE,EAAK,CAAC,CAAC;qBACvC,EAAE,IAAI,CAAC,SAAS,CAAC,EAAO,GAAS;;;;;wBAK9B,EAAE,IAAI,CAAC,OAAO,CAACD,GAAO;gCACd,EAAE,CAAC,EAAI;wBACf,EAAE,GAAO,GAAG;;;;;;;;;cAStB,CAAC,CACP,QAAI,CAAC;UACH,EAAE,QAAI,IAAI,CAAC,aAAa,EAAE;;gBAEpB,EAAE,QAAS,GAAQ;oBACf,EAAE,EAAK;;;;;;8BAMG,EAAE,CAAC,kBAAkB,EAAE,EAAK,CAAC,CAAC;qBACvC,EAAE,IAAI,CAAC,SAAS,CAAC,EAAO,GAAS;;;;;wBAK9B,EAAE,IAAI,CAAC,OAAO,CAACA,GAAO;gCACd,EAAE,CAAC,EAAI;wBACf,EAAE,GAAO,GAAG;;0BAEV,EAAE,EAAK;;4CAEW,EAAE,EAAI;;;;;;cAMpC,CAAC,AACb,CACF,EAEAE,eAAe,MAAM,CAAC,oBAAqBH,gB"}
+{"version":3,"file":"9204.515db9110e143075.js","sources":["webpack://@mdn/fred/./components/placement-top/element.css","webpack://@mdn/fred/./components/placement-top/element.js"],"sourcesContent":["import { css } from \"lit\";\n// Imports\nimport ___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___ from \"../../node_modules/css-loader/dist/runtime/noSourceMaps.js\";\nimport ___CSS_LOADER_API_IMPORT___ from \"../../node_modules/css-loader/dist/runtime/api.js\";\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `:host{background-color:var(--color-background-primary);display:block}.top-placement,.top-placement-leaderboard{--place-top-background-light:var(--color-background-primary);--place-top-color-light:var(--color-text-primary);--place-top-cta-background-light:var(--color-text-primary);--place-top-cta-color-light:var(--color-background-secondary);--place-top-background-dark:var(--color-background-primary);--place-top-color-dark:var(--color-text-primary);--place-top-cta-background-dark:var(--color-text-primary);--place-top-cta-color-dark:var(--color-background-secondary);--csstools-light-dark-toggle-2c33ad20-0:var(--csstools-color-scheme--light) var(--place-top-color-dark);--place-top-color:var(--csstools-light-dark-toggle-2c33ad20-0,var(--place-top-color-light));--csstools-light-dark-toggle-2c33ad20-1:var(--csstools-color-scheme--light) var(--place-top-cta-background-dark);--place-top-cta-background:var(--csstools-light-dark-toggle-2c33ad20-1,var(--place-top-cta-background-light));--csstools-light-dark-toggle-2c33ad20-2:var(--csstools-color-scheme--light) var(--place-top-cta-color-dark);--place-top-cta-color:var(--csstools-light-dark-toggle-2c33ad20-2,var(--place-top-cta-color-light));background-color:var(--place-top-background);min-height:calc(var(--top-placement-inner-height) + var(--top-placement-inner-padding)*2);padding-inline:var(--layout-side-padding)}@supports (color:light-dark(red,red)){.top-placement,.top-placement-leaderboard{--place-top-color:light-dark(var(--place-top-color-light),var(--place-top-color-dark));--place-top-cta-background:light-dark(var(--place-top-cta-background-light),var(--place-top-cta-background-dark));--place-top-cta-color:light-dark(var(--place-top-cta-color-light),var(--place-top-cta-color-dark))}}@supports not (color:light-dark(tan,tan)){:is(.top-placement,.top-placement-leaderboard) *{--csstools-light-dark-toggle-2c33ad20-0:var(--csstools-color-scheme--light) var(--place-top-color-dark);--place-top-color:var(--csstools-light-dark-toggle-2c33ad20-0,var(--place-top-color-light));--csstools-light-dark-toggle-2c33ad20-1:var(--csstools-color-scheme--light) var(--place-top-cta-background-dark);--place-top-cta-background:var(--csstools-light-dark-toggle-2c33ad20-1,var(--place-top-cta-background-light));--csstools-light-dark-toggle-2c33ad20-2:var(--csstools-color-scheme--light) var(--place-top-cta-color-dark);--place-top-cta-color:var(--csstools-light-dark-toggle-2c33ad20-2,var(--place-top-cta-color-light))}}.top-placement{--csstools-light-dark-toggle-2c33ad20-3:var(--csstools-color-scheme--light) var(--place-top-background-dark);--place-top-background:var(--csstools-light-dark-toggle-2c33ad20-3,var(--place-top-background-light));--top-placement-inner-height:3.125rem;--top-placement-inner-padding:0.125rem;border-bottom:1px solid var(--color-border-primary);padding-bottom:.125rem}@supports (color:light-dark(red,red)){.top-placement{--place-top-background:light-dark(var(--place-top-background-light),var(--place-top-background-dark))}}@supports not (color:light-dark(tan,tan)){.top-placement *{--csstools-light-dark-toggle-2c33ad20-3:var(--csstools-color-scheme--light) var(--place-top-background-dark);--place-top-background:var(--csstools-light-dark-toggle-2c33ad20-3,var(--place-top-background-light))}}.top-placement .placement-container{align-items:center;display:grid;font-size:.75rem;grid-template-areas:\"pong cta\" \"no note\";height:100%;margin:0 auto;width:100%}@media (769px < width){.top-placement .placement-container{grid-template-areas:\"pong cta note\" \"pong cta no\";grid-template-columns:fit-content(100%) auto fit-content(100%)}}:is(.top-placement .placement-container) .placement-inner{border:none;display:contents;width:100%}:is(:is(.top-placement .placement-container) .placement-inner) .placement-link{display:contents}:is(:is(:is(.top-placement .placement-container) .placement-inner) .placement-link) .placement-content{align-items:center;color:var(--place-top-color);display:flex;flex-direction:row;grid-area:pong;padding:var(--top-placement-inner-padding);-webkit-text-decoration:none;text-decoration:none}:is(:is(:is(:is(.top-placement .placement-container) .placement-inner) .placement-link) .placement-content) img{height:var(--top-placement-inner-height);max-height:var(--top-placement-inner-height);width:auto}:is(:is(:is(:is(.top-placement .placement-container) .placement-inner) .placement-link) .placement-content) span{color:var(--place-top-color);max-height:var(--top-placement-inner-height);overflow:auto;padding:0 1rem}:is(:is(:is(.top-placement .placement-container) .placement-inner) .placement-link) .placement-cta{background-color:var(--place-top-cta-background);border-radius:.25rem;color:var(--place-top-cta-color);font-size:var(--font-size-small);grid-area:cta;height:fit-content;margin-right:auto;padding:.25rem 1rem;text-align:center}:is(:is(.top-placement .placement-container) .placement-inner) mdn-placement-note{grid-area:note;margin:.25rem 0 auto auto}:is(.top-placement .placement-container) mdn-placement-no{color:var(--place-top-color);grid-area:no;margin:auto 0 0 2rem;width:auto}.top-placement-leaderboard{--place-top-background:#0000;--top-placement-inner-height:5.625rem;--top-placement-inner-padding:0rem;padding-bottom:0}.top-placement-leaderboard .placement-container{align-items:center;display:grid;font-size:.75rem;grid-template-areas:\"left pong note\" \"left pong no\";grid-template-columns:1fr fit-content(100%) 1fr;height:100%;margin:0 auto;width:100%}:is(.top-placement-leaderboard .placement-container) .placement-inner{border:none;display:contents;width:100%}:is(:is(.top-placement-leaderboard .placement-container) .placement-inner) .placement-link{display:contents}:is(:is(:is(.top-placement-leaderboard .placement-container) .placement-inner) .placement-link) .placement-content{align-items:center;display:flex;flex-direction:column;grid-area:pong;justify-content:center;padding:0}:is(:is(:is(:is(.top-placement-leaderboard .placement-container) .placement-inner) .placement-link) .placement-content) img{height:5.625rem;width:45.5rem}:is(.top-placement-leaderboard .placement-container) mdn-placement-note{grid-area:note;margin:.25rem 0 auto auto}@media (width <= 992px){:is(.top-placement-leaderboard .placement-container) mdn-placement-note{display:none}}:is(.top-placement-leaderboard .placement-container) mdn-placement-no{color:var(--color-text-secondary);grid-area:no;margin:auto 0 .25rem auto}@media (width <= 992px){:is(.top-placement-leaderboard .placement-container) mdn-placement-no{display:none}}.top-placement.empty{border-bottom:none}.fallback{align-items:center;background-color:var(--color-background-secondary);border-bottom:1px solid var(--color-border-primary);display:flex;flex-direction:column;justify-content:center}.fallback__copy{color:var(--color-text-secondary);font-size:var(--font-size-normal);line-height:var(--top-banner-height);margin:0 auto}.fallback__copy a{color:var(--color-link-normal)}`, \"\"]);\n// Exports\nexport default css([___CSS_LOADER_EXPORT___.toString()]);\n","import { LitElement, html, nothing } from \"lit\";\nimport { ref } from \"lit/directives/ref.js\";\nimport { styleMap } from \"lit/directives/style-map.js\";\n\nimport \"../placement-note/element.js\";\nimport \"../placement-no/element.js\";\n\nimport { PlacementMixin } from \"../placement/mixin.js\";\n\nimport styles from \"./element.css?lit\";\n\n/**\n * @import * as Placements from \"../placement/types.js\";\n * @import { TemplateResult } from \"lit\";\n */\n\nexport class MDNPlacementTop extends PlacementMixin(LitElement) {\n  static styles = styles;\n\n  /**\n   *\n   * @returns {TemplateResult | symbol}\n   */\n  renderInitial() {\n    return html`<div class=\"top-placement empty\"></div>`;\n  }\n\n  renderFallback() {\n    return html`\n      <div class=\"fallback\">\n        <p class=\"fallback__copy\">\n          Learn frontend, backend, and AI from our course partner\n          <a\n            href=\"https://scrimba.com/learn/frontend?via=mdn\"\n            target=\"_blank\"\n            rel=\"noreferrer\"\n            data-glean-id=\"banner_scrimba_click\"\n          >\n            Scrimba\n          </a>\n        </p>\n      </div>\n    `;\n  }\n\n  /**\n   *\n   * @param {Placements.PlacementContextData} placementContext\n   * @returns\n   */\n  renderComplete(placementContext) {\n    if (placementContext.status === \"noads\") {\n      return nothing;\n    }\n\n    const data = placementContext?.hpTop || placementContext?.top;\n    if (!data) {\n      return this.renderFallback();\n    }\n    const {\n      status,\n      click,\n      view,\n      copy,\n      image,\n      imageFormat,\n      alt,\n      cta,\n      colors,\n      version,\n    } = data;\n    if (status !== \"success\") {\n      return this.renderFallback();\n    }\n    if (!this._viewedUrl) {\n      this._viewedUrl = view;\n      this._version = version;\n    }\n    const {\n      textColor,\n      backgroundColor,\n      ctaTextColor,\n      ctaBackgroundColor,\n      textColorDark,\n      backgroundColorDark,\n      ctaTextColorDark,\n      ctaBackgroundColorDark,\n    } = colors || {};\n    const styles = Object.fromEntries(\n      [\n        [\"--place-top-background-light\", backgroundColor],\n        [\"--place-top-color-light\", textColor],\n        [\"--place-top-cta-background-light\", ctaBackgroundColor],\n        [\"--place-top-cta-color-light\", ctaTextColor],\n        [\"--place-top-background-dark\", backgroundColorDark || backgroundColor],\n        [\"--place-top-color-dark\", textColorDark || textColor],\n        [\n          \"--place-top-cta-background-dark\",\n          ctaBackgroundColorDark || ctaBackgroundColor,\n        ],\n        [\"--place-top-cta-color-dark\", ctaTextColorDark || ctaBackgroundColor],\n      ].filter(([_, v]) => Boolean(v)),\n    );\n    const type = \"top-banner\";\n\n    return imageFormat === \"leaderboard\"\n      ? html`<div\n          ${ref(this._placementRef)}\n          class=\"top-placement-leaderboard\"\n          style=${styleMap(styles)}\n          data-type=${type}\n        >\n          <section class=\"placement-container\">\n            <div class=\"placement-inner\">\n              <a\n                class=\"placement-link\"\n                data-glean-id=${`pong: pong->click ${type}`}\n                href=${this.clickLink(click, version)}\n                target=\"_blank\"\n                rel=\"sponsored\"\n                ><div class=\"placement-content\">\n                  <img\n                    src=${this.imgLink(image)}\n                    aria-hidden=${!alt}\n                    alt=${alt || \"\"}\n                    height=\"90\"\n                  />\n                </div>\n              </a>\n            </div>\n            <mdn-placement-note></mdn-placement-note>\n            <mdn-placement-no></mdn-placement-no>\n          </section>\n        </div>`\n      : html`<div\n          ${ref(this._placementRef)}\n          class=\"top-placement\"\n          style=${styleMap(styles)}\n          data-type=${type}\n        >\n          <section class=\"placement-container\">\n            <div class=\"placement-inner\">\n              <a\n                class=\"placement-link\"\n                data-glean-id=${`pong: pong->click ${type}`}\n                href=${this.clickLink(click, version)}\n                target=\"_blank\"\n                rel=\"sponsored\"\n                ><div class=\"placement-content\">\n                  <img\n                    src=${this.imgLink(image)}\n                    aria-hidden=${!alt}\n                    alt=${alt || \"\"}\n                    height=\"50\"\n                  /><span>${copy}</span>\n                </div>\n                <span class=\"placement-cta\">${cta}</span></a\n              >\n              <mdn-placement-note></mdn-placement-note>\n            </div>\n            <mdn-placement-no></mdn-placement-no>\n          </section>\n        </div>`;\n  }\n}\n\ncustomElements.define(\"mdn-placement-top\", MDNPlacementTop);\n"],"names":["MDNPlacementTop","i","Object","customElements"],"mappings":"yLAII,EAA0B,A,SAA4B,KAE1D,EAAwB,IAAI,CAAC,CAAC,EAAO,EAAE,CAAE,qzNAAszN,GAAG,EAEl2N,MAAe,SAAI,CAAC,EAAwB,QAAQ,GAAG,C,kJCQhD,IAAMA,gBAAN,MAAMA,uBAAwB,QAAe,IAAU,EAC5D,OAAO,OAAS,GAAM,AAAC,AAMvB,gBAAgB,CACd,MAAO,QAAI,CAAC,uCAAuC,CAAC,AACtD,CAEA,gBAAiB,CACf,MAAO,QAAI,CAAC;;;;;;;;;;;;;;IAcZ,CAAC,AACH,CAOA,eAAe,CAAgB,CAAE,CAC/B,GAAI,AAA4B,UAA5B,EAAiB,MAAM,CACzB,OAAO,IAAO,CAGhB,IAAM,EAAO,GAAkB,OAAS,GAAkB,IAC1D,GAAI,CAAC,EACH,OAAO,IAAI,CAAC,cAAc,GAE5B,GAAM,CACJ,QAAM,CACN,OAAK,CACL,MAAI,CACJ,MAAI,CACJC,MAAAA,CAAK,CACL,aAAW,CACX,KAAG,CACH,KAAG,CACH,QAAM,CACN,SAAO,CACR,CAAG,EACJ,GAAI,AAAW,YAAX,EACF,OAAO,IAAI,CAAC,cAAc,EAEvB,KAAI,CAAC,UAAU,GAClB,IAAI,CAAC,UAAU,CAAG,EAClB,IAAI,CAAC,QAAQ,CAAG,GAElB,GAAM,CACJ,WAAS,CACT,iBAAe,CACf,cAAY,CACZ,oBAAkB,CAClB,eAAa,CACb,qBAAmB,CACnB,kBAAgB,CAChB,wBAAsB,CACvB,CAAG,GAAU,CAAC,EACT,EAASC,OAAO,WAAW,CAC/B,CACE,CAAC,+BAAgC,EAAgB,CACjD,CAAC,0BAA2B,EAAU,CACtC,CAAC,mCAAoC,EAAmB,CACxD,CAAC,8BAA+B,EAAa,CAC7C,CAAC,8BAA+B,GAAuB,EAAgB,CACvE,CAAC,yBAA0B,GAAiB,EAAU,CACtD,CACE,kCACA,GAA0B,EAC3B,CACD,CAAC,6BAA8B,GAAoB,EAAmB,CACvE,CAAC,MAAM,CAAC,CAAC,CAAC,EAAG,EAAE,GAAK,EAAQ,IAEzB,EAAO,aAEb,MAAO,AAAgB,gBAAhB,EACH,QAAI,CAAC;UACH,EAAE,QAAI,IAAI,CAAC,aAAa,EAAE;;gBAEpB,EAAE,QAAS,GAAQ;oBACf,EAAE,EAAK;;;;;;8BAMG,EAAE,CAAC,kBAAkB,EAAE,EAAK,CAAC,CAAC;qBACvC,EAAE,IAAI,CAAC,SAAS,CAAC,EAAO,GAAS;;;;;wBAK9B,EAAE,IAAI,CAAC,OAAO,CAACD,GAAO;gCACd,EAAE,CAAC,EAAI;wBACf,EAAE,GAAO,GAAG;;;;;;;;;cAStB,CAAC,CACP,QAAI,CAAC;UACH,EAAE,QAAI,IAAI,CAAC,aAAa,EAAE;;gBAEpB,EAAE,QAAS,GAAQ;oBACf,EAAE,EAAK;;;;;;8BAMG,EAAE,CAAC,kBAAkB,EAAE,EAAK,CAAC,CAAC;qBACvC,EAAE,IAAI,CAAC,SAAS,CAAC,EAAO,GAAS;;;;;wBAK9B,EAAE,IAAI,CAAC,OAAO,CAACA,GAAO;gCACd,EAAE,CAAC,EAAI;wBACf,EAAE,GAAO,GAAG;;0BAEV,EAAE,EAAK;;4CAEW,EAAE,EAAI;;;;;;cAMpC,CAAC,AACb,CACF,EAEAE,eAAe,MAAM,CAAC,oBAAqBH,gB"}

package/out/static/client/{index.48af417c590b0a0c.js → index.28b347098e1707fe.js}

@@ -1,4 +1,4 @@
-/*! For license information please see index.48af417c590b0a0c.js.LICENSE.txt */
+/*! For license information please see index.28b347098e1707fe.js.LICENSE.txt */
 export const __rspack_esm_id="8410";export const __rspack_esm_ids=["8410"];export const __webpack_modules__={3971(e,t,n){n.d(t,{A:()=>p});var a=n(97825),o=n(31601),r=n.n(o),s=n(76314),i=n.n(s),l=n(4417),c=n.n(l),d=new n.U(n(70054)),u=i()(r()),m=c()(d);u.push([e.id,`*,:after,:before{box-sizing:border-box}dialog{border:0;padding:0}@media (width > 1006px){dialog{background-color:var(--color-background-primary);border:1px solid var(--color-border-primary);border-radius:.5rem;font-size:var(--font-size-large);margin:calc(var(--sticky-header-height) + 1rem) auto 1rem;max-height:calc(100% - var(--sticky-header-height) - 2rem);width:calc(var(--layout-content-max) + 1rem)}dialog::backdrop{--csstools-light-dark-toggle-dee8eb9e-0:var(--csstools-color-scheme--light) var(--color-black-alpha-75);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background-color:var(--csstools-light-dark-toggle-dee8eb9e-0,var(--color-white-alpha-75))}@supports (color:light-dark(red,red)){dialog::backdrop{background-color:light-dark(var(--color-white-alpha-75),var(--color-black-alpha-75))}}}@media (width <= 1006px){dialog{font-size:var(--font-size-normal);height:100%;margin:0;max-height:100%;max-width:100%;width:100%}}dialog[open]{display:grid;grid-template-areas:"search   close" "progress progress" "results  results";grid-template-columns:1fr min-content;grid-template-rows:var(--navigation-height) min-content min-content}progress{grid-area:progress;margin:0 1rem .5rem}@media (width <= 1006px){progress{margin-inline:.3rem}}.close{font-size:1.37rem;grid-area:close}@media (width > 1006px){.close{display:none}}form{display:grid;gap:.5rem;grid-area:search;grid-template-columns:min-content 1fr;padding:1rem;place-items:center}@media (width <= 1006px){form{align-self:center;background-color:var(--color-background-primary);border:1px solid var(--color-border-primary);border-radius:.5rem;margin-left:.3rem;padding:.5rem}}form:before{background-color:var(--color-border-secondary);content:"";height:1em;-webkit-mask-image:url(${m});mask-image:url(${m});-webkit-mask-size:contain;mask-size:contain;width:1em}input{background-color:initial;border:none;font-size:inherit;margin:0;outline:none;padding:0;width:100%}input::placeholder{color:var(--color-text-secondary)}ul{grid-area:results;margin:0;overflow:auto;overscroll-behavior:contain;padding:0}ul:has(li){border-top:1px solid var(--color-border-primary)}li[data-selected]{background:var(--color-background-blue);border-color:var(--color-blue-50)}li{border-inline-start:2px solid #0000;list-style-type:none}li:not([data-selected]):hover{background-color:var(--color-background-secondary)}li>*{padding:.5rem 1.5rem;width:100%}a{color:var(--color-link-normal);display:grid;-webkit-text-decoration:none;text-decoration:none}a:visited{color:var(--color-link-visited)}.slug{color:var(--color-text-secondary);font-size:var(--font-size-small)}mark{background-color:var(--color-background-yellow);color:var(--color-text-primary)}`,""]);let p=(0,a.AH)([u.toString()])},10336(e,t,n){n.d(t,{A:()=>o});var a=n(97825);let o=(0,a.JW)`<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24"><path d="M18 6 6 18M6 6l12 12"/></svg>`},98693(e,t,n){var a={"./code-example/element.js":["84352","6703","6203","1861","6475","7065","7517"],"./dropdown/element.js":["58623","2868","4740"],"./live-sample-result/element.js":["47849","6703","3611","6203","5950","4098","1861","5330"],"./observatory-tests-and-scores/element.js":["56538","6407"],"./play-runner/element.js":["63657","6703","5950","4098","4074"],"./search-button/element.js":["23745","3690"],"./survey/element.js":["70134","6703","6203","2105","2283"],"./ix-tab-wrapper/element.js":["49979","2568"],"./placement-sidebar/element.js":["57468","6703","3611","8280","1477","5649","2173"],"./placement-hp-main/element.js":["44394","6703","3611","8280","1477","5649","4759"],"./record-visit/element.js":["55237","5562","3094"],"./toggle-sidebar/element.js":["27486","6203","2415"],"./user-menu/element.js":["7247","6203","2105","7748"],"./interactive-example/element.js":["81505","6703","749","3730","3106","993","6216","2080","640","9515","1356","6203","5950","4098","6760","3047","1861","2448","6475","4419","7065","2568","5338","5722"],"./copy-button/element.js":["38262","6203","6475","4660"],"./observatory-comparison-table/element.js":["50117","9410","2006"],"./sidebar-filter/element.js":["83703","9324"],"./issues-table/element.js":["37511","4204"],"./scrim-inline/element.js":["43602","3611","5183"],"./switch/element.js":["41798","9099"],"./collection-save-button/element.js":["1355","6203","3000","4920"],"./contributor-list/element.js":["23082","9127"],"./button/element.js":["17398","6203","9898"],"./homepage-search/element.js":["27373","7678"],"./modal/element.js":["14903","6203","3000"],"./color-theme/element.js":["55269","2868","544"],"./about-team-member/element.js":["612","8981"],"./content-feedback/element.js":["83818","6203","4891"],"./play-console/element.js":["71787","6760"],"./ix-tab/element.js":["18977","4419","5338"],"./observatory-header-link/element.js":["1879","9410","3676"],"./curriculum-tabs/element.js":["52500","9717"],"./placement-bottom/element.js":["7895","6703","3611","8280","1477","5649","4060"],"./image-history/element.js":["47706","1975"],"./not-found/element.js":["2622","8926","3555"],"./placement-note/element.js":["47764","1477"],"./compat-table-lazy/element.js":["96678","2105","718","251"],"./site-search/element.js":["41425","6203","9578"],"./placement-no/element.js":["13755","8280"],"./play-controller/element.js":["23731","2448"],"./placement-top/element.js":["9951","6703","3611","8280","1477","5649","9204"],"./observatory-form/element.js":["17547","6703","6203","6110","8364"],"./observatory-results/element.js":["13430","6203","9410","2868","6110","2006","7593","3676","4070","3259"],"./about-tabs/element.js":["54842","7047"],"./observatory-human-duration/element.js":["37077","9410","4070"],"./playground/element.js":["93075","6703","749","3730","3106","993","6216","2080","640","9515","6203","5950","4098","6760","3047","2448","3000","7584"],"./ix-tab-panel/element.js":["89854","4419"],"./play-editor/element.js":["63386","749","3730","3106","993","6216","2080","640","9515","5950","3047"],"./themed-image/element.js":["48125","5102"],"./writer-open-editor/element.js":["51310","6203","9967"],"./progress-bar/element.js":["20141","6110"],"./compat-table/element.js":["72301","2105","718"],"./login-button/element.js":["70242","6203","6067"],"./observatory-rescan-button/element.js":["14416","6203","7593","3140"],"./recently-visited/element.js":["95821","5562","5246"],"./language-always-redirect-button/element.js":["77108","8300","5685"],"./language-switcher/element.js":["64786","2868","9099","8926","8300","5667"],"./search-modal/element.js":["97154"],"./writer-reload/element.js":["14925","4366"]};function o(e){if(!n.o(a,e))return Promise.resolve().then(function(){var t=Error("Cannot find module '"+e+"'");throw t.code="MODULE_NOT_FOUND",t});var t=a[e],o=t[0];return Promise.all(t.slice(1).map(n.e)).then(function(){return n(o)})}o.keys=()=>Object.keys(a),o.id=98693,e.exports=o},70054(e,t,n){e.exports=n.p+"search.5dd31cbeea7d1af9.svg"},51874(){try{let t=document.querySelector(".baseline-indicator");function e(e){e?localStorage.setItem("baseline-indicator","open"):localStorage.removeItem("baseline-indicator")}t instanceof HTMLDetailsElement&&(t.addEventListener("toggle",()=>{e(t.open)}),e(t.open))}catch(e){console.warn("Unable to attach to baseline indicator",e)}},99502(e,t,n){n.d(t,{i7:()=>x,iW:()=>y,tf:()=>l,P0:()=>h,I:()=>d,mR:()=>u,_0:()=>b,Q:()=>w,sR:()=>c,vQ:()=>m,kv:()=>p,Sl:()=>g,g_:()=>f,QD:()=>v});let a=[],o=r("RUNTIME_ENV",!0);function r(e,t,n){try{return!!JSON.parse(i(e,n)||JSON.stringify(t))}catch{return t}}function s(e,t,n){let a=i(e,n),o=a?Number.parseInt(a,10):t;return Number.isNaN(o)?t:o}function i(e,t={}){let{runtime:n}={runtime:!1,...t},r=`FRED_${e}`;return n&&o?(a.push(r),globalThis.process?.env[r]||i(e)):({FRED_RUNTIME_ENV:"true",FRED_PLAYGROUND_LOCAL:"false",FRED_LEGACY:"true"})[r]}let l=i("PLAYGROUND_BASE_HOST",void 0)||"mdnplay.dev",c=r("PLAYGROUND_LOCAL",!1,{runtime:!0}),d=s("PORT",3e3,{runtime:!0});r("OPEN_BROWSER_ON_START",!1,{runtime:!0});let u=s("PLAYGROUND_PORT",3001,{runtime:!0}),m=i("FXA_SIGNIN_URL",void 0)||"/users/fxa/login/authenticate/",p=i("FXA_SIGNOUT_URL",void 0)||"/users/fxa/login/logout/",h=r("GA_ENABLED",!1),g=i("GA_MEASUREMENT_ID",void 0)||"",b=r("GLEAN_ENABLED",!1),f=i("GLEAN_CHANNEL",void 0)||"dev",x=r("GLEAN_DEBUG",!1);r("ROBOTS_GLOBAL_ALLOW",!0);let v=r("WRITER_MODE",!1,{runtime:!0}),y=i("BCD_BASE_URL",void 0)||"https://bcd.developer.mozilla.org",w=i("OBSERVATORY_API_URL",void 0)||"https://observatory-api.mdn.mozilla.net"},36153(){let e=document.querySelector('[aria-controls="navigation__popup"]'),t=document.querySelector(".navigation");e instanceof HTMLElement&&t instanceof HTMLElement&&e.addEventListener("click",()=>{let n=("true"!==t.dataset.open).toString();t.dataset.open=n,e.setAttribute("aria-expanded",n)})},97154(e,t,n){n.r(t),n.d(t,{MDNSearchModal:()=>MDNSearchModal,splitQuery:()=>d});var a=n(31011),o=n(97825),r=n(61822),s=n(23727),i=n(14632),l=n(10336),c=n(3971);let MDNSearchModal=class MDNSearchModal extends(0,r.J)(o.WF){static ssr=!1;static styles=c.A;static properties={_index:{state:!0},_query:{state:!0},_selected:{state:!0},_shiftFocus:{state:!0}};constructor(){super(),this._index=void 0,this._query="",this._selected=0,this._shiftFocus=!1,this._hasEngaged=!1}async _loadIndex(){this._index||(this._index=this._fetchIndex())}async _fetchIndex(){let e=await fetch(`/${this.locale}/search-index.json`),t=await e.json();return{flex:t.map(({title:e,url:t},n)=>({index:n,title:e.toLowerCase(),slugTail:t.split("/").pop()?.toLowerCase()||""})),items:t}}showModal(){this._loadIndex(),this.shadowRoot?.querySelector("dialog")?.showModal(),this.shadowRoot?.querySelector("input")?.select()}_input({inputType:e,target:t}){t instanceof HTMLInputElement&&(this._query=t.value,!this._hasEngaged&&e.startsWith("insert")&&(this._hasEngaged=!0,(0,s.w)(`quick-search-change: ${"insertFromPaste"===e?"paste":"type"}`)))}_keydown(e){switch(e.key){case"ArrowUp":e.preventDefault(),this._select(this._selected-1);break;case"ArrowDown":e.preventDefault(),this._select(this._selected+1);break;case"Enter":{let{ctrlKey:t,shiftKey:n,altKey:a,metaKey:o}=e,r=this._getSelectedItem();r instanceof HTMLElement&&(e.preventDefault(),r.dispatchEvent(new MouseEvent("click",{bubbles:!0,composed:!0,ctrlKey:t,shiftKey:n,altKey:a,metaKey:o})));break}default:return}}_getSelectedItem(){return this.shadowRoot?.querySelector("[data-selected] a")??null}_select(e){let t=(this._queryIndex.value?.length||0)+1,n=e%t;this._selected=n<0?t+e:n,setTimeout(()=>{let e=this._getSelectedItem();e instanceof HTMLElement&&e.scrollIntoView({behavior:"smooth",block:"nearest"})},0)}_submit(e){e.preventDefault();let t=this._getSelectedItem();t instanceof HTMLElement&&t.click()}_focus({target:e}){if(e instanceof HTMLElement){let t=e.closest("[data-result]");if(t instanceof HTMLElement){let e=Number.parseInt(t.dataset.result||"NaN",10);Number.isNaN(e)||(this._selected=e,this._shiftFocus=!0)}else this._shiftFocus=!1}}_globalKeydown(e){let t=e.composedPath()?.[0]||e.target;if(t instanceof HTMLElement&&(["TEXTAREA","INPUT"].includes(t.tagName)||t.isContentEditable))return;let n=globalThis.getSelection()?.toString(),a=e.key,o=e.ctrlKey||e.metaKey,r="/"===a&&!o,i="k"===a&&o&&!e.shiftKey;(r||i)&&(e.preventDefault(),(0,s.w)(`quick-search-open: keyboard -> ${r?"slash":"ctrl-k"}`),this.showModal(),n&&(this._query=n,this._hasEngaged||(this._hasEngaged=!0,(0,s.w)("quick-search-change: selection"))))}_queryIndex=new a.YZ(this,{args:()=>[this._index,this._query],task:async([e,t])=>{if(e&&t){var n,a;let o,r;return n=t,a=await e,o=n.toLowerCase().trim(),r=d(n),a.flex.filter(({title:e})=>r.every(t=>e.includes(t))).map(({index:e,title:t,slugTail:n})=>[Number([t,n].includes(o)),e]).sort(([e],[t])=>t-e).map(([e,t])=>t).slice(0,10).map(e=>e&&(a.items||[])[e]).filter(Boolean)}}});_close(){this.shadowRoot?.querySelector("dialog")?.close()}connectedCallback(){super.connectedCallback(),this._globalKeydown=this._globalKeydown.bind(this),document.addEventListener("keydown",this._globalKeydown),this._loadIndex=this._loadIndex.bind(this),this.renderRoot.addEventListener("mouseover",this._loadIndex)}disconnectedCallback(){super.disconnectedCallback(),this.renderRoot.removeEventListener("mouseover",this._loadIndex),document.removeEventListener("keydown",this._globalKeydown)}_renderLoadingSearchIndex(){return(0,o.qy)`<progress
       aria-label=${this.l10n`Loading search index…`}
     ></progress>`}render(){let e=this._queryIndex.value?.length||0,t=this._query?`/${this.locale}/search?${new URLSearchParams({q:this._query})}`:null;return(0,o.qy)`
@@ -416,5 +416,5 @@ example-play-button-title = Ex\xe9cutez l'exemple dans MDN Playground (ouvre un
 `,ru:`blog-toc-title = В этой статье
 `,"zh-CN":`blog-toc-title = 在本文中
 `,"zh-TW":`blog-toc-title = 在本文中
-`},l=["i","strong","br","em"],c=["title","aria-label"];let Fluent=class Fluent{constructor(e="en-US",t=[]){this.locale=e,this.usBundle=Fluent.constructBundle(new a.Np(e),[s]),t.length>0&&(this.bundle=Fluent.constructBundle(new a.Np(e),[s,...t]))}static constructBundle(e,t=[]){for(let n of t){let t=e.addResource(new a.B$(n),{allowOverrides:!0});t.length>0&&console.error(t)}return e}get(e,t,n,a){let o=this.getMessage(e,t,n);if(o)return Fluent.sanitize(o,a)}static sanitize(e,t={}){let n={};for(let e of Object.values(t))n[e.tag]=[...Object.keys(e).filter(e=>"tag"!==e),...c];let a=[...Object.values(t).map(e=>e.tag),...l],s=!0,i=o(e,{allowedAttributes:n,allowedTags:a,allowedSchemes:["http","https","mailto"],filter(e){let n=e.attrs["data-l10n-name"];if(n)for(let[a,o]of Object.entries(t[n]||{}))e.attrs[a]=o;return!!(l.includes(e.tag)||n&&Object.keys(t).includes(n)&&t[n]?.tag===e.tag)&&(s=!1,!0)}},!0);return s?i:(0,r._)(i)}getMessage(e,t,n={},a=this.bundle,o=!1){let r,s=a?a.getMessage(e):void 0;if("qa"===this.locale)return`[${e}${t?`.${t}`:""}]`;if(!s){if(o)return;return this.getMessage(e,t,n,this.usBundle,!0)}if(t){if(!(r=s.attributes[t])){if(o)return;return this.getMessage(e,t,n,this.usBundle,!0)}}else s.value&&(r=s.value);if(!r||!a)return"";let i=[],l=a?.formatPattern(r,n,i);return i.length>0&&console.error(i),l}};let d=new Map;function u(e){if(e){if(!d.has(e)){let t=i[e],n=new Fluent(e,t?[t]:void 0);d.set(e,n)}return d.get(e)}}let m=e=>class extends e{constructor(...e){let t,n;super(...e);let a=(t=globalThis.__MDNServerContext?.getStore(),n=globalThis.__MDNClientContext,t||n);this.locale=a.locale,this.l10n=function(e){function t(t,n){if("string"==typeof t){let n=u(e)?.get(t),a=`[${t}]`,o=e=>{let t=e[0];return n||t||a};return o.toString=()=>"string"==typeof n&&n||a,o}return t[0]||""}return t.raw=function({id:t,attr:n,args:a,elements:o}){let r=u(e);return r?r.get(t,n,a,o):`[${t}]`},t}(this.locale)}}},95831(){globalThis.__MDNClientContext={locale:globalThis.location.pathname.split("/")[1]||"en-US"}},23727(e,t,n){n.d(t,{w:()=>o});var a=n(34388);function o(e){a.A.recordElementClick({id:e,url:globalThis.location.href,referrer:document.referrer,title:document.title})}},14632(e,t,n){n.d(t,{o:()=>a});function a(e,t){let n=e.replaceAll("_"," ").split("/").filter(e=>!["",t,"docs"].includes(e));return(n=n.map(e=>"API"===e?"Web APIs":e)).length>1&&"Web"===n.at(0)&&n.splice(0,1),n.length>1&&n.splice(-1,1),n.join(" / ")}},86372(e,t,n){n.d(t,{G:()=>a});function a(e){return(e||document.cookie).split("; ").includes("moz-1st-party-data-opt-out=true")}}};import{__webpack_require__ as e}from"./runtime.b64f7f70e93b950b.js";import*as t from"./1111.758a0ef999631930.js";e.C(t);import*as n from"./8903.3b8e2acd32393bf2.js";e.C(n);import*as a from"./index.48af417c590b0a0c.js";e.C(a),e(e.s=33779);
-//# sourceMappingURL=index.48af417c590b0a0c.js.map
+`},l=["i","strong","br","em"],c=["title","aria-label"];let Fluent=class Fluent{constructor(e="en-US",t=[]){this.locale=e,this.usBundle=Fluent.constructBundle(new a.Np(e),[s]),t.length>0&&(this.bundle=Fluent.constructBundle(new a.Np(e),[s,...t]))}static constructBundle(e,t=[]){for(let n of t){let t=e.addResource(new a.B$(n),{allowOverrides:!0});t.length>0&&console.error(t)}return e}get(e,t,n,a){let o=this.getMessage(e,t,n);if(o)return Fluent.sanitize(o,a)}static sanitize(e,t={}){let n={};for(let e of Object.values(t))n[e.tag]=[...Object.keys(e).filter(e=>"tag"!==e),...c];let a=[...Object.values(t).map(e=>e.tag),...l],s=!0,i=o(e,{allowedAttributes:n,allowedTags:a,allowedSchemes:["http","https","mailto"],filter(e){let n=e.attrs["data-l10n-name"];if(n)for(let[a,o]of Object.entries(t[n]||{}))e.attrs[a]=o;return!!(l.includes(e.tag)||n&&Object.keys(t).includes(n)&&t[n]?.tag===e.tag)&&(s=!1,!0)}},!0);return s?i:(0,r._)(i)}getMessage(e,t,n={},a=this.bundle,o=!1){let r,s=a?a.getMessage(e):void 0;if("qa"===this.locale)return`[${e}${t?`.${t}`:""}]`;if(!s){if(o)return;return this.getMessage(e,t,n,this.usBundle,!0)}if(t){if(!(r=s.attributes[t])){if(o)return;return this.getMessage(e,t,n,this.usBundle,!0)}}else s.value&&(r=s.value);if(!r||!a)return"";let i=[],l=a?.formatPattern(r,n,i);return i.length>0&&console.error(i),l}};let d=new Map;function u(e){if(e){if(!d.has(e)){let t=i[e],n=new Fluent(e,t?[t]:void 0);d.set(e,n)}return d.get(e)}}let m=e=>class extends e{constructor(...e){let t,n;super(...e);let a=(t=globalThis.__MDNServerContext?.getStore(),n=globalThis.__MDNClientContext,t||n);this.locale=a.locale,this.l10n=function(e){function t(t,n){if("string"==typeof t){let n=u(e)?.get(t),a=`[${t}]`,o=e=>{let t=e[0];return n||t||a};return o.toString=()=>"string"==typeof n&&n||a,o}return t[0]||""}return t.raw=function({id:t,attr:n,args:a,elements:o}){let r=u(e);return r?r.get(t,n,a,o):`[${t}]`},t}(this.locale)}}},95831(){globalThis.__MDNClientContext={locale:globalThis.location.pathname.split("/")[1]||"en-US"}},23727(e,t,n){n.d(t,{w:()=>o});var a=n(34388);function o(e){a.A.recordElementClick({id:e,url:globalThis.location.href,referrer:document.referrer,title:document.title})}},14632(e,t,n){n.d(t,{o:()=>a});function a(e,t){let n=e.replaceAll("_"," ").split("/").filter(e=>!["",t,"docs"].includes(e));return(n=n.map(e=>"API"===e?"Web APIs":e)).length>1&&"Web"===n.at(0)&&n.splice(0,1),n.length>1&&n.splice(-1,1),n.join(" / ")}},86372(e,t,n){n.d(t,{G:()=>a});function a(e){return(e||document.cookie).split("; ").includes("moz-1st-party-data-opt-out=true")}}};import{__webpack_require__ as e}from"./runtime.e0ee0698c2d3b87e.js";import*as t from"./1111.758a0ef999631930.js";e.C(t);import*as n from"./8903.3b8e2acd32393bf2.js";e.C(n);import*as a from"./index.28b347098e1707fe.js";e.C(a),e(e.s=33779);
+//# sourceMappingURL=index.28b347098e1707fe.js.map