@mdn/fred 2.5.0 → 2.6.0

package/out/static/client/{4759.8981c79d33088d8f.js.map → 4759.5852733a45132491.js.map}

@@ -1 +1 @@
-{"version":3,"file":"4759.8981c79d33088d8f.js","sources":["webpack://@mdn/fred/./components/placement-hp-main/element.css","webpack://@mdn/fred/./components/placement-hp-main/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, `.hp-main-placement{--hp-main-background-light:var(--color-background-primary);--hp-main-color-light:var(--color-text-primary);--hp-main-background-dark:var(--color-background-primary);--hp-main-color-dark:var(--color-text-primary);--csstools-light-dark-toggle-195607df-0:var(--csstools-color-scheme--light) var(--hp-main-background-dark);--hp-main-background:var(--csstools-light-dark-toggle-195607df-0,var(--hp-main-background-light));--csstools-light-dark-toggle-195607df-1:var(--csstools-color-scheme--light) var(--hp-main-color-dark);--hp-main-color:var(--csstools-light-dark-toggle-195607df-1,var(--hp-main-color-light));background-color:var(--hp-main-background);padding-inline:var(--layout-side-padding)}@supports (color:light-dark(red,red)){.hp-main-placement{--hp-main-background:light-dark(var(--hp-main-background-light),var(--hp-main-background-dark));--hp-main-color:light-dark(var(--hp-main-color-light),var(--hp-main-color-dark))}}@supports not (color:light-dark(tan,tan)){.hp-main-placement *{--csstools-light-dark-toggle-195607df-0:var(--csstools-color-scheme--light) var(--hp-main-background-dark);--hp-main-background:var(--csstools-light-dark-toggle-195607df-0,var(--hp-main-background-light));--csstools-light-dark-toggle-195607df-1:var(--csstools-color-scheme--light) var(--hp-main-color-dark);--hp-main-color:var(--csstools-light-dark-toggle-195607df-1,var(--hp-main-color-light))}}.hp-main-placement .placement-container{column-gap:3rem;display:grid;grid-template-areas:\"nope pong note\" \"nope pong no\";grid-template-columns:auto auto auto;margin:0 auto;padding:0 1rem}@media (width <= 1441px){.hp-main-placement .placement-container{grid-template-areas:\"pong note\" \"pong no\";grid-template-columns:auto max-content;grid-template-rows:auto 2rem}}@media (width <= 769px){.hp-main-placement .placement-container{grid-template-areas:\"pong\" \"note\";grid-template-columns:auto;grid-template-rows:auto 2rem}}:is(.hp-main-placement .placement-container) .placement-link{display:flex;grid-area:pong;justify-content:center}:is(:is(.hp-main-placement .placement-container) .placement-link) img{display:block;height:auto;max-width:100%}:is(.hp-main-placement .placement-container) mdn-placement-note{grid-area:note;margin:0 0 auto auto}`, \"\"]);\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 */\n\nexport class MDNPlacementHpMain extends PlacementMixin(LitElement) {\n  static styles = styles;\n\n  /**\n   *\n   * @param {Placements.PlacementContextData} placementContext\n   * @returns\n   */\n  renderComplete(placementContext) {\n    const { hpMain: data } = placementContext;\n    if (!data) {\n      return nothing;\n    }\n    const { status, click, view, image, alt, colors, version } = data;\n    if (status !== \"success\") {\n      return nothing;\n    }\n    if (!this._viewedUrl) {\n      this._viewedUrl = view;\n      this._version = version;\n    }\n    const { backgroundColor, textColor } = colors || {};\n    const styles = Object.fromEntries(\n      [\n        [\"--hp-main-background\", backgroundColor],\n        [\"--hp-main-color\", textColor],\n      ].filter(([_, v]) => Boolean(v)),\n    );\n    const type = \"hp-main\";\n\n    return html`<div\n      ${ref(this._placementRef)}\n      class=\"hp-main-placement\"\n      style=${styleMap(styles)}\n      data-type=${type}\n    >\n      <section class=\"placement-container\">\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        >\n          <img\n            src=${this.imgLink(image)}\n            aria-hidden=${!alt}\n            alt=${alt || \"\"}\n            width=\"970\"\n            height=\"250\"\n          />\n        </a>\n        <mdn-placement-note></mdn-placement-note>\n      </section>\n    </div>`;\n  }\n}\n\ncustomElements.define(\"mdn-placement-hp-main\", MDNPlacementHpMain);\n"],"names":["MDNPlacementHpMain","n","Object","customElements"],"mappings":"yLAII,EAA0B,A,SAA4B,KAE1D,EAAwB,IAAI,CAAC,CAAC,EAAO,EAAE,CAAE,ysEAA0sE,GAAG,EAEtvE,MAAe,SAAI,CAAC,EAAwB,QAAQ,GAAG,C,yJCOhD,IAAMA,mBAAN,MAAMA,0BAA2B,QAAe,IAAU,EAC/D,OAAO,OAAS,GAAM,AAAC,AAOvB,gBAAe,CAAgB,CAAE,CAC/B,GAAM,CAAE,OAAQ,CAAI,CAAE,CAAG,EACzB,GAAI,CAAC,EACH,OAAOC,EAAA,EAAO,CAEhB,GAAM,CAAE,QAAM,CAAE,OAAK,CAAE,MAAI,CAAE,OAAK,CAAE,KAAG,CAAE,QAAM,CAAE,SAAO,CAAE,CAAG,EAC7D,GAAI,AAAW,YAAX,EACF,OAAOA,EAAA,EAAO,AAEX,KAAI,CAAC,UAAU,GAClB,IAAI,CAAC,UAAU,CAAG,EAClB,IAAI,CAAC,QAAQ,CAAG,GAElB,GAAM,CAAE,iBAAe,CAAE,WAAS,CAAE,CAAG,GAAU,CAAC,EAC5C,EAASC,OAAO,WAAW,CAC/B,CACE,CAAC,uBAAwB,EAAgB,CACzC,CAAC,kBAAmB,EAAU,CAC/B,CAAC,MAAM,CAAC,CAAC,CAAC,EAAG,EAAE,GAAK,EAAQ,IAEzB,EAAO,UAEb,MAAO,QAAI,CAAC;MACV,EAAE,QAAI,IAAI,CAAC,aAAa,EAAE;;YAEpB,EAAE,QAAS,GAAQ;gBACf,EAAE,EAAK;;;;;wBAKC,EAAE,CAAC,kBAAkB,EAAE,EAAK,CAAC,CAAC;eACvC,EAAE,IAAI,CAAC,SAAS,CAAC,EAAO,GAAS;;;;;gBAKhC,EAAE,IAAI,CAAC,OAAO,CAAC,GAAO;wBACd,EAAE,CAAC,EAAI;gBACf,EAAE,GAAO,GAAG;;;;;;;UAOlB,CAAC,AACT,CACF,EAEAC,eAAe,MAAM,CAAC,wBAAyBH,mB"}
+{"version":3,"file":"4759.5852733a45132491.js","sources":["webpack://@mdn/fred/./components/placement-hp-main/element.css","webpack://@mdn/fred/./components/placement-hp-main/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, `.hp-main-placement{--hp-main-background-light:var(--color-background-primary);--hp-main-color-light:var(--color-text-primary);--hp-main-background-dark:var(--color-background-primary);--hp-main-color-dark:var(--color-text-primary);--csstools-light-dark-toggle-195607df-0:var(--csstools-color-scheme--light) var(--hp-main-background-dark);--hp-main-background:var(--csstools-light-dark-toggle-195607df-0,var(--hp-main-background-light));--csstools-light-dark-toggle-195607df-1:var(--csstools-color-scheme--light) var(--hp-main-color-dark);--hp-main-color:var(--csstools-light-dark-toggle-195607df-1,var(--hp-main-color-light));background-color:var(--hp-main-background);padding-inline:var(--layout-side-padding)}@supports (color:light-dark(red,red)){.hp-main-placement{--hp-main-background:light-dark(var(--hp-main-background-light),var(--hp-main-background-dark));--hp-main-color:light-dark(var(--hp-main-color-light),var(--hp-main-color-dark))}}@supports not (color:light-dark(tan,tan)){.hp-main-placement *{--csstools-light-dark-toggle-195607df-0:var(--csstools-color-scheme--light) var(--hp-main-background-dark);--hp-main-background:var(--csstools-light-dark-toggle-195607df-0,var(--hp-main-background-light));--csstools-light-dark-toggle-195607df-1:var(--csstools-color-scheme--light) var(--hp-main-color-dark);--hp-main-color:var(--csstools-light-dark-toggle-195607df-1,var(--hp-main-color-light))}}.hp-main-placement .placement-container{column-gap:3rem;display:grid;grid-template-areas:\"nope pong note\" \"nope pong no\";grid-template-columns:auto auto auto;margin:0 auto;padding:0 1rem}@media (width <= 1441px){.hp-main-placement .placement-container{grid-template-areas:\"pong note\" \"pong no\";grid-template-columns:auto max-content;grid-template-rows:auto 2rem}}@media (width <= 769px){.hp-main-placement .placement-container{grid-template-areas:\"pong\" \"note\";grid-template-columns:auto;grid-template-rows:auto 2rem}}:is(.hp-main-placement .placement-container) .placement-link{display:flex;grid-area:pong;justify-content:center}:is(:is(.hp-main-placement .placement-container) .placement-link) img{display:block;height:auto;max-width:100%}:is(.hp-main-placement .placement-container) mdn-placement-note{grid-area:note;margin:0 0 auto auto}`, \"\"]);\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 */\n\nexport class MDNPlacementHpMain extends PlacementMixin(LitElement) {\n  static styles = styles;\n\n  /**\n   *\n   * @param {Placements.PlacementContextData} placementContext\n   * @returns\n   */\n  renderComplete(placementContext) {\n    const { hpMain: data } = placementContext;\n    if (!data) {\n      return nothing;\n    }\n    const { status, click, view, image, alt, colors, version } = data;\n    if (status !== \"success\") {\n      return nothing;\n    }\n    if (!this._viewedUrl) {\n      this._viewedUrl = view;\n      this._version = version;\n    }\n    const { backgroundColor, textColor } = colors || {};\n    const styles = Object.fromEntries(\n      [\n        [\"--hp-main-background\", backgroundColor],\n        [\"--hp-main-color\", textColor],\n      ].filter(([_, v]) => Boolean(v)),\n    );\n    const type = \"hp-main\";\n\n    return html`<div\n      ${ref(this._placementRef)}\n      class=\"hp-main-placement\"\n      style=${styleMap(styles)}\n      data-type=${type}\n    >\n      <section class=\"placement-container\">\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        >\n          <img\n            src=${this.imgLink(image)}\n            aria-hidden=${!alt}\n            alt=${alt || \"\"}\n            width=\"970\"\n            height=\"250\"\n          />\n        </a>\n        <mdn-placement-note></mdn-placement-note>\n      </section>\n    </div>`;\n  }\n}\n\ncustomElements.define(\"mdn-placement-hp-main\", MDNPlacementHpMain);\n"],"names":["MDNPlacementHpMain","n","Object","customElements"],"mappings":"yLAII,EAA0B,A,SAA4B,KAE1D,EAAwB,IAAI,CAAC,CAAC,EAAO,EAAE,CAAE,ysEAA0sE,GAAG,EAEtvE,MAAe,SAAI,CAAC,EAAwB,QAAQ,GAAG,C,yJCOhD,IAAMA,mBAAN,MAAMA,0BAA2B,QAAe,IAAU,EAC/D,OAAO,OAAS,GAAM,AAAC,AAOvB,gBAAe,CAAgB,CAAE,CAC/B,GAAM,CAAE,OAAQ,CAAI,CAAE,CAAG,EACzB,GAAI,CAAC,EACH,OAAOC,EAAA,EAAO,CAEhB,GAAM,CAAE,QAAM,CAAE,OAAK,CAAE,MAAI,CAAE,OAAK,CAAE,KAAG,CAAE,QAAM,CAAE,SAAO,CAAE,CAAG,EAC7D,GAAI,AAAW,YAAX,EACF,OAAOA,EAAA,EAAO,AAEX,KAAI,CAAC,UAAU,GAClB,IAAI,CAAC,UAAU,CAAG,EAClB,IAAI,CAAC,QAAQ,CAAG,GAElB,GAAM,CAAE,iBAAe,CAAE,WAAS,CAAE,CAAG,GAAU,CAAC,EAC5C,EAASC,OAAO,WAAW,CAC/B,CACE,CAAC,uBAAwB,EAAgB,CACzC,CAAC,kBAAmB,EAAU,CAC/B,CAAC,MAAM,CAAC,CAAC,CAAC,EAAG,EAAE,GAAK,EAAQ,IAEzB,EAAO,UAEb,MAAO,QAAI,CAAC;MACV,EAAE,QAAI,IAAI,CAAC,aAAa,EAAE;;YAEpB,EAAE,QAAS,GAAQ;gBACf,EAAE,EAAK;;;;;wBAKC,EAAE,CAAC,kBAAkB,EAAE,EAAK,CAAC,CAAC;eACvC,EAAE,IAAI,CAAC,SAAS,CAAC,EAAO,GAAS;;;;;gBAKhC,EAAE,IAAI,CAAC,OAAO,CAAC,GAAO;wBACd,EAAE,CAAC,EAAI;gBACf,EAAE,GAAO,GAAG;;;;;;;UAOlB,CAAC,AACT,CACF,EAEAC,eAAe,MAAM,CAAC,wBAAyBH,mB"}

package/out/static/client/{4920.033c028023478df5.js → 4920.929203da4613c89a.js}

@@ -1,4 +1,4 @@
-export const __rspack_esm_id="4920";export const __rspack_esm_ids=["4920"];export const __webpack_modules__={59416(t,e,o){o.d(e,{A:()=>b});var i=o(97825),l=o(31601),s=o.n(l),n=o(76314),a=o.n(n),c=o(4417),r=o.n(c),d=new o.U(o(7438)),u=new o.U(o(77037)),h=a()(s()),m=r()(d),_=r()(u);h.push([t.id,`.collection-save-button{align-items:center;background-color:initial;border:none;column-gap:.25rem;cursor:pointer;display:flex;font:inherit;margin:0;padding:0 .5rem}.collection-save-button:hover{background-color:var(--color-background-secondary)}.collection-save-button:before{background-color:currentcolor;content:"";display:inline-block;height:1.25rem;-webkit-mask-size:cover;mask-size:cover;width:1.25rem}.collection-save-button[data-state=save]:before{-webkit-mask-image:url(${m});mask-image:url(${m})}.collection-save-button[data-state=remove]:before{-webkit-mask-image:url(${_});mask-image:url(${_})}@media (width <= 769px){.collection-save-button span{display:none}}label{display:block}`,""]);let b=(0,i.AH)([h.toString()])},77037(t,e,o){t.exports=o.p+"bookmark-check.22b3511032ad3541.svg"},7438(t,e,o){t.exports=o.p+"bookmark.431a822761ea8a1e.svg"},1355(t,e,o){o.r(e),o.d(e,{MDNCollectionSaveButton:()=>MDNCollectionSaveButton});var i=o(31011),l=o(97825),s=o(70693),n=o(45742),a=o(59416);o(14903),o(17398);let MDNCollectionSaveButton=class MDNCollectionSaveButton extends(0,s.J)(l.WF){static ssr=!1;static styles=a.A;static properties={docUrl:{type:String,attribute:"doc-url"},docTitle:{type:String,attribute:"doc-title"},_item:{state:!0},_pending:{state:!0},_lastAction:{state:!0}};constructor(){super(),this.docUrl="",this.docTitle="",this._item=void 0,this._pending=!1,this._lastAction=void 0}_user=new i.YZ(this,{task:async()=>{let t=await (0,n.L)();return t.isAuthenticated&&this._bookmarks.run(),t}});_collections=new i.YZ(this,{task:async()=>{let t=await fetch("/api/v2/collections/");if(!t.ok)throw Error(`${t.status}: ${t.statusText}`);return await t.json()}});_bookmarks=new i.YZ(this,{autoRun:!1,args:()=>[this.docUrl],task:async([t])=>{let e=await fetch(`/api/v2/collections/lookup/?url=${encodeURIComponent(t)}`);if(!e.ok)throw Error(`${e.status}: ${e.statusText}`);let o=await e.json(),i=o?.results,l=i&&i.map(t=>({...t.item,collection_id:t.collection_id}));if(l[0]){let{collection_id:t,title:e,notes:o}=l[0];this._item={collection_id:t,title:e,notes:o}}return l}});_open(){this._bookmarks.run(),this._collections.run(),this.shadowRoot?.querySelector("mdn-modal")?.showModal()}_selectChange({target:t}){if(t instanceof HTMLSelectElement){let{value:e}=t;if("add"===e)this.shadowRoot?.querySelector("mdn-modal")?.close(),open("/en-US/plus/collections");else{let t=this._bookmarks.value?.find(t=>t.collection_id===e);this._item=t||{collection_id:e}}}}_cancel(){this.shadowRoot?.querySelector("mdn-modal")?.close()}async _delete(){let t=this.shadowRoot?.querySelector("select")?.value,e=this._bookmarks.value?.find(e=>e.collection_id===t);if(t&&e){this._pending=!0,this._lastAction="delete";let o=await fetch(`/api/v2/collections/${t}/items/${e.id}/`,{method:"DELETE"});o.ok||console.error(`${o.status}: ${o.statusText}`),this.shadowRoot?.querySelector("mdn-modal")?.close(),this._pending=!1,this._bookmarks.run()}}async _submit(){let t=this.shadowRoot?.querySelector("select")?.value,e=this._bookmarks.value?.find(e=>e.collection_id===t);if(t){this._pending=!0,this._lastAction="save";let o=`/api/v2/collections/${t}/items/${e?`${e.id}/`:""}`,i=await fetch(o,{body:JSON.stringify({url:this.docUrl,title:this.shadowRoot?.querySelector("input")?.value,notes:this.shadowRoot?.querySelector("textarea")?.value}),method:"POST",headers:{"content-type":"application/json"}});i.ok||console.error(`${i.status}: ${i.statusText}`),this.shadowRoot?.querySelector("mdn-modal")?.close(),this._pending=!1,this._bookmarks.run()}}connectedCallback(){super.connectedCallback(),this._user.run()}willUpdate(t){(t.has("docUrl")||t.has("docTitle"))&&(this._item={url:this.docUrl,title:this.docTitle})}render(){let t=this._bookmarks.value?.some(t=>t.collection_id===this._item?.collection_id)||!1;return this._user.render({complete:e=>e.isAuthenticated?(0,l.qy)`
+export const __rspack_esm_id="4920";export const __rspack_esm_ids=["4920"];export const __webpack_modules__={59416(t,e,o){o.d(e,{A:()=>p});var i=o(97825),l=o(31601),s=o.n(l),n=o(76314),a=o.n(n),c=o(4417),r=o.n(c),d=new o.U(o(7438)),u=new o.U(o(77037)),h=a()(s()),_=r()(d),m=r()(u);h.push([t.id,`.collection-save-button{align-items:center;background-color:initial;border:none;column-gap:.25rem;cursor:pointer;display:flex;font:inherit;margin:0;padding:0 .5rem}.collection-save-button:hover{background-color:var(--color-background-secondary)}.collection-save-button:before{background-color:currentcolor;content:"";display:inline-block;height:1.25rem;-webkit-mask-size:cover;mask-size:cover;width:1.25rem}.collection-save-button[data-state=save]:before{-webkit-mask-image:url(${_});mask-image:url(${_})}.collection-save-button[data-state=remove]:before{-webkit-mask-image:url(${m});mask-image:url(${m})}@media (width <= 769px){.collection-save-button span{display:none}}label{display:block}`,""]);let p=(0,i.AH)([h.toString()])},77037(t,e,o){t.exports=o.p+"bookmark-check.22b3511032ad3541.svg"},7438(t,e,o){t.exports=o.p+"bookmark.431a822761ea8a1e.svg"},1355(t,e,o){o.r(e),o.d(e,{MDNCollectionSaveButton:()=>MDNCollectionSaveButton});var i=o(31011),l=o(97825),s=o(70693),n=o(23727),a=o(45742),c=o(59416);o(14903),o(17398);let MDNCollectionSaveButton=class MDNCollectionSaveButton extends(0,s.J)(l.WF){static ssr=!1;static styles=c.A;static properties={docUrl:{type:String,attribute:"doc-url"},docTitle:{type:String,attribute:"doc-title"},_item:{state:!0},_pending:{state:!0},_lastAction:{state:!0}};constructor(){super(),this.docUrl="",this.docTitle="",this._item=void 0,this._pending=!1,this._lastAction=void 0}_user=new i.YZ(this,{task:async()=>{let t=await (0,a.L)();return t.isAuthenticated&&this._bookmarks.run(),t}});_collections=new i.YZ(this,{task:async()=>{let t=await fetch("/api/v2/collections/");if(!t.ok)throw Error(`${t.status}: ${t.statusText}`);return await t.json()}});_bookmarks=new i.YZ(this,{autoRun:!1,args:()=>[this.docUrl],task:async([t])=>{let e=await fetch(`/api/v2/collections/lookup/?url=${encodeURIComponent(t)}`);if(!e.ok)throw Error(`${e.status}: ${e.statusText}`);let o=await e.json(),i=o?.results,l=i&&i.map(t=>({...t.item,collection_id:t.collection_id}));if(l[0]){let{collection_id:t,title:e,notes:o}=l[0];this._item={collection_id:t,title:e,notes:o}}return l}});_open(){this._selectFocusEventTriggered=!1,(0,n.w)("article_actions_collections_opened"),this._bookmarks.run(),this._collections.run(),this.shadowRoot?.querySelector("mdn-modal")?.showModal()}_selectOpen(){this._selectFocusEventTriggered||((0,n.w)("article_actions_collection_select_opened"),this._selectFocusEventTriggered=!0)}_selectChange({target:t}){if(t instanceof HTMLSelectElement){let{value:e}=t;if("add"===e)(0,n.w)("article_actions_new_collection"),this.shadowRoot?.querySelector("mdn-modal")?.close(),open("/en-US/plus/collections");else{let t=this._bookmarks.value?.find(t=>t.collection_id===e);this._item=t||{collection_id:e}}}}_cancel(){this.shadowRoot?.querySelector("mdn-modal")?.close()}async _delete(){let t=this.shadowRoot?.querySelector("select")?.value,e=this._bookmarks.value?.find(e=>e.collection_id===t);if(t&&e){this._pending=!0,this._lastAction="delete";let o=await fetch(`/api/v2/collections/${t}/items/${e.id}/`,{method:"DELETE"});o.ok||console.error(`${o.status}: ${o.statusText}`),this.shadowRoot?.querySelector("mdn-modal")?.close(),this._pending=!1,this._bookmarks.run()}}async _submit(){let t=this.shadowRoot?.querySelector("select")?.value,e=this._bookmarks.value?.find(e=>e.collection_id===t);if(t){this._pending=!0,this._lastAction="save";let o=`/api/v2/collections/${t}/items/${e?`${e.id}/`:""}`;(0,n.w)("new_collection_modal_submit_article_actions");let i=await fetch(o,{body:JSON.stringify({url:this.docUrl,title:this.shadowRoot?.querySelector("input")?.value,notes:this.shadowRoot?.querySelector("textarea")?.value}),method:"POST",headers:{"content-type":"application/json"}});i.ok||console.error(`${i.status}: ${i.statusText}`),this.shadowRoot?.querySelector("mdn-modal")?.close(),this._pending=!1,this._bookmarks.run()}}connectedCallback(){super.connectedCallback(),this._user.run()}willUpdate(t){(t.has("docUrl")||t.has("docTitle"))&&(this._item={url:this.docUrl,title:this.docTitle})}render(){let t=this._bookmarks.value?.some(t=>t.collection_id===this._item?.collection_id)||!1;return this._user.render({complete:e=>e.isAuthenticated?(0,l.qy)`
               <button
                 class="collection-save-button"
                 data-state=${this._bookmarks.value?.length?"remove":"save"}
@@ -17,6 +17,7 @@ export const __rspack_esm_id="4920";export const __rspack_esm_ids=["4920"];expor
                           ${this.l10n("collection-save-button-collection")`Collection:`}
                           <select
                             .value=${this._item?.collection_id}
+                            @focus=${this._selectOpen}
                             @change=${this._selectChange}
                           >
                             ${o.map(t=>(0,l.qy)`
@@ -69,4 +70,4 @@ export const __rspack_esm_id="4920";export const __rspack_esm_ids=["4920"];expor
                       `})})}
               </mdn-modal>
             `:l.s6})}};customElements.define("mdn-collection-save-button",MDNCollectionSaveButton)}};
-//# sourceMappingURL=4920.033c028023478df5.js.map
+//# sourceMappingURL=4920.929203da4613c89a.js.map

package/out/static/client/4920.929203da4613c89a.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"4920.929203da4613c89a.js","sources":["webpack://@mdn/fred/./components/collection-save-button/element.css","webpack://@mdn/fred/./components/collection-save-button/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\";\nimport ___CSS_LOADER_GET_URL_IMPORT___ from \"../../node_modules/css-loader/dist/runtime/getUrl.js\";\nvar ___CSS_LOADER_URL_IMPORT_0___ = new URL(\"../icon/bookmark.svg\", import.meta.url);\nvar ___CSS_LOADER_URL_IMPORT_1___ = new URL(\"../icon/bookmark-check.svg\", import.meta.url);\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___);\nvar ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);\nvar ___CSS_LOADER_URL_REPLACEMENT_1___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_1___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `.collection-save-button{align-items:center;background-color:initial;border:none;column-gap:.25rem;cursor:pointer;display:flex;font:inherit;margin:0;padding:0 .5rem}.collection-save-button:hover{background-color:var(--color-background-secondary)}.collection-save-button:before{background-color:currentcolor;content:\"\";display:inline-block;height:1.25rem;-webkit-mask-size:cover;mask-size:cover;width:1.25rem}.collection-save-button[data-state=save]:before{-webkit-mask-image:url(${___CSS_LOADER_URL_REPLACEMENT_0___});mask-image:url(${___CSS_LOADER_URL_REPLACEMENT_0___})}.collection-save-button[data-state=remove]:before{-webkit-mask-image:url(${___CSS_LOADER_URL_REPLACEMENT_1___});mask-image:url(${___CSS_LOADER_URL_REPLACEMENT_1___})}@media (width <= 769px){.collection-save-button span{display:none}}label{display:block}`, \"\"]);\n// Exports\nexport default css([___CSS_LOADER_EXPORT___.toString()]);\n","import { Task } from \"@lit/task\";\nimport { LitElement, html, nothing } from \"lit\";\n\nimport { L10nMixin } from \"../../l10n/mixin.js\";\nimport { gleanClick } from \"../../utils/glean.js\";\nimport { globalUser } from \"../user/context.js\";\n\nimport styles from \"./element.css?lit\";\n\nimport \"../modal/element.js\";\nimport \"../button/element.js\";\n\nconst ADD_VALUE = \"add\";\n\nexport class MDNCollectionSaveButton extends L10nMixin(LitElement) {\n  static ssr = false;\n  static styles = styles;\n\n  static properties = {\n    docUrl: { type: String, attribute: \"doc-url\" },\n    docTitle: { type: String, attribute: \"doc-title\" },\n    _item: { state: true },\n    _pending: { state: true },\n    _lastAction: { state: true },\n  };\n\n  constructor() {\n    super();\n    this.docUrl = \"\";\n    this.docTitle = \"\";\n    /** @type {Partial<import(\"./types.js\").NewItem> | undefined} */\n    this._item = undefined;\n    this._pending = false;\n    /** @type {string | undefined} */\n    this._lastAction = undefined;\n  }\n\n  _user = new Task(this, {\n    task: async () => {\n      const user = await globalUser();\n      if (user.isAuthenticated) {\n        this._bookmarks.run();\n      }\n      return user;\n    },\n  });\n\n  _collections = new Task(this, {\n    task: async () => {\n      const res = await fetch(\"/api/v2/collections/\");\n      if (!res.ok) {\n        throw new Error(`${res.status}: ${res.statusText}`);\n      }\n      return /** @type {import(\"./rust-types.js\").MultipleCollectionInfo[]} */ (\n        await res.json()\n      );\n    },\n  });\n\n  _bookmarks = new Task(this, {\n    autoRun: false,\n    args: () => [this.docUrl],\n    task: async ([docUrl]) => {\n      const res = await fetch(\n        `/api/v2/collections/lookup/?url=${encodeURIComponent(docUrl)}`,\n      );\n      if (!res.ok) {\n        throw new Error(`${res.status}: ${res.statusText}`);\n      }\n      const data =\n        /** @type {import(\"./rust-types.js\").MultipleCollectionLookupQueryResponse} */ (\n          await res.json()\n        );\n      const entries = data?.results;\n      const bookmarks =\n        entries &&\n        entries.map((entry) => {\n          return { ...entry.item, collection_id: entry.collection_id };\n        });\n      if (bookmarks[0]) {\n        const { collection_id, title, notes } = bookmarks[0];\n        this._item = {\n          collection_id,\n          title,\n          notes,\n        };\n      }\n      return bookmarks;\n    },\n  });\n\n  _open() {\n    this._selectFocusEventTriggered = false;\n    gleanClick(\"article_actions_collections_opened\");\n    this._bookmarks.run();\n    this._collections.run();\n    this.shadowRoot?.querySelector(\"mdn-modal\")?.showModal();\n  }\n\n  _selectOpen() {\n    if (!this._selectFocusEventTriggered) {\n      gleanClick(\"article_actions_collection_select_opened\");\n      this._selectFocusEventTriggered = true;\n    }\n  }\n\n  /** @param {Event} event */\n  _selectChange({ target }) {\n    if (target instanceof HTMLSelectElement) {\n      const { value } = target;\n      if (value === ADD_VALUE) {\n        gleanClick(\"article_actions_new_collection\");\n        this.shadowRoot?.querySelector(\"mdn-modal\")?.close();\n        open(\"/en-US/plus/collections\");\n      } else {\n        const item = this._bookmarks.value?.find(\n          (item) => item.collection_id === value,\n        );\n        this._item = item || {\n          collection_id: value,\n        };\n      }\n    }\n  }\n\n  _cancel() {\n    this.shadowRoot?.querySelector(\"mdn-modal\")?.close();\n  }\n\n  async _delete() {\n    const collectionId = this.shadowRoot?.querySelector(\"select\")?.value;\n    const item = this._bookmarks.value?.find(\n      (item) => item.collection_id === collectionId,\n    );\n    if (collectionId && item) {\n      this._pending = true;\n      this._lastAction = \"delete\";\n\n      const res = await fetch(\n        `/api/v2/collections/${collectionId}/items/${item.id}/`,\n        { method: \"DELETE\" },\n      );\n      if (!res.ok) {\n        console.error(`${res.status}: ${res.statusText}`);\n      }\n\n      this.shadowRoot?.querySelector(\"mdn-modal\")?.close();\n      this._pending = false;\n      this._bookmarks.run();\n    }\n  }\n\n  async _submit() {\n    const collectionId = this.shadowRoot?.querySelector(\"select\")?.value;\n    const item = this._bookmarks.value?.find(\n      (item) => item.collection_id === collectionId,\n    );\n    if (collectionId) {\n      this._pending = true;\n      this._lastAction = \"save\";\n\n      const url = `/api/v2/collections/${collectionId}/items/${item ? `${item.id}/` : \"\"}`;\n\n      gleanClick(\"new_collection_modal_submit_article_actions\");\n\n      const res = await fetch(url, {\n        body: JSON.stringify({\n          url: this.docUrl,\n          title: this.shadowRoot?.querySelector(\"input\")?.value,\n          notes: this.shadowRoot?.querySelector(\"textarea\")?.value,\n        }),\n        method: \"POST\",\n        headers: {\n          \"content-type\": \"application/json\",\n        },\n      });\n      if (!res.ok) {\n        console.error(`${res.status}: ${res.statusText}`);\n      }\n\n      this.shadowRoot?.querySelector(\"mdn-modal\")?.close();\n      this._pending = false;\n      this._bookmarks.run();\n    }\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._user.run();\n  }\n\n  /**\n   * @param {import(\"lit\").PropertyValues<this>} changedProperties\n   */\n  willUpdate(changedProperties) {\n    if (changedProperties.has(\"docUrl\") || changedProperties.has(\"docTitle\")) {\n      this._item = {\n        url: this.docUrl,\n        title: this.docTitle,\n      };\n    }\n  }\n\n  render() {\n    const isCurrentInCollection =\n      this._bookmarks.value?.some(\n        (item) => item.collection_id === this._item?.collection_id,\n      ) || false;\n    return this._user.render({\n      complete: (user) =>\n        user.isAuthenticated\n          ? html`\n              <button\n                class=\"collection-save-button\"\n                data-state=${this._bookmarks.value?.length ? \"remove\" : \"save\"}\n                title=${this.l10n(\n                  \"collection-save-button-save-in-collection\",\n                )`Save in collection`}\n                @click=${this._open}\n              >\n                <span\n                  >${this._bookmarks.value?.length\n                    ? this.l10n(\"collection-save-button-remove\")`Remove`\n                    : this.l10n(\"collection-save-button-save\")`Save`}</span\n                >\n              </button>\n              <mdn-modal\n                modal-title=${this.l10n(\n                  \"collection-save-button-add-to-collection\",\n                )`Add to collection`}\n              >\n                ${this._bookmarks.render({\n                  initial: () => html`<progress></progress>`,\n                  pending: () => html`<progress></progress>`,\n                  complete: (bookmarks) =>\n                    this._collections.render({\n                      initial: () => html`<progress></progress>`,\n                      pending: () => html`<progress></progress>`,\n                      complete: (collections) => html`\n                        <label>\n                          ${this.l10n(\n                            \"collection-save-button-collection\",\n                          )`Collection:`}\n                          <select\n                            .value=${this._item?.collection_id}\n                            @focus=${this._selectOpen}\n                            @change=${this._selectChange}\n                          >\n                            ${collections.map(\n                              (collection) => html`\n                                <option\n                                  value=${collection.id}\n                                  ?selected=${collection.id ===\n                                  this._item?.collection_id}\n                                >\n                                  ${bookmarks.some(\n                                    (item) =>\n                                      item.collection_id === collection.id,\n                                  )\n                                    ? \"★\"\n                                    : \"☆\"}\n                                  ${collection.name === \"Default\"\n                                    ? this.l10n(\n                                        \"collection-save-button-saved-articles\",\n                                      )`Saved articles`\n                                    : collection.name}\n                                </option>\n                              `,\n                            )}\n                            <option disabled role=\"separator\">\n                              ——————————\n                            </option>\n                            <option value=${ADD_VALUE}>\n                              +\n                              ${this.l10n(\n                                \"collection-save-button-new-collection\",\n                              )`New collection`}\n                            </option>\n                          </select>\n                        </label>\n                        <label>\n                          ${this.l10n(\"collection-save-button-name\")`Name:`}\n                          <input .value=${this._item?.title || this.docTitle} />\n                        </label>\n                        <label>\n                          ${this.l10n(\"collection-save-button-note\")`Note:`}\n                          <textarea\n                            .value=${this._item?.notes || \"\"}\n                          ></textarea>\n                        </label>\n                        <mdn-button @click=${this._submit}>\n                          ${this._pending && this._lastAction === \"save\"\n                            ? this.l10n(\n                                \"collection-save-button-saving\",\n                              )`Saving…`\n                            : this.l10n(\"collection-save-button-save\")`Save`}\n                        </mdn-button>\n                        <mdn-button\n                          @click=${this._cancel}\n                          ?disabled=${this._pending}\n                          variant=\"secondary\"\n                        >\n                          ${this.l10n(\"collection-save-button-cancel\")`Cancel`}\n                        </mdn-button>\n                        ${bookmarks?.length\n                          ? html`<mdn-button\n                              @click=${this._delete}\n                              variant=\"secondary\"\n                              action=\"negative\"\n                              id=\"bookmark-delete\"\n                              ?disabled=${this._pending ||\n                              !isCurrentInCollection}\n                            >\n                              ${this._pending && this._lastAction === \"delete\"\n                                ? this.l10n(\n                                    \"collection-save-button-deleting\",\n                                  )`Deleting…`\n                                : this.l10n(\n                                    \"collection-save-button-delete\",\n                                  )`Delete`}\n                            </mdn-button>`\n                          : nothing}\n                      `,\n                    }),\n                })}\n              </mdn-modal>\n            `\n          : nothing,\n    });\n  }\n}\n\ncustomElements.define(\"mdn-collection-save-button\", MDNCollectionSaveButton);\n"],"names":["_","MDNCollectionSaveButton","String","fetch","Error","encodeURIComponent","t","HTMLSelectElement","open","console","JSON","customElements"],"mappings":"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"}

package/out/static/client/{5183.6c532a6e7b0d0bbb.js → 5183.48a6059ffe2931f0.js}

@@ -1,12 +1,12 @@
-/*! For license information please see 5183.6c532a6e7b0d0bbb.js.LICENSE.txt */
-export const __rspack_esm_id="5183";export const __rspack_esm_ids=["5183"];export const __webpack_modules__={52055(i,e,s){s.d(e,{A:()=>y});var r=s(97825),t=s(31601),n=s.n(t),l=s(76314),o=s.n(l),a=s(67168),c=s(4417),d=s.n(c),m=new s.U(s(3080)),g=new s.U(s(96720)),h=new s.U(s(22300)),u=new s.U(s(11376)),p=new s.U(s(21747)),f=new s.U(s(53266)),b=o()(n());b.i(a.A);var v=d()(m),k=d()(g),w=d()(h),_=d()(u),x=d()(p),$=d()(f);b.push([i.id,`:host{display:block;overflow:hidden}*{box-sizing:border-box}button{appearance:none;background:none;border:none;padding:0}dialog{display:contents}dialog[open]{background-color:#0009;height:90vh;width:90vw}.inner{background-color:#000;border:1px solid #000;container-type:size;flex-direction:column;height:100%}.header,.inner{display:flex;width:100%}.header{align-items:center;background:#000;gap:.25rem;margin:0;min-height:1.75rem;padding:0 .5rem}.header span{color:#fff;font-size:var(--font-size-small);margin-right:auto}.scrim-fullscreen,.scrim-link{background-color:#fff;cursor:pointer;height:1rem;-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;width:1rem}:is(.scrim-fullscreen,.scrim-link):hover{background-color:var(--curriculum-color)}.enter:is(.scrim-fullscreen,.scrim-link){-webkit-mask-image:url(${v});mask-image:url(${v})}.exit:is(.scrim-fullscreen,.scrim-link){-webkit-mask-image:url(${k});mask-image:url(${k})}.scrim-link:is(.scrim-fullscreen,.scrim-link){-webkit-mask-image:url(${w});mask-image:url(${w});-webkit-mask-size:75%;mask-size:75%}.body{flex:1;font-size:4cqmin;position:relative}.background{background-color:#453c78;background-image:url(${_}),url(${x}),url(${$});background-position:1.5em 1.5em,100%,50%;background-repeat:no-repeat;background-size:auto .6em,contain,cover;inset:0;position:absolute}.background h1{bottom:0;color:var(--color-white);font-family:BarlowCondensed-SemiBold,Inter,sans-serif;font-size:3em;font-weight:var(--font-weight-bold);left:0;line-height:var(--font-line-ui);margin:.5em;position:absolute;text-transform:uppercase;text-wrap:balance;width:60%}.background-noise{filter:url(#noise);inset:0;mix-blend-mode:soft-light;position:absolute}.open,iframe{border:none;height:100%;position:absolute;width:100%}.open{--color:#8cb4ffcc;background-image:var(--scrim-img);background-position:50%;background-repeat:no-repeat;background-size:cover;cursor:pointer;font-size:inherit}.open:hover{--color:#8cb4ffe5}.open svg{height:9em;width:auto;stroke-width:2px}:is(.open svg) circle{fill:var(--color)}:is(.open svg) path{fill:#fff}`,""]);let y=(0,r.AH)([b.toString()])},67168(i,e,s){s.d(e,{A:()=>o});var r=s(31601),t=s.n(r),n=s(76314),l=s.n(n)()(t());l.push([i.id,".visually-hidden{border:0!important;clip-path:inset(50%)!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}",""]);let o=l.toString()},53266(i,e,s){i.exports=s.p+"scrim-bg.27f047d7e991dbe9.png"},96720(i,e,s){i.exports=s.p+"cancel.7362f2cdf3515e0d.svg"},22300(i,e,s){i.exports=s.p+"external-link.4f3a2dc8e402cae5.svg"},3080(i,e,s){i.exports=s.p+"fullscreen-enter.452bcbaed6904ec7.svg"},21747(i,e,s){i.exports=s.p+"scrim-hexagons.e59318adb5550050.svg"},11376(i,e,s){i.exports=s.p+"scrimba-logo.0c5b5b4efd2b23dc.svg"},43602(i,e,s){s.r(e),s.d(e,{MDNScrimInline:()=>MDNScrimInline});var r=s(97825),t=s(13121),n=s(5350),l=s(70693);let o=(0,r.JW)`<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="#000" viewBox="0 0 112 112"><circle cx="55.764" cy="55.764" r="41.823"/><path d="M69.011 57.428a2 2 0 0 0 0-3.328L50.903 42.027c-1.33-.886-3.11.067-3.11 1.664v24.145c0 1.598 1.78 2.55 3.11 1.664z"/></svg>`;var a=s(52055);let MDNScrimInline=class MDNScrimInline extends(0,l.J)(r.WF){static styles=a.A;static ssr=!1;static properties={url:{type:String},img:{type:String},scrimTitle:{type:String,attribute:"scrimtitle"},_fullscreen:{state:!0},_scrimLoaded:{state:!0}};constructor(){super(),this.url=void 0,this._fullUrl=void 0,this._scrimId=void 0,this.img=void 0,this._imgStyle={},this.scrimTitle=void 0,this._fullscreen=!1,this._scrimLoaded=!1}willUpdate(i){if(i.has("url"))if(this.url){let i=new URL(this.url);i.searchParams.set("via","mdn"),i.searchParams.set("embed",""),this._fullUrl=i.toString(),this._scrimId=i.pathname.slice(1)}else this._fullUrl=void 0,this._scrimId=void 0;i.has("img")&&(this._imgStyle=this.img?{"--scrim-img":`url(${this.img})`}:{})}render(){return this.url&&this._fullUrl?(0,r.qy)`
-      <dialog @close=${this.#i} style=${(0,n.W)(this._imgStyle)}>
+/*! For license information please see 5183.48a6059ffe2931f0.js.LICENSE.txt */
+export const __rspack_esm_id="5183";export const __rspack_esm_ids=["5183"];export const __webpack_modules__={52055(e,i,s){s.d(i,{A:()=>y});var t=s(97825),r=s(31601),n=s.n(r),o=s(76314),l=s.n(o),a=s(67168),c=s(4417),d=s.n(c),m=new s.U(s(3080)),h=new s.U(s(96720)),g=new s.U(s(22300)),u=new s.U(s(11376)),p=new s.U(s(21747)),b=new s.U(s(53266)),f=l()(n());f.i(a.A);var v=d()(m),k=d()(h),w=d()(g),_=d()(u),x=d()(p),$=d()(b);f.push([e.id,`:host{display:block;overflow:hidden}*{box-sizing:border-box}button{appearance:none;background:none;border:none;padding:0}dialog{display:contents}dialog[open]{background-color:#0009;height:90vh;width:90vw}.inner{background-color:#000;border:1px solid #000;container-type:size;flex-direction:column;height:100%}.header,.inner{display:flex;width:100%}.header{align-items:center;background:#000;gap:.25rem;margin:0;min-height:1.75rem;padding:0 .5rem}.header span{color:#fff;font-size:var(--font-size-small);margin-right:auto}.scrim-fullscreen,.scrim-link{background-color:#fff;cursor:pointer;height:1rem;-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;width:1rem}:is(.scrim-fullscreen,.scrim-link):hover{background-color:var(--curriculum-color)}.enter:is(.scrim-fullscreen,.scrim-link){-webkit-mask-image:url(${v});mask-image:url(${v})}.exit:is(.scrim-fullscreen,.scrim-link){-webkit-mask-image:url(${k});mask-image:url(${k})}.scrim-link:is(.scrim-fullscreen,.scrim-link){-webkit-mask-image:url(${w});mask-image:url(${w});-webkit-mask-size:75%;mask-size:75%}.body{flex:1;font-size:4cqmin;position:relative}.background{background-color:#453c78;background-image:url(${_}),url(${x}),url(${$});background-position:1.5em 1.5em,100%,50%;background-repeat:no-repeat;background-size:auto .6em,contain,cover;inset:0;position:absolute}.background h1{bottom:0;color:var(--color-white);font-family:BarlowCondensed-SemiBold,Inter,sans-serif;font-size:3em;font-weight:var(--font-weight-bold);left:0;line-height:var(--font-line-ui);margin:.5em;position:absolute;text-transform:uppercase;text-wrap:balance;width:60%}.background-noise{filter:url(#noise);inset:0;mix-blend-mode:soft-light;position:absolute}.open,iframe{border:none;height:100%;position:absolute;width:100%}.open{--color:#8cb4ffcc;background-image:var(--scrim-img);background-position:50%;background-repeat:no-repeat;background-size:cover;cursor:pointer;font-size:inherit}.open:hover{--color:#8cb4ffe5}.open svg{height:9em;width:auto;stroke-width:2px}:is(.open svg) circle{fill:var(--color)}:is(.open svg) path{fill:#fff}`,""]);let y=(0,t.AH)([f.toString()])},67168(e,i,s){s.d(i,{A:()=>l});var t=s(31601),r=s.n(t),n=s(76314),o=s.n(n)()(r());o.push([e.id,".visually-hidden{border:0!important;clip-path:inset(50%)!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}",""]);let l=o.toString()},53266(e,i,s){e.exports=s.p+"scrim-bg.27f047d7e991dbe9.png"},96720(e,i,s){e.exports=s.p+"cancel.7362f2cdf3515e0d.svg"},22300(e,i,s){e.exports=s.p+"external-link.4f3a2dc8e402cae5.svg"},3080(e,i,s){e.exports=s.p+"fullscreen-enter.452bcbaed6904ec7.svg"},21747(e,i,s){e.exports=s.p+"scrim-hexagons.e59318adb5550050.svg"},11376(e,i,s){e.exports=s.p+"scrimba-logo.0c5b5b4efd2b23dc.svg"},43602(e,i,s){s.r(i),s.d(i,{MDNScrimInline:()=>MDNScrimInline});var t=s(97825),r=s(13121),n=s(52258),o=s(5350),l=s(70693),a=s(23727),c=s(91118);let d=(0,t.JW)`<svg xmlns="http://www.w3.org/2000/svg" fill="none" stroke="#000" viewBox="0 0 112 112"><circle cx="55.764" cy="55.764" r="41.823"/><path d="M69.011 57.428a2 2 0 0 0 0-3.328L50.903 42.027c-1.33-.886-3.11.067-3.11 1.664v24.145c0 1.598 1.78 2.55 3.11 1.664z"/></svg>`;var m=s(52055);let MDNScrimInline=class MDNScrimInline extends(0,l.J)(t.WF){static styles=m.A;static ssr=!1;static properties={url:{type:String},img:{type:String},scrimTitle:{type:String,attribute:"scrimtitle"},_fullscreen:{state:!0},_scrimLoaded:{state:!0}};_bodyRef=(0,n._)();constructor(){super(),this.url=void 0,this._fullUrl=void 0,this._scrimId=void 0,this.img=void 0,this._imgStyle={},this.scrimTitle=void 0,this._fullscreen=!1,this._scrimLoaded=!1,new c.B(this,this._bodyRef,()=>{this._scrimId&&(0,a.w)(`curriculum: scrim view id:${this._scrimId}`)})}willUpdate(e){if(e.has("url"))if(this.url){let e=new URL(this.url);e.searchParams.set("via","mdn"),e.searchParams.set("embed",""),this._fullUrl=e.toString(),this._scrimId=e.pathname.slice(1)}else this._fullUrl=void 0,this._scrimId=void 0;e.has("img")&&(this._imgStyle=this.img?{"--scrim-img":`url(${this.img})`}:{})}render(){return this.url&&this._fullUrl?(0,t.qy)`
+      <dialog @close=${this.#e} style=${(0,o.W)(this._imgStyle)}>
         <div class="inner">
           <div class="header">
             <span
               >${this.l10n("scrim-inline-clicking-will-load-content-from")`Clicking will load content from scrimba.com`}</span
             >
-            <button tabindex="0" @click=${this.#e} class="toggle">
+            <button tabindex="0" @click=${this.#i} class="toggle">
               <div
                 class="scrim-fullscreen ${this._fullscreen?"exit":"enter"}"
               ></div>
@@ -27,14 +27,14 @@ export const __rspack_esm_id="5183";export const __rspack_esm_ids=["5183"];expor
               >
             </a>
           </div>
-          <div class="body">
-            ${this._scrimLoaded?(0,r.qy)`
+          <div class="body" ${(0,n.K)(this._bodyRef)}>
+            ${this._scrimLoaded?(0,t.qy)`
                   <iframe
                     src=${this._fullUrl}
-                    title=${(0,t.J)(this.scrimTitle)}
+                    title=${(0,r.J)(this.scrimTitle)}
                   ></iframe>
-                `:(0,r.qy)`
-                  ${this.scrimTitle&&!this.img?(0,r.qy)`<div class="background">
+                `:(0,t.qy)`
+                  ${this.scrimTitle&&!this.img?(0,t.qy)`<div class="background">
                         <div class="background-noise">
                           <svg width="0" height="0">
                             <filter id="noise">
@@ -53,7 +53,7 @@ export const __rspack_esm_id="5183";export const __rspack_esm_ids=["5183"];expor
                     class="open"
                     data-glean-id=${`curriculum: scrim engage id:${this._scrimId}`}
                   >
-                    ${o}
+                    ${d}
                     <span class="visually-hidden">
                       ${this.l10n("scrim-inline-load-scrim-and-open-dialog")`Load scrim and open dialog.`}
                     </span>
@@ -62,5 +62,5 @@ export const __rspack_esm_id="5183";export const __rspack_esm_ids=["5183"];expor
           </div>
         </div>
       </dialog>
-    `:r.s6}#e(i){i.target instanceof HTMLElement&&(i.target.dataset.gleanId=`curriculum: scrim fullscreen -> ${+!this._fullscreen} id:${this._scrimId}`),this._fullscreen?this.#r():this.#s()}#s(){let i=this.renderRoot.querySelector("dialog");i&&(i.showModal(),this._scrimLoaded=!0,this._fullscreen=!0)}#r(){let i=this.renderRoot.querySelector("dialog");i?.close()}#i(){this._fullscreen=!1}};customElements.define("mdn-scrim-inline",MDNScrimInline)},13121(i,e,s){s.d(e,{J:()=>t});var r=s(36752);let t=i=>i??r.s6}};
-//# sourceMappingURL=5183.6c532a6e7b0d0bbb.js.map
+    `:t.s6}#i(e){e.target instanceof HTMLElement&&(e.target.dataset.gleanId=`curriculum: scrim fullscreen -> ${+!this._fullscreen} id:${this._scrimId}`),this._fullscreen?this.#t():this.#s()}#s(){let e=this.renderRoot.querySelector("dialog");e&&(e.showModal(),this._scrimLoaded=!0,this._fullscreen=!0)}#t(){let e=this.renderRoot.querySelector("dialog");e?.close()}#e(){this._fullscreen=!1}};customElements.define("mdn-scrim-inline",MDNScrimInline)},91118(e,i,s){s.d(i,{B:()=>ViewedController});var t=s(18376);let ViewedController=class ViewedController{#r;observer=null;constructor(e,i,s,t){this.#r=e,this.#r.addController(this),this.target=i,this.callback=s,this.observerOptions=t}hostDisconnected(){this.observer?.disconnect(),this.observer=null}hostUpdated(){let e=this.target.value;e&&!this.observer&&(this.observer=new t.x(e,this.callback,this.observerOptions),this.observer.connect())}}},13121(e,i,s){s.d(i,{J:()=>r});var t=s(36752);let r=e=>e??t.s6}};
+//# sourceMappingURL=5183.48a6059ffe2931f0.js.map

package/out/static/client/5183.48a6059ffe2931f0.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"5183.48a6059ffe2931f0.js","sources":["webpack://@mdn/fred/./components/scrim-inline/element.css","webpack://@mdn/fred/./components/visually-hidden/global.css?228a","webpack://@mdn/fred/./components/scrim-inline/assets/scrim-play.svg","webpack://@mdn/fred/./components/scrim-inline/element.js","webpack://@mdn/fred/./components/viewed-controller/viewed-controller.js","webpack://@mdn/fred/./node_modules/lit-html/directives/if-defined.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\";\nimport ___CSS_LOADER_AT_RULE_IMPORT_0___ from \"-!../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!../../build/loaders/fix-light-dark.js!../../node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!../visually-hidden/global.css\";\nimport ___CSS_LOADER_GET_URL_IMPORT___ from \"../../node_modules/css-loader/dist/runtime/getUrl.js\";\nvar ___CSS_LOADER_URL_IMPORT_0___ = new URL(\"../icon/fullscreen-enter.svg\", import.meta.url);\nvar ___CSS_LOADER_URL_IMPORT_1___ = new URL(\"../icon/cancel.svg\", import.meta.url);\nvar ___CSS_LOADER_URL_IMPORT_2___ = new URL(\"../icon/external-link.svg\", import.meta.url);\nvar ___CSS_LOADER_URL_IMPORT_3___ = new URL(\"assets/scrimba-logo.svg\", import.meta.url);\nvar ___CSS_LOADER_URL_IMPORT_4___ = new URL(\"assets/scrim-hexagons.svg\", import.meta.url);\nvar ___CSS_LOADER_URL_IMPORT_5___ = new URL(\"assets/scrim-bg.png\", import.meta.url);\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___);\n___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);\nvar ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);\nvar ___CSS_LOADER_URL_REPLACEMENT_1___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_1___);\nvar ___CSS_LOADER_URL_REPLACEMENT_2___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_2___);\nvar ___CSS_LOADER_URL_REPLACEMENT_3___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_3___);\nvar ___CSS_LOADER_URL_REPLACEMENT_4___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_4___);\nvar ___CSS_LOADER_URL_REPLACEMENT_5___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_5___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `:host{display:block;overflow:hidden}*{box-sizing:border-box}button{appearance:none;background:none;border:none;padding:0}dialog{display:contents}dialog[open]{background-color:#0009;height:90vh;width:90vw}.inner{background-color:#000;border:1px solid #000;container-type:size;flex-direction:column;height:100%}.header,.inner{display:flex;width:100%}.header{align-items:center;background:#000;gap:.25rem;margin:0;min-height:1.75rem;padding:0 .5rem}.header span{color:#fff;font-size:var(--font-size-small);margin-right:auto}.scrim-fullscreen,.scrim-link{background-color:#fff;cursor:pointer;height:1rem;-webkit-mask-position:center;mask-position:center;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:contain;mask-size:contain;width:1rem}:is(.scrim-fullscreen,.scrim-link):hover{background-color:var(--curriculum-color)}.enter:is(.scrim-fullscreen,.scrim-link){-webkit-mask-image:url(${___CSS_LOADER_URL_REPLACEMENT_0___});mask-image:url(${___CSS_LOADER_URL_REPLACEMENT_0___})}.exit:is(.scrim-fullscreen,.scrim-link){-webkit-mask-image:url(${___CSS_LOADER_URL_REPLACEMENT_1___});mask-image:url(${___CSS_LOADER_URL_REPLACEMENT_1___})}.scrim-link:is(.scrim-fullscreen,.scrim-link){-webkit-mask-image:url(${___CSS_LOADER_URL_REPLACEMENT_2___});mask-image:url(${___CSS_LOADER_URL_REPLACEMENT_2___});-webkit-mask-size:75%;mask-size:75%}.body{flex:1;font-size:4cqmin;position:relative}.background{background-color:#453c78;background-image:url(${___CSS_LOADER_URL_REPLACEMENT_3___}),url(${___CSS_LOADER_URL_REPLACEMENT_4___}),url(${___CSS_LOADER_URL_REPLACEMENT_5___});background-position:1.5em 1.5em,100%,50%;background-repeat:no-repeat;background-size:auto .6em,contain,cover;inset:0;position:absolute}.background h1{bottom:0;color:var(--color-white);font-family:BarlowCondensed-SemiBold,Inter,sans-serif;font-size:3em;font-weight:var(--font-weight-bold);left:0;line-height:var(--font-line-ui);margin:.5em;position:absolute;text-transform:uppercase;text-wrap:balance;width:60%}.background-noise{filter:url(#noise);inset:0;mix-blend-mode:soft-light;position:absolute}.open,iframe{border:none;height:100%;position:absolute;width:100%}.open{--color:#8cb4ffcc;background-image:var(--scrim-img);background-position:50%;background-repeat:no-repeat;background-size:cover;cursor:pointer;font-size:inherit}.open:hover{--color:#8cb4ffe5}.open svg{height:9em;width:auto;stroke-width:2px}:is(.open svg) circle{fill:var(--color)}:is(.open svg) path{fill:#fff}`, \"\"]);\n// Exports\nexport default css([___CSS_LOADER_EXPORT___.toString()]);\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, `.visually-hidden{border:0!important;clip-path:inset(50%)!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important}`, \"\"]);\n// Exports\nexport default ___CSS_LOADER_EXPORT___.toString();\n","import { svg } from \"lit\"; export default svg`<svg xmlns=\"http://www.w3.org/2000/svg\" fill=\"none\" stroke=\"#000\" viewBox=\"0 0 112 112\"><circle cx=\"55.764\" cy=\"55.764\" r=\"41.823\"/><path d=\"M69.011 57.428a2 2 0 0 0 0-3.328L50.903 42.027c-1.33-.886-3.11.067-3.11 1.664v24.145c0 1.598 1.78 2.55 3.11 1.664z\"/></svg>`;","import { LitElement, html, nothing } from \"lit\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { createRef, ref } from \"lit/directives/ref.js\";\nimport { styleMap } from \"lit/directives/style-map.js\";\n\nimport { L10nMixin } from \"../../l10n/mixin.js\";\nimport { gleanClick } from \"../../utils/glean.js\";\nimport { ViewedController } from \"../viewed-controller/viewed-controller.js\";\n\nimport playSvg from \"./assets/scrim-play.svg?lit\";\nimport styles from \"./element.css?lit\";\n\nexport class MDNScrimInline extends L10nMixin(LitElement) {\n  static styles = styles;\n\n  static ssr = false;\n\n  static properties = {\n    url: { type: String },\n    img: { type: String },\n    scrimTitle: { type: String, attribute: \"scrimtitle\" },\n    _fullscreen: { state: true },\n    _scrimLoaded: { state: true },\n  };\n\n  /** @type {import(\"lit/directives/ref.js\").Ref<HTMLElement>} */\n  _bodyRef = createRef();\n\n  constructor() {\n    super();\n    /** @type {string | undefined} */\n    this.url = undefined;\n    /** @type {string | undefined} */\n    this._fullUrl = undefined;\n    /** @type {string | undefined} */\n    this._scrimId = undefined;\n\n    /** @type {string | undefined} */\n    this.img = undefined;\n    /** @type {import(\"lit/directives/style-map.js\").StyleInfo} */\n    this._imgStyle = {};\n\n    /** @type {string | undefined} */\n    this.scrimTitle = undefined;\n\n    /** @type {boolean} */\n    this._fullscreen = false;\n    /** @type {boolean} */\n    this._scrimLoaded = false;\n\n    new ViewedController(this, this._bodyRef, () => {\n      if (this._scrimId) {\n        gleanClick(`curriculum: scrim view id:${this._scrimId}`);\n      }\n    });\n  }\n\n  /**\n   * @param {import(\"lit\").PropertyValues<this>} changedProperties\n   */\n  willUpdate(changedProperties) {\n    if (changedProperties.has(\"url\")) {\n      if (this.url) {\n        const url = new URL(this.url);\n        url.searchParams.set(\"via\", \"mdn\");\n        url.searchParams.set(\"embed\", \"\");\n        this._fullUrl = url.toString();\n\n        this._scrimId = url.pathname.slice(1);\n      } else {\n        this._fullUrl = undefined;\n        this._scrimId = undefined;\n      }\n    }\n\n    if (changedProperties.has(\"img\")) {\n      this._imgStyle = this.img\n        ? {\n            \"--scrim-img\": `url(${this.img})`,\n          }\n        : {};\n    }\n  }\n\n  render() {\n    if (!this.url || !this._fullUrl) {\n      return nothing;\n    }\n\n    return html`\n      <dialog @close=${this.#dialogClosed} style=${styleMap(this._imgStyle)}>\n        <div class=\"inner\">\n          <div class=\"header\">\n            <span\n              >${this.l10n(\n                \"scrim-inline-clicking-will-load-content-from\",\n              )`Clicking will load content from scrimba.com`}</span\n            >\n            <button tabindex=\"0\" @click=${this.#toggle} class=\"toggle\">\n              <div\n                class=\"scrim-fullscreen ${this._fullscreen ? \"exit\" : \"enter\"}\"\n              ></div>\n              <span class=\"visually-hidden\"\n                >${this.l10n(\n                  \"scrim-inline-toggle-fullscreen\",\n                )`Toggle fullscreen`}</span\n              >\n            </button>\n            <a\n              href=${this._fullUrl}\n              target=\"_blank\"\n              rel=\"origin noreferrer\"\n              class=\"external\"\n              data-glean-id=\"curriculum: scrim link id:${this._scrimId}\"\n            >\n              <div class=\"scrim-link\"></div>\n              <span class=\"visually-hidden\"\n                >${this.l10n(\n                  \"scrim-inline-open-on-scrimba\",\n                )`Open on Scrimba`}</span\n              >\n            </a>\n          </div>\n          <div class=\"body\" ${ref(this._bodyRef)}>\n            ${this._scrimLoaded\n              ? html`\n                  <iframe\n                    src=${this._fullUrl}\n                    title=${ifDefined(this.scrimTitle)}\n                  ></iframe>\n                `\n              : html`\n                  ${this.scrimTitle && !this.img\n                    ? html`<div class=\"background\">\n                        <div class=\"background-noise\">\n                          <svg width=\"0\" height=\"0\">\n                            <filter id=\"noise\">\n                              <feTurbulence\n                                type=\"fractalNoise\"\n                                baseFrequency=\"0.7\"\n                                numOctaves=\"4\"\n                              />\n                            </filter>\n                          </svg>\n                        </div>\n                        <h1>${this.scrimTitle}</h1>\n                      </div>`\n                    : null}\n                  <button\n                    @click=${this.#open}\n                    class=\"open\"\n                    data-glean-id=${`curriculum: scrim engage id:${this._scrimId}`}\n                  >\n                    ${playSvg}\n                    <span class=\"visually-hidden\">\n                      ${this.l10n(\n                        \"scrim-inline-load-scrim-and-open-dialog\",\n                      )`Load scrim and open dialog.`}\n                    </span>\n                  </button>\n                `}\n          </div>\n        </div>\n      </dialog>\n    `;\n  }\n\n  /**\n   * @param {MouseEvent} e\n   */\n  #toggle(e) {\n    if (e.target instanceof HTMLElement) {\n      e.target.dataset.gleanId = `curriculum: scrim fullscreen -> ${this._fullscreen ? 0 : 1} id:${this._scrimId}`;\n    }\n    if (this._fullscreen) {\n      this.#close();\n    } else {\n      this.#open();\n    }\n  }\n\n  #open() {\n    const dialog = this.renderRoot.querySelector(\"dialog\");\n    if (dialog) {\n      dialog.showModal();\n      this._scrimLoaded = true;\n      this._fullscreen = true;\n    }\n  }\n\n  #close() {\n    const dialog = this.renderRoot.querySelector(\"dialog\");\n    dialog?.close();\n  }\n\n  #dialogClosed() {\n    this._fullscreen = false;\n  }\n}\n\ncustomElements.define(\"mdn-scrim-inline\", MDNScrimInline);\n","/**\n * @import { LitElement } from \"lit\";\n * @import { Ref } from \"lit/directives/ref.js\";\n */\n\nimport { ViewedObserver } from \"./viewed-observer.js\";\n\nexport class ViewedController {\n  #host;\n  /** @type {ViewedObserver | null} */\n  observer = null;\n\n  /**\n   * @param {LitElement} host\n   * @param {Ref<Element>} target\n   * @param {Function} callback\n   * @param {IntersectionObserverInit} [observerOptions]\n   */\n  constructor(host, target, callback, observerOptions) {\n    this.#host = host;\n    this.#host.addController(this);\n\n    this.target = target;\n    this.callback = callback;\n    this.observerOptions = observerOptions;\n  }\n\n  hostDisconnected() {\n    this.observer?.disconnect();\n    this.observer = null;\n  }\n\n  hostUpdated() {\n    const target = this.target.value;\n    if (target && !this.observer) {\n      this.observer = new ViewedObserver(\n        target,\n        this.callback,\n        this.observerOptions,\n      );\n      this.observer.connect();\n    }\n  }\n}\n","import{nothing as t}from\"../lit-html.js\";\n/**\n * @license\n * Copyright 2018 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */const o=o=>o??t;export{o as ifDefined};\n//# sourceMappingURL=if-defined.js.map\n"],"names":["_","MDNScrimInline","String","URL","e","HTMLElement","customElements","ViewedController","t"],"mappings":"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"}

package/out/static/client/{544.1ed814181b24bcc8.js → 544.2ccdc928c5292631.js}

@@ -1,5 +1,5 @@
-export const __rspack_esm_id="544";export const __rspack_esm_ids=["544"];export const __webpack_modules__={58952(e,o,t){t.d(o,{A:()=>u});var r=t(97825),a=t(31601),l=t.n(a),i=t(76314),d=t.n(i),m=t(4417),n=t.n(m),c=new t.U(t(4512)),h=new t.U(t(56324)),s=new t.U(t(27677)),g=d()(l()),_=n()(c),p=n()(h),k=n()(s);g.push([e.id,`.color-theme{--color-theme-light-dark:url(${_});--color-theme-light:url(${p});--color-theme-dark:url(${k});position:relative}.color-theme__button{align-items:center;background-color:initial;border:none;color:inherit;column-gap:.25rem;cursor:pointer;display:flex;font:inherit;margin:0;padding:0 .5rem}.color-theme__button:is(:hover,:focus,[aria-expanded=true]){background-color:var(--color-background-secondary)}@media (width <= 769px){.color-theme__button>span{display:none}}.color-theme__button:before{background-color:currentcolor;content:"";height:1.25rem;-webkit-mask-size:cover;mask-size:cover;width:1.25rem}.color-theme__button[data-mode="light dark"]:before{-webkit-mask-image:var(--color-theme-light-dark);mask-image:var(--color-theme-light-dark)}.color-theme__button[data-mode=light]:before{-webkit-mask-image:var(--color-theme-light);mask-image:var(--color-theme-light)}.color-theme__button[data-mode=dark]:before{-webkit-mask-image:var(--color-theme-dark);mask-image:var(--color-theme-dark)}.color-theme__dropdown{border:1px solid var(--color-border-primary);padding:.75rem;position:absolute;right:0;z-index:1}.color-theme__dropdown,.color-theme__list{background-color:var(--color-background-primary);margin:0;width:max-content}.color-theme__list{list-style:none;padding:0}.color-theme__option{align-items:center;background-color:initial;border:none;color:var(--color-text-primary);column-gap:.25rem;cursor:pointer;display:flex;font:inherit;margin:0;padding:.25rem;width:100%}.color-theme__option:hover{background-color:var(--color-background-secondary)}.color-theme__option:before{background-color:currentcolor;content:"";height:1.25rem;-webkit-mask-size:cover;mask-size:cover;width:1.25rem}.color-theme__option[data-mode="light dark"]:before{-webkit-mask-image:var(--color-theme-light-dark);mask-image:var(--color-theme-light-dark)}.color-theme__option[data-mode=light]:before{-webkit-mask-image:var(--color-theme-light);mask-image:var(--color-theme-light)}.color-theme__option[data-mode=dark]:before{-webkit-mask-image:var(--color-theme-dark);mask-image:var(--color-theme-dark)}.color-theme__option[data-current]{background:var(--color-background-secondary)}`,""]);let u=(0,r.AH)([g.toString()])},4512(e,o,t){e.exports=t.p+"contrast.d86e85c43de8dee8.svg"},27677(e,o,t){e.exports=t.p+"moon.74026b9da82b0694.svg"},56324(e,o,t){e.exports=t.p+"sun.1d7c3ad7bf6fc390.svg"},55269(e,o,t){t.r(o),t.d(o,{MDNColorTheme:()=>MDNColorTheme});var r=t(97825),a=t(70693),l=t(58952);t(58623);let MDNColorTheme=class MDNColorTheme extends(0,a.J)(r.WF){static styles=l.A;static properties={_mode:{state:!0}};constructor(){super(),this._mode="light dark",this._options=Object.entries({"light dark":this.l10n("theme-default")`OS default`,light:this.l10n("color-theme-light")`Light`,dark:this.l10n("color-theme-dark")`Dark`})}_setMode({target:e}){if(e instanceof HTMLElement){let o=e.dataset.mode;if("light dark"===o||"light"===o||"dark"===o){this._mode=o;try{localStorage.setItem("theme",o)}catch(e){console.warn("Unable to write theme to localStorage",e)}let e=this.shadowRoot?.querySelector("mdn-dropdown");e&&(e.open=!1)}}}willUpdate(e){e.has("_mode")&&globalThis.document&&(document.documentElement.dataset.theme=this._mode,this.dispatchEvent(new CustomEvent("mdn-color-theme-update",{bubbles:!0,composed:!0,detail:this._mode})))}render(){return(0,r.qy)`<div class="color-theme">
-      <mdn-dropdown>
+export const __rspack_esm_id="544";export const __rspack_esm_ids=["544"];export const __webpack_modules__={58952(e,o,t){t.d(o,{A:()=>u});var r=t(97825),a=t(31601),l=t.n(a),i=t(76314),n=t.n(i),m=t(4417),c=t.n(m),d=new t.U(t(4512)),s=new t.U(t(56324)),h=new t.U(t(27677)),g=n()(l()),_=c()(d),p=c()(s),k=c()(h);g.push([e.id,`.color-theme{--color-theme-light-dark:url(${_});--color-theme-light:url(${p});--color-theme-dark:url(${k});position:relative}.color-theme__button{align-items:center;background-color:initial;border:none;color:inherit;column-gap:.25rem;cursor:pointer;display:flex;font:inherit;margin:0;padding:0 .5rem}.color-theme__button:is(:hover,:focus,[aria-expanded=true]){background-color:var(--color-background-secondary)}@media (width <= 769px){.color-theme__button>span{display:none}}.color-theme__button:before{background-color:currentcolor;content:"";height:1.25rem;-webkit-mask-size:cover;mask-size:cover;width:1.25rem}.color-theme__button[data-mode="light dark"]:before{-webkit-mask-image:var(--color-theme-light-dark);mask-image:var(--color-theme-light-dark)}.color-theme__button[data-mode=light]:before{-webkit-mask-image:var(--color-theme-light);mask-image:var(--color-theme-light)}.color-theme__button[data-mode=dark]:before{-webkit-mask-image:var(--color-theme-dark);mask-image:var(--color-theme-dark)}.color-theme__dropdown{border:1px solid var(--color-border-primary);padding:.75rem;position:absolute;right:0;z-index:1}.color-theme__dropdown,.color-theme__list{background-color:var(--color-background-primary);margin:0;width:max-content}.color-theme__list{list-style:none;padding:0}.color-theme__option{align-items:center;background-color:initial;border:none;color:var(--color-text-primary);column-gap:.25rem;cursor:pointer;display:flex;font:inherit;margin:0;padding:.25rem;width:100%}.color-theme__option:hover{background-color:var(--color-background-secondary)}.color-theme__option:before{background-color:currentcolor;content:"";height:1.25rem;-webkit-mask-size:cover;mask-size:cover;width:1.25rem}.color-theme__option[data-mode="light dark"]:before{-webkit-mask-image:var(--color-theme-light-dark);mask-image:var(--color-theme-light-dark)}.color-theme__option[data-mode=light]:before{-webkit-mask-image:var(--color-theme-light);mask-image:var(--color-theme-light)}.color-theme__option[data-mode=dark]:before{-webkit-mask-image:var(--color-theme-dark);mask-image:var(--color-theme-dark)}.color-theme__option[data-current]{background:var(--color-background-secondary)}`,""]);let u=(0,r.AH)([g.toString()])},4512(e,o,t){e.exports=t.p+"contrast.d86e85c43de8dee8.svg"},27677(e,o,t){e.exports=t.p+"moon.74026b9da82b0694.svg"},56324(e,o,t){e.exports=t.p+"sun.1d7c3ad7bf6fc390.svg"},55269(e,o,t){t.r(o),t.d(o,{MDNColorTheme:()=>MDNColorTheme});var r=t(97825),a=t(70693),l=t(23727),i=t(58952);t(58623);let MDNColorTheme=class MDNColorTheme extends(0,a.J)(r.WF){static styles=i.A;static properties={_mode:{state:!0}};constructor(){super(),this._mode="light dark",this._closingFromSelect=!1,this._options=Object.entries({"light dark":this.l10n("theme-default")`OS default`,light:this.l10n("color-theme-light")`Light`,dark:this.l10n("color-theme-dark")`Dark`})}_setMode({target:e}){if(e instanceof HTMLElement){let o=e.dataset.mode;if("light dark"===o||"light"===o||"dark"===o){this._mode=o;let e="light dark"===o?"os-default":o;(0,l.w)(`theme_switcher: switch -> ${e}`);try{localStorage.setItem("theme",o)}catch(e){console.warn("Unable to write theme to localStorage",e)}let t=this.shadowRoot?.querySelector("mdn-dropdown");t&&(this._closingFromSelect=!0,t.open=!1)}}}_onDropdownToggle({target:e}){if(e instanceof HTMLElement&&"open"in e){if(!e.open&&this._closingFromSelect){this._closingFromSelect=!1;return}(0,l.w)(`theme_switcher: ${e.open?"open":"close"}`)}}willUpdate(e){e.has("_mode")&&globalThis.document&&(document.documentElement.dataset.theme=this._mode,this.dispatchEvent(new CustomEvent("mdn-color-theme-update",{bubbles:!0,composed:!0,detail:this._mode})))}render(){return(0,r.qy)`<div class="color-theme">
+      <mdn-dropdown @toggle=${this._onDropdownToggle}>
         <button
           part="button"
           slot="button"
@@ -31,4 +31,4 @@ export const __rspack_esm_id="544";export const __rspack_esm_ids=["544"];export
         </div>
       </mdn-dropdown>
     </div>`}firstUpdated(){let e;try{e=localStorage.getItem("theme")}catch(e){console.warn("Unable to read theme from localStorage",e)}("light dark"===e||"light"===e||"dark"===e)&&(this._mode=e)}};customElements.define("mdn-color-theme",MDNColorTheme)},81519(e,o,t){t.d(o,{O:()=>r});function r(e="id-"){return Math.random().toString(36).replace("0.",e)}}};
-//# sourceMappingURL=544.1ed814181b24bcc8.js.map
+//# sourceMappingURL=544.2ccdc928c5292631.js.map

package/out/static/client/544.2ccdc928c5292631.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"544.2ccdc928c5292631.js","sources":["webpack://@mdn/fred/./components/color-theme/element.css","webpack://@mdn/fred/./components/color-theme/element.js","webpack://@mdn/fred/./components/utils/index.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\";\nimport ___CSS_LOADER_GET_URL_IMPORT___ from \"../../node_modules/css-loader/dist/runtime/getUrl.js\";\nvar ___CSS_LOADER_URL_IMPORT_0___ = new URL(\"../icon/contrast.svg\", import.meta.url);\nvar ___CSS_LOADER_URL_IMPORT_1___ = new URL(\"../icon/sun.svg\", import.meta.url);\nvar ___CSS_LOADER_URL_IMPORT_2___ = new URL(\"../icon/moon.svg\", import.meta.url);\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___);\nvar ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);\nvar ___CSS_LOADER_URL_REPLACEMENT_1___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_1___);\nvar ___CSS_LOADER_URL_REPLACEMENT_2___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_2___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `.color-theme{--color-theme-light-dark:url(${___CSS_LOADER_URL_REPLACEMENT_0___});--color-theme-light:url(${___CSS_LOADER_URL_REPLACEMENT_1___});--color-theme-dark:url(${___CSS_LOADER_URL_REPLACEMENT_2___});position:relative}.color-theme__button{align-items:center;background-color:initial;border:none;color:inherit;column-gap:.25rem;cursor:pointer;display:flex;font:inherit;margin:0;padding:0 .5rem}.color-theme__button:is(:hover,:focus,[aria-expanded=true]){background-color:var(--color-background-secondary)}@media (width <= 769px){.color-theme__button>span{display:none}}.color-theme__button:before{background-color:currentcolor;content:\"\";height:1.25rem;-webkit-mask-size:cover;mask-size:cover;width:1.25rem}.color-theme__button[data-mode=\"light dark\"]:before{-webkit-mask-image:var(--color-theme-light-dark);mask-image:var(--color-theme-light-dark)}.color-theme__button[data-mode=light]:before{-webkit-mask-image:var(--color-theme-light);mask-image:var(--color-theme-light)}.color-theme__button[data-mode=dark]:before{-webkit-mask-image:var(--color-theme-dark);mask-image:var(--color-theme-dark)}.color-theme__dropdown{border:1px solid var(--color-border-primary);padding:.75rem;position:absolute;right:0;z-index:1}.color-theme__dropdown,.color-theme__list{background-color:var(--color-background-primary);margin:0;width:max-content}.color-theme__list{list-style:none;padding:0}.color-theme__option{align-items:center;background-color:initial;border:none;color:var(--color-text-primary);column-gap:.25rem;cursor:pointer;display:flex;font:inherit;margin:0;padding:.25rem;width:100%}.color-theme__option:hover{background-color:var(--color-background-secondary)}.color-theme__option:before{background-color:currentcolor;content:\"\";height:1.25rem;-webkit-mask-size:cover;mask-size:cover;width:1.25rem}.color-theme__option[data-mode=\"light dark\"]:before{-webkit-mask-image:var(--color-theme-light-dark);mask-image:var(--color-theme-light-dark)}.color-theme__option[data-mode=light]:before{-webkit-mask-image:var(--color-theme-light);mask-image:var(--color-theme-light)}.color-theme__option[data-mode=dark]:before{-webkit-mask-image:var(--color-theme-dark);mask-image:var(--color-theme-dark)}.color-theme__option[data-current]{background:var(--color-background-secondary)}`, \"\"]);\n// Exports\nexport default css([___CSS_LOADER_EXPORT___.toString()]);\n","import { LitElement, html } from \"lit\";\n\nimport { L10nMixin } from \"../../l10n/mixin.js\";\nimport { gleanClick } from \"../../utils/glean.js\";\n\nimport styles from \"./element.css?lit\";\n\nimport \"../dropdown/element.js\";\n\nexport class MDNColorTheme extends L10nMixin(LitElement) {\n  static styles = styles;\n\n  static properties = {\n    _mode: { state: true },\n  };\n\n  constructor() {\n    super();\n    /** @type {import(\"./types.js\").ColorScheme} */\n    this._mode = \"light dark\";\n    this._closingFromSelect = false;\n    this._options = Object.entries({\n      \"light dark\": this.l10n(\"theme-default\")`OS default`,\n      light: this.l10n(\"color-theme-light\")`Light`,\n      dark: this.l10n(\"color-theme-dark\")`Dark`,\n    });\n  }\n\n  /** @param {MouseEvent} event */\n  _setMode({ target }) {\n    if (target instanceof HTMLElement) {\n      const mode = target.dataset.mode;\n      if (mode === \"light dark\" || mode === \"light\" || mode === \"dark\") {\n        this._mode = mode;\n        const gleanMode = mode === \"light dark\" ? \"os-default\" : mode;\n        gleanClick(`theme_switcher: switch -> ${gleanMode}`);\n        try {\n          localStorage.setItem(\"theme\", mode);\n        } catch (error) {\n          console.warn(\"Unable to write theme to localStorage\", error);\n        }\n        const dropdown = this.shadowRoot?.querySelector(\"mdn-dropdown\");\n        if (dropdown) {\n          this._closingFromSelect = true;\n          dropdown.open = false;\n        }\n      }\n    }\n  }\n\n  /** @param {Event} event */\n  _onDropdownToggle({ target }) {\n    if (target instanceof HTMLElement && \"open\" in target) {\n      if (!target.open && this._closingFromSelect) {\n        this._closingFromSelect = false;\n        return;\n      }\n      gleanClick(`theme_switcher: ${target.open ? \"open\" : \"close\"}`);\n    }\n  }\n\n  /**\n   * @param {import(\"lit\").PropertyValues<this>} changedProperties\n   */\n  willUpdate(changedProperties) {\n    if (changedProperties.has(\"_mode\") && globalThis.document) {\n      document.documentElement.dataset.theme = this._mode;\n      this.dispatchEvent(\n        new CustomEvent(\"mdn-color-theme-update\", {\n          bubbles: true,\n          composed: true,\n          detail: this._mode,\n        }),\n      );\n    }\n  }\n\n  render() {\n    return html`<div class=\"color-theme\">\n      <mdn-dropdown @toggle=${this._onDropdownToggle}>\n        <button\n          part=\"button\"\n          slot=\"button\"\n          class=\"color-theme__button\"\n          data-mode=${this._mode}\n          type=\"button\"\n          aria-label=${this.l10n(\n            \"color-theme-switch-color-theme\",\n          )`Switch color theme`}\n        >\n          <span>${this.l10n(\"color-theme-theme\")`Theme`}</span>\n        </button>\n        <div\n          slot=\"dropdown\"\n          class=\"color-theme__dropdown\"\n          id=\"color-theme__dropdown\"\n        >\n          <ul class=\"color-theme__list\">\n            ${this._options.map(\n              ([mode, option]) =>\n                html`<li>\n                  <button\n                    class=\"color-theme__option\"\n                    data-mode=${mode}\n                    ?data-current=${mode === this._mode}\n                    type=\"button\"\n                    @click=${this._setMode}\n                  >\n                    ${option}\n                  </button>\n                </li>`,\n            )}\n          </ul>\n        </div>\n      </mdn-dropdown>\n    </div>`;\n  }\n\n  firstUpdated() {\n    // we have to do this here and immediately cause a re-render\n    // as doing so in connectedCallback causes a hydration error:\n    // https://github.com/lit/lit/issues/1434\n\n    // this logic is also reflected in \"/entry.inline.js\"\n\n    let mode;\n    try {\n      mode = localStorage.getItem(\"theme\");\n    } catch (error) {\n      console.warn(\"Unable to read theme from localStorage\", error);\n    }\n    if (mode === \"light dark\" || mode === \"light\" || mode === \"dark\") {\n      this._mode = mode;\n    }\n  }\n}\n\ncustomElements.define(\"mdn-color-theme\", MDNColorTheme);\n","/**\n * Used to generate a random element id by combining a prefix with a random string.\n *\n * @param {string} prefix\n * @returns {string}\n */\nexport function randomIdString(prefix = \"id-\") {\n  return Math.random().toString(36).replace(\"0.\", prefix);\n}\n"],"names":["_","MDNColorTheme","Object","HTMLElement","localStorage","e","console","globalThis","document","CustomEvent","o","customElements","r","Math"],"mappings":"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"}

package/out/static/client/{5667.332b2c6c10792ad6.js → 5667.edd77c81ec38a7e2.js}

@@ -1,4 +1,4 @@
-export const __rspack_esm_id="5667";export const __rspack_esm_ids=["5667"];export const __webpack_modules__={30307(e,r,t){t.d(r,{A:()=>_});var a=t(97825),n=t(31601),o=t.n(n),i=t(76314),l=t.n(i),s=t(39807),c=t(4417),d=t.n(c),g=new t.U(t(15859)),u=l()(o());u.i(s.A);var h=d()(g);u.push([e.id,`.language-switcher{position:relative}.language-switcher__button{align-items:center;background-color:initial;border:none;color:inherit;column-gap:.25rem;cursor:pointer;display:flex;font:inherit;margin:0;padding:0 .5rem}.language-switcher__button:is(:hover,:focus,[aria-expanded=true]){background-color:var(--color-background-secondary)}@media screen and (width <= 480px){.language-switcher__button>span{display:none}}.language-switcher__button:before{background-color:currentcolor;content:"";height:1.25rem;-webkit-mask-image:url(${h});mask-image:url(${h});-webkit-mask-size:cover;mask-size:cover;width:1.25rem}.language-switcher__dropdown{background-color:var(--color-background-primary);border:1px solid var(--color-border-primary);margin:0;padding:.75rem;position:absolute;right:0;width:max-content;z-index:1}.language_switcher__remember{border-bottom:1px solid var(--color-border-primary);display:flex;font-size:var(--font-size-small);place-items:center;width:100%}.language_switcher__remember mdn-switch{padding:.25rem}:is(.language_switcher__remember mdn-switch):hover{background-color:var(--color-background-secondary)}.language-switcher__list{background-color:var(--color-background-primary);list-style:none;margin:0;padding:0;width:100%}.language-switcher__option{align-items:center;background-color:initial;border:none;color:var(--color-text-primary);column-gap:.25rem;display:flex;font:inherit;margin:0;padding:.25rem;-webkit-text-decoration:none;text-decoration:none;width:100%}.language-switcher__option:hover,.language-switcher__option[data-current]{background-color:var(--color-background-secondary)}`,""]);let _=(0,a.AH)([u.toString()])},15859(e,r,t){e.exports=t.p+"languages.dcba936080e5be86.svg"},64786(e,r,t){t.r(r),t.d(r,{MDNLanguageSwitcher:()=>MDNLanguageSwitcher});var a=t(31011),n=t(97825),o=t(70693);let i=(0,n.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"><circle cx="12" cy="12" r="10"/><path d="M12 16v-4m0-4h.01"/></svg>`;var l=t(15899),s=t(29303),c=t(30307);t(58623),t(41798);let MDNLanguageSwitcher=class MDNLanguageSwitcher extends(0,o.J)(n.WF){static styles=c.A;static properties={locale:{type:String},native:{type:String},translations:{type:Array},url:{type:String},notFound:{type:Boolean,attribute:"not-found"},_preferredLocale:{state:!0}};constructor(){super(),this.translations=[],this.native="",this.locale="en-US",this.url="/",this.notFound=!1,this._preferredLocale=void 0}_notFoundFallback=new a.YZ(this,{args:()=>[this.notFound],task:async([e])=>{if(e)return await (0,l.$)(location.pathname)}});firstUpdated(){this._preferredLocale=(0,s.E_)(),location.search&&(this.url+=location.search)}get _isLocalePreferred(){return this._preferredLocale==this.locale}_togglePreferredLocale(){this.notFound||(this._isLocalePreferred?((0,s.rM)(),this._preferredLocale=void 0):((0,s.ud)(this.locale),this._preferredLocale=this.locale))}render(){let{translations:e,native:r,locale:t,url:a,notFound:o}=this;return 0===e.length?n.s6:(0,n.qy)`<div class="language-switcher">
+export const __rspack_esm_id="5667";export const __rspack_esm_ids=["5667"];export const __webpack_modules__={30307(e,r,t){t.d(r,{A:()=>_});var a=t(97825),n=t(31601),o=t.n(n),i=t(76314),l=t.n(i),s=t(39807),c=t(4417),d=t.n(c),g=new t.U(t(15859)),u=l()(o());u.i(s.A);var h=d()(g);u.push([e.id,`.language-switcher{position:relative}.language-switcher__button{align-items:center;background-color:initial;border:none;color:inherit;column-gap:.25rem;cursor:pointer;display:flex;font:inherit;margin:0;padding:0 .5rem}.language-switcher__button:is(:hover,:focus,[aria-expanded=true]){background-color:var(--color-background-secondary)}@media screen and (width <= 480px){.language-switcher__button>span{display:none}}.language-switcher__button:before{background-color:currentcolor;content:"";height:1.25rem;-webkit-mask-image:url(${h});mask-image:url(${h});-webkit-mask-size:cover;mask-size:cover;width:1.25rem}.language-switcher__dropdown{background-color:var(--color-background-primary);border:1px solid var(--color-border-primary);margin:0;padding:.75rem;position:absolute;right:0;width:max-content;z-index:1}.language_switcher__remember{border-bottom:1px solid var(--color-border-primary);display:flex;font-size:var(--font-size-small);place-items:center;width:100%}.language_switcher__remember mdn-switch{padding:.25rem}:is(.language_switcher__remember mdn-switch):hover{background-color:var(--color-background-secondary)}.language-switcher__list{background-color:var(--color-background-primary);list-style:none;margin:0;padding:0;width:100%}.language-switcher__option{align-items:center;background-color:initial;border:none;color:var(--color-text-primary);column-gap:.25rem;display:flex;font:inherit;margin:0;padding:.25rem;-webkit-text-decoration:none;text-decoration:none;width:100%}.language-switcher__option:hover,.language-switcher__option[data-current]{background-color:var(--color-background-secondary)}`,""]);let _=(0,a.AH)([u.toString()])},15859(e,r,t){e.exports=t.p+"languages.dcba936080e5be86.svg"},64786(e,r,t){t.r(r),t.d(r,{MDNLanguageSwitcher:()=>MDNLanguageSwitcher});var a=t(31011),n=t(97825),o=t(70693),i=t(23727);let l=(0,n.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"><circle cx="12" cy="12" r="10"/><path d="M12 16v-4m0-4h.01"/></svg>`;var s=t(15899),c=t(29303),d=t(30307);t(58623),t(41798);let MDNLanguageSwitcher=class MDNLanguageSwitcher extends(0,o.J)(n.WF){static styles=d.A;static properties={locale:{type:String},native:{type:String},translations:{type:Array},url:{type:String},notFound:{type:Boolean,attribute:"not-found"},_preferredLocale:{state:!0}};constructor(){super(),this.translations=[],this.native="",this.locale="en-US",this.url="/",this.notFound=!1,this._preferredLocale=void 0}_notFoundFallback=new a.YZ(this,{args:()=>[this.notFound],task:async([e])=>{if(e)return await (0,s.$)(location.pathname)}});firstUpdated(){this._preferredLocale=(0,c.E_)(),location.search&&(this.url+=location.search)}get _isLocalePreferred(){return this._preferredLocale==this.locale}_togglePreferredLocale(){if(this.notFound)return;let e=this._preferredLocale??"0";this._isLocalePreferred?((0,c.rM)(),this._preferredLocale=void 0,(0,i.w)(`language_remember: ${e} -> 0`)):((0,c.ud)(this.locale),this._preferredLocale=this.locale,(0,i.w)(`language_remember: ${e} -> ${this.locale}`))}render(){let{translations:e,native:r,locale:t,url:a,notFound:o}=this;return 0===e.length?n.s6:(0,n.qy)`<div class="language-switcher">
       <mdn-dropdown>
         <button
           part="button"
@@ -22,7 +22,7 @@ export const __rspack_esm_id="5667";export const __rspack_esm_ids=["5667"];expor
             >
             <mdn-button
               variant="plain"
-              .icon=${i}
+              .icon=${l}
               icon-only
               href="https://github.com/orgs/mdn/discussions/739"
               target="_blank"
@@ -40,8 +40,9 @@ export const __rspack_esm_id="5667";export const __rspack_esm_ids=["5667"];expor
             <a
               class="language-switcher__option"
               ?data-current=${r===e.locale}
-              @click=${s.rM}
+              @click=${c.rM}
               href=${t.replace(`/${a?"en-US":r}/`,`/${e.locale}/`)}
+              data-glean-id=${`language: ${r} -> ${e.locale}`}
               >${e.native}</a
             >
           </li>
@@ -55,4 +56,4 @@ export const __rspack_esm_id="5667";export const __rspack_esm_ids=["5667"];expor
         >
       </li>
     `}};customElements.define("mdn-language-switcher",MDNLanguageSwitcher)},81519(e,r,t){t.d(r,{O:()=>a});function a(e="id-"){return Math.random().toString(36).replace("0.",e)}}};
-//# sourceMappingURL=5667.332b2c6c10792ad6.js.map
+//# sourceMappingURL=5667.edd77c81ec38a7e2.js.map

package/out/static/client/5667.edd77c81ec38a7e2.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"5667.edd77c81ec38a7e2.js","sources":["webpack://@mdn/fred/./components/language-switcher/element.css","webpack://@mdn/fred/./components/icon/info.svg","webpack://@mdn/fred/./components/language-switcher/element.js","webpack://@mdn/fred/./components/utils/index.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\";\nimport ___CSS_LOADER_AT_RULE_IMPORT_0___ from \"-!../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!../../build/loaders/fix-light-dark.js!../../node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[3]!../global/global.css\";\nimport ___CSS_LOADER_GET_URL_IMPORT___ from \"../../node_modules/css-loader/dist/runtime/getUrl.js\";\nvar ___CSS_LOADER_URL_IMPORT_0___ = new URL(\"../icon/languages.svg\", import.meta.url);\nvar ___CSS_LOADER_EXPORT___ = ___CSS_LOADER_API_IMPORT___(___CSS_LOADER_API_NO_SOURCEMAP_IMPORT___);\n___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_0___);\nvar ___CSS_LOADER_URL_REPLACEMENT_0___ = ___CSS_LOADER_GET_URL_IMPORT___(___CSS_LOADER_URL_IMPORT_0___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `.language-switcher{position:relative}.language-switcher__button{align-items:center;background-color:initial;border:none;color:inherit;column-gap:.25rem;cursor:pointer;display:flex;font:inherit;margin:0;padding:0 .5rem}.language-switcher__button:is(:hover,:focus,[aria-expanded=true]){background-color:var(--color-background-secondary)}@media screen and (width <= 480px){.language-switcher__button>span{display:none}}.language-switcher__button:before{background-color:currentcolor;content:\"\";height:1.25rem;-webkit-mask-image:url(${___CSS_LOADER_URL_REPLACEMENT_0___});mask-image:url(${___CSS_LOADER_URL_REPLACEMENT_0___});-webkit-mask-size:cover;mask-size:cover;width:1.25rem}.language-switcher__dropdown{background-color:var(--color-background-primary);border:1px solid var(--color-border-primary);margin:0;padding:.75rem;position:absolute;right:0;width:max-content;z-index:1}.language_switcher__remember{border-bottom:1px solid var(--color-border-primary);display:flex;font-size:var(--font-size-small);place-items:center;width:100%}.language_switcher__remember mdn-switch{padding:.25rem}:is(.language_switcher__remember mdn-switch):hover{background-color:var(--color-background-secondary)}.language-switcher__list{background-color:var(--color-background-primary);list-style:none;margin:0;padding:0;width:100%}.language-switcher__option{align-items:center;background-color:initial;border:none;color:var(--color-text-primary);column-gap:.25rem;display:flex;font:inherit;margin:0;padding:.25rem;-webkit-text-decoration:none;text-decoration:none;width:100%}.language-switcher__option:hover,.language-switcher__option[data-current]{background-color:var(--color-background-secondary)}`, \"\"]);\n// Exports\nexport default css([___CSS_LOADER_EXPORT___.toString()]);\n","import { svg } from \"lit\"; export default svg`<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\"><circle cx=\"12\" cy=\"12\" r=\"10\"/><path d=\"M12 16v-4m0-4h.01\"/></svg>`;","import { Task } from \"@lit/task\";\nimport { LitElement, html, nothing } from \"lit\";\n\nimport { L10nMixin } from \"../../l10n/mixin.js\";\nimport { gleanClick } from \"../../utils/glean.js\";\n\nimport infoIcon from \"../icon/info.svg?lit\";\nimport { getEnglishDoc } from \"../not-found/utils.js\";\nimport {\n  getPreferredLocale,\n  resetPreferredLocale,\n  setPreferredLocale,\n} from \"../preferred-locale/utils.js\";\n\nimport styles from \"./element.css?lit\";\n\nimport \"../dropdown/element.js\";\nimport \"../switch/element.js\";\n\nexport class MDNLanguageSwitcher extends L10nMixin(LitElement) {\n  static styles = styles;\n\n  static properties = {\n    locale: { type: String },\n    native: { type: String },\n    translations: { type: Array },\n    url: { type: String },\n    notFound: { type: Boolean, attribute: \"not-found\" },\n    _preferredLocale: { state: true },\n  };\n\n  constructor() {\n    super();\n    /** @type {import(\"@rari\").Translation[]} */\n    this.translations = [];\n    this.native = \"\";\n    this.locale = \"en-US\";\n    this.url = \"/\";\n    this.notFound = false;\n    /** @type {string|undefined} */\n    this._preferredLocale = undefined;\n  }\n\n  _notFoundFallback = new Task(this, {\n    args: () => [this.notFound],\n    task: async ([notFound]) => {\n      if (notFound) {\n        return await getEnglishDoc(location.pathname);\n      }\n      return;\n    },\n  });\n\n  firstUpdated() {\n    this._preferredLocale = getPreferredLocale();\n    if (location.search) {\n      this.url += location.search;\n    }\n  }\n\n  get _isLocalePreferred() {\n    return this._preferredLocale == this.locale;\n  }\n\n  _togglePreferredLocale() {\n    if (this.notFound) return;\n    const oldValue = this._preferredLocale ?? \"0\";\n    if (this._isLocalePreferred) {\n      resetPreferredLocale();\n      this._preferredLocale = undefined;\n      gleanClick(`language_remember: ${oldValue} -> 0`);\n    } else {\n      setPreferredLocale(this.locale);\n      this._preferredLocale = this.locale;\n      gleanClick(`language_remember: ${oldValue} -> ${this.locale}`);\n    }\n  }\n\n  render() {\n    const { translations, native, locale, url, notFound } = this;\n\n    if (translations.length === 0) {\n      return nothing;\n    }\n\n    return html`<div class=\"language-switcher\">\n      <mdn-dropdown>\n        <button\n          part=\"button\"\n          slot=\"button\"\n          class=\"language-switcher__button\"\n          type=\"button\"\n          aria-labelledby=\"current-locale\"\n        >\n          <span id=\"current-locale\">${native ?? locale}</span>\n        </button>\n        <div\n          slot=\"dropdown\"\n          class=\"language-switcher__dropdown\"\n          id=\"language-switcher__dropdown\"\n        >\n          <div class=\"language_switcher__remember\">\n            <mdn-switch\n              @toggle=${this._togglePreferredLocale}\n              ?checked=${this._isLocalePreferred}\n              >${this.l10n(\n                \"language-switcher-remember-language\",\n              )`Remember language`}</mdn-switch\n            >\n            <mdn-button\n              variant=\"plain\"\n              .icon=${infoIcon}\n              icon-only\n              href=\"https://github.com/orgs/mdn/discussions/739\"\n              target=\"_blank\"\n              title=${this.l10n(\n                \"language-switcher-enable-this-setting-to-always-sw\",\n              )`Enable this setting to always switch to the current language when available. (Click to learn more.)`}\n              >${this.l10n(\n                \"language-switcher-learn-more\",\n              )`Learn more`}</mdn-button\n            >\n          </div>\n          <ul class=\"language-switcher__list\">\n            ${notFound\n              ? this._notFoundFallback.render({\n                  initial: () => this._renderCurrentLocale(),\n                  pending: () => this._renderCurrentLocale(),\n                  error: () => this._renderCurrentLocale(),\n                  complete: (doc) =>\n                    doc?.other_translations\n                      ? this._renderDropdownItems(\n                          doc.other_translations,\n                          locale,\n                          doc.mdn_url,\n                          notFound,\n                        )\n                      : this._renderCurrentLocale(),\n                })\n              : this._renderDropdownItems(translations, locale, url)}\n          </ul>\n        </div>\n      </mdn-dropdown>\n    </div>`;\n  }\n\n  /**\n   * @param {import(\"@rari\").Translation[]} translations\n   * @param {string} locale\n   * @param {string} url\n   * @param {boolean} notFound\n   */\n  _renderDropdownItems(translations, locale, url, notFound = false) {\n    return translations\n      .sort((a, b) => a.locale.localeCompare(b.locale))\n      .map(\n        (translation) => html`\n          <li>\n            <a\n              class=\"language-switcher__option\"\n              ?data-current=${locale === translation.locale}\n              @click=${resetPreferredLocale}\n              href=${url.replace(\n                `/${notFound ? \"en-US\" : locale}/`,\n                `/${translation.locale}/`,\n              )}\n              data-glean-id=${`language: ${locale} -> ${translation.locale}`}\n              >${translation.native}</a\n            >\n          </li>\n        `,\n      );\n  }\n\n  _renderCurrentLocale() {\n    return html`\n      <li>\n        <a\n          class=\"language-switcher__option\"\n          ?data-current=${true}\n          href=${this.url}\n          >${this.native}</a\n        >\n      </li>\n    `;\n  }\n}\n\ncustomElements.define(\"mdn-language-switcher\", MDNLanguageSwitcher);\n","/**\n * Used to generate a random element id by combining a prefix with a random string.\n *\n * @param {string} prefix\n * @returns {string}\n */\nexport function randomIdString(prefix = \"id-\") {\n  return Math.random().toString(36).replace(\"0.\", prefix);\n}\n"],"names":["MDNLanguageSwitcher","String","Array","Boolean","location","n","customElements","Math"],"mappings":"gOAMI,EAAgC,kBAChC,EAA0B,IAA4B,KAC1D,EAAwB,CAAC,CAAC,GAAiC,EAC3D,IAAI,EAAqC,IAAgC,GAEzE,EAAwB,IAAI,CAAC,CAAC,EAAO,EAAE,CAAE,CAAC,ihBAAihB,EAAE,EAAmC,iBAAiB,EAAE,EAAmC,oiCAAoiC,CAAC,CAAE,GAAG,EAEhsD,MAAe,SAAI,CAAC,EAAwB,QAAQ,GAAG,C,wLCb5B,MAAe,QAAG,CAAC,wPAAwP,CAAC,C,uDCmBhS,IAAMA,oBAAN,MAAMA,2BAA4B,QAAU,IAAU,EAC3D,OAAO,OAAS,GAAM,AAAC,AAEvB,QAAO,WAAa,CAClB,OAAQ,CAAE,KAAMC,MAAO,EACvB,OAAQ,CAAE,KAAMA,MAAO,EACvB,aAAc,CAAE,KAAMC,KAAM,EAC5B,IAAK,CAAE,KAAMD,MAAO,EACpB,SAAU,CAAE,KAAME,QAAS,UAAW,WAAY,EAClD,iBAAkB,CAAE,MAAO,EAAK,CAClC,CAAE,AAEF,cAAc,CACZ,KAAK,GAEL,IAAI,CAAC,YAAY,CAAG,EAAE,CACtB,IAAI,CAAC,MAAM,CAAG,GACd,IAAI,CAAC,MAAM,CAAG,QACd,IAAI,CAAC,GAAG,CAAG,IACX,IAAI,CAAC,QAAQ,CAAG,GAEhB,IAAI,CAAC,gBAAgB,CAAG,MAC1B,CAEA,kBAAoB,IAAI,IAAI,CAAC,IAAI,CAAE,CACjC,KAAM,IAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,CAC3B,KAAM,MAAO,CAAC,EAAS,IACrB,GAAI,EACF,OAAO,MAAM,QAAcC,SAAS,QAAQ,CAGhD,CACF,EAAG,AAEH,eAAe,CACb,IAAI,CAAC,gBAAgB,CAAG,WACpBA,SAAS,MAAM,EACjB,KAAI,CAAC,GAAG,EAAIA,SAAS,MAAM,AAAD,CAE9B,CAEA,IAAI,oBAAqB,CACvB,OAAO,IAAI,CAAC,gBAAgB,EAAI,IAAI,CAAC,MAAM,AAC7C,CAEA,wBAAyB,CACvB,GAAI,IAAI,CAAC,QAAQ,CAAE,OACnB,IAAM,EAAW,IAAI,CAAC,gBAAgB,EAAI,GACtC,KAAI,CAAC,kBAAkB,EACzB,WACA,IAAI,CAAC,gBAAgB,CAAG,OACxB,QAAW,CAAC,mBAAmB,EAAE,EAAS,KAAK,CAAC,IAEhD,SAAmB,IAAI,CAAC,MAAM,EAC9B,IAAI,CAAC,gBAAgB,CAAG,IAAI,CAAC,MAAM,CACnC,QAAW,CAAC,mBAAmB,EAAE,EAAS,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,EAEjE,CAEA,QAAS,CACP,GAAM,CAAE,cAAY,CAAE,QAAM,CAAE,QAAM,CAAE,KAAG,CAAE,UAAQ,CAAE,CAAG,IAAI,QAE5D,AAAI,AAAwB,IAAxB,EAAa,MAAM,CACdC,EAAA,EAAO,CAGT,QAAI,CAAC;;;;;;;;;oCASoB,EAAE,GAAU,EAAO;;;;;;;;;sBASjC,EAAE,IAAI,CAAC,sBAAsB,CAAC;uBAC7B,EAAE,IAAI,CAAC,kBAAkB,CAAC;eAClC,EAAE,IAAI,CAAC,IAAI,CACV,sCACD,CAAC,iBAAiB,CAAC,CAAC;;;;oBAIf,EAAE,EAAS;;;;oBAIX,EAAE,IAAI,CAAC,IAAI,CACf,qDACD,CAAC,mGAAmG,CAAC,CAAC;eACtG,EAAE,IAAI,CAAC,IAAI,CACV,+BACD,CAAC,UAAU,CAAC,CAAC;;;;YAIhB,EAAE,EACE,IAAI,CAAC,iBAAiB,CAAC,MAAM,CAAC,CAC5B,QAAS,IAAM,IAAI,CAAC,oBAAoB,GACxC,QAAS,IAAM,IAAI,CAAC,oBAAoB,GACxC,MAAO,IAAM,IAAI,CAAC,oBAAoB,GACtC,SAAU,AAAC,GACT,GAAK,mBACD,IAAI,CAAC,oBAAoB,CACvB,EAAI,kBAAkB,CACtB,EACA,EAAI,OAAO,CACX,GAEF,IAAI,CAAC,oBAAoB,EACjC,GACA,IAAI,CAAC,oBAAoB,CAAC,EAAc,EAAQ,GAAK;;;;UAI3D,CAAC,AACT,CAQA,qBAAqB,CAAY,CAAE,CAAM,CAAE,CAAG,CAAE,EAAW,EAAK,CAAE,CAChE,OAAO,EACJ,IAAI,CAAC,CAAC,EAAG,IAAM,EAAE,MAAM,CAAC,aAAa,CAAC,EAAE,MAAM,GAC9C,GAAG,CACF,AAAC,GAAgB,QAAI,CAAC;;;;4BAIF,EAAE,IAAW,EAAY,MAAM,CAAC;qBACvC,EAAE,IAAoB,CAAC;mBACzB,EAAE,EAAI,OAAO,CAChB,CAAC,CAAC,EAAE,EAAW,QAAU,EAAO,CAAC,CAAC,CAClC,CAAC,CAAC,EAAE,EAAY,MAAM,CAAC,CAAC,CAAC,EACzB;4BACY,EAAE,CAAC,UAAU,EAAE,EAAO,IAAI,EAAE,EAAY,MAAM,CAAC,CAAC,CAAC;eAC9D,EAAE,EAAY,MAAM,CAAC;;;QAG5B,CAAC,CAEP,CAEA,sBAAuB,CACrB,MAAO,QAAI,CAAC;;;;wBAIQ,EAAE,GAAK;eAChB,EAAE,IAAI,CAAC,GAAG,CAAC;WACf,EAAE,IAAI,CAAC,MAAM,CAAC;;;IAGrB,CAAC,AACH,CACF,EAEAC,eAAe,MAAM,CAAC,wBAAyBN,oB,gCCtLxC,SAAS,EAAe,EAAS,KAAK,EAC3C,OAAOO,KAAK,MAAM,GAAG,QAAQ,CAAC,IAAI,OAAO,CAAC,KAAM,EAClD,C"}

package/out/static/client/5685.d30658d4c274ac13.js

@@ -0,0 +1,4 @@
+export const __rspack_esm_id="5685";export const __rspack_esm_ids=["5685"];export const __webpack_modules__={77108(t,e,a){a.r(e),a.d(e,{MDNLanguageAlwaysRedirectButton:()=>MDNLanguageAlwaysRedirectButton});var n=a(97825),o=a(23727),s=a(29303);let MDNLanguageAlwaysRedirectButton=class MDNLanguageAlwaysRedirectButton extends n.WF{static properties={locale:{type:String},to:{type:String}};constructor(){super(),this.locale="",this.to=""}_handleClick(){(0,o.w)(`language: ${this.locale} -> ${this.to} (always)`),(0,s.ud)(this.to);let t=document.location.pathname.replace(`/${this.locale}/`,`/${this.to}/`);document.location.replace(t)}render(){return(0,n.qy)`<mdn-button variant="plain" @click=${this._handleClick}
+      ><slot></slot
+    ></mdn-button>`}};customElements.define("mdn-language-always-redirect-button",MDNLanguageAlwaysRedirectButton)}};
+//# sourceMappingURL=5685.d30658d4c274ac13.js.map

package/out/static/client/5685.d30658d4c274ac13.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"5685.d30658d4c274ac13.js","sources":["webpack://@mdn/fred/./components/language-always-redirect-button/element.js"],"sourcesContent":["import { LitElement, html } from \"lit\";\n\nimport { gleanClick } from \"../../utils/glean.js\";\nimport { setPreferredLocale } from \"../preferred-locale/utils.js\";\n\nexport class MDNLanguageAlwaysRedirectButton extends LitElement {\n  static properties = {\n    locale: { type: String },\n    to: { type: String },\n  };\n\n  constructor() {\n    super();\n    this.locale = \"\";\n    this.to = \"\";\n  }\n\n  _handleClick() {\n    gleanClick(`language: ${this.locale} -> ${this.to} (always)`);\n    setPreferredLocale(this.to);\n    const url = document.location.pathname.replace(\n      `/${this.locale}/`,\n      `/${this.to}/`,\n    );\n    document.location.replace(url);\n  }\n\n  render() {\n    return html`<mdn-button variant=\"plain\" @click=${this._handleClick}\n      ><slot></slot\n    ></mdn-button>`;\n  }\n}\n\ncustomElements.define(\n  \"mdn-language-always-redirect-button\",\n  MDNLanguageAlwaysRedirectButton,\n);\n"],"names":["MDNLanguageAlwaysRedirectButton","String","s","document","customElements"],"mappings":"mPAKO,IAAMA,gCAAN,MAAMA,wCAAwC,IAAU,CAC7D,OAAO,WAAa,CAClB,OAAQ,CAAE,KAAMC,MAAO,EACvB,GAAI,CAAE,KAAMA,MAAO,CACrB,CAAE,AAEF,cAAc,CACZ,KAAK,GACL,IAAI,CAAC,MAAM,CAAG,GACd,IAAI,CAAC,EAAE,CAAG,EACZ,CAEA,cAAe,CACb,QAAW,CAAC,UAAU,EAAE,IAAI,CAAC,MAAM,CAAC,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC,SAAS,CAAC,EAC5D,GAAAC,EAAA,IAAmB,IAAI,CAAC,EAAE,EAC1B,IAAM,EAAMC,SAAS,QAAQ,CAAC,QAAQ,CAAC,OAAO,CAC5C,CAAC,CAAC,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,CAClB,CAAC,CAAC,EAAE,IAAI,CAAC,EAAE,CAAC,CAAC,CAAC,EAEhBA,SAAS,QAAQ,CAAC,OAAO,CAAC,EAC5B,CAEA,QAAS,CACP,MAAO,QAAI,CAAC,mCAAmC,EAAE,IAAI,CAAC,YAAY,CAAC;;kBAErD,CAAC,AACjB,CACF,EAEAC,eAAe,MAAM,CACnB,sCACAJ,gC"}