@mdn/fred 0.0.1

package/dist/client/2271.1aa120136eb9a8a7.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"2271.1aa120136eb9a8a7.js","sources":["webpack://@mdn/fred/./node_modules/@lit/reactive-element/css-tag.js","webpack://@mdn/fred/./node_modules/@lit/reactive-element/reactive-element.js","webpack://@mdn/fred/./node_modules/lit-element/lit-element.js"],"sourcesContent":["/**\n * @license\n * Copyright 2019 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */\nconst t=globalThis,e=t.ShadowRoot&&(void 0===t.ShadyCSS||t.ShadyCSS.nativeShadow)&&\"adoptedStyleSheets\"in Document.prototype&&\"replace\"in CSSStyleSheet.prototype,s=Symbol(),o=new WeakMap;class n{constructor(t,e,o){if(this._$cssResult$=!0,o!==s)throw Error(\"CSSResult is not constructable. Use `unsafeCSS` or `css` instead.\");this.cssText=t,this.t=e}get styleSheet(){let t=this.o;const s=this.t;if(e&&void 0===t){const e=void 0!==s&&1===s.length;e&&(t=o.get(s)),void 0===t&&((this.o=t=new CSSStyleSheet).replaceSync(this.cssText),e&&o.set(s,t))}return t}toString(){return this.cssText}}const r=t=>new n(\"string\"==typeof t?t:t+\"\",void 0,s),i=(t,...e)=>{const o=1===t.length?t[0]:e.reduce(((e,s,o)=>e+(t=>{if(!0===t._$cssResult$)return t.cssText;if(\"number\"==typeof t)return t;throw Error(\"Value passed to 'css' function must be a 'css' function result: \"+t+\". Use 'unsafeCSS' to pass non-literal values, but take care to ensure page security.\")})(s)+t[o+1]),t[0]);return new n(o,t,s)},S=(s,o)=>{if(e)s.adoptedStyleSheets=o.map((t=>t instanceof CSSStyleSheet?t:t.styleSheet));else for(const e of o){const o=document.createElement(\"style\"),n=t.litNonce;void 0!==n&&o.setAttribute(\"nonce\",n),o.textContent=e.cssText,s.appendChild(o)}},c=e?t=>t:t=>t instanceof CSSStyleSheet?(t=>{let e=\"\";for(const s of t.cssRules)e+=s.cssText;return r(e)})(t):t;export{n as CSSResult,S as adoptStyles,i as css,c as getCompatibleStyle,e as supportsAdoptingStyleSheets,r as unsafeCSS};\n//# sourceMappingURL=css-tag.js.map\n","import{getCompatibleStyle as t,adoptStyles as s}from\"./css-tag.js\";export{CSSResult,css,supportsAdoptingStyleSheets,unsafeCSS}from\"./css-tag.js\";\n/**\n * @license\n * Copyright 2017 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */const{is:i,defineProperty:e,getOwnPropertyDescriptor:h,getOwnPropertyNames:r,getOwnPropertySymbols:o,getPrototypeOf:n}=Object,a=globalThis,c=a.trustedTypes,l=c?c.emptyScript:\"\",p=a.reactiveElementPolyfillSupport,d=(t,s)=>t,u={toAttribute(t,s){switch(s){case Boolean:t=t?l:null;break;case Object:case Array:t=null==t?t:JSON.stringify(t)}return t},fromAttribute(t,s){let i=t;switch(s){case Boolean:i=null!==t;break;case Number:i=null===t?null:Number(t);break;case Object:case Array:try{i=JSON.parse(t)}catch(t){i=null}}return i}},f=(t,s)=>!i(t,s),b={attribute:!0,type:String,converter:u,reflect:!1,useDefault:!1,hasChanged:f};Symbol.metadata??=Symbol(\"metadata\"),a.litPropertyMetadata??=new WeakMap;class y extends HTMLElement{static addInitializer(t){this._$Ei(),(this.l??=[]).push(t)}static get observedAttributes(){return this.finalize(),this._$Eh&&[...this._$Eh.keys()]}static createProperty(t,s=b){if(s.state&&(s.attribute=!1),this._$Ei(),this.prototype.hasOwnProperty(t)&&((s=Object.create(s)).wrapped=!0),this.elementProperties.set(t,s),!s.noAccessor){const i=Symbol(),h=this.getPropertyDescriptor(t,i,s);void 0!==h&&e(this.prototype,t,h)}}static getPropertyDescriptor(t,s,i){const{get:e,set:r}=h(this.prototype,t)??{get(){return this[s]},set(t){this[s]=t}};return{get:e,set(s){const h=e?.call(this);r?.call(this,s),this.requestUpdate(t,h,i)},configurable:!0,enumerable:!0}}static getPropertyOptions(t){return this.elementProperties.get(t)??b}static _$Ei(){if(this.hasOwnProperty(d(\"elementProperties\")))return;const t=n(this);t.finalize(),void 0!==t.l&&(this.l=[...t.l]),this.elementProperties=new Map(t.elementProperties)}static finalize(){if(this.hasOwnProperty(d(\"finalized\")))return;if(this.finalized=!0,this._$Ei(),this.hasOwnProperty(d(\"properties\"))){const t=this.properties,s=[...r(t),...o(t)];for(const i of s)this.createProperty(i,t[i])}const t=this[Symbol.metadata];if(null!==t){const s=litPropertyMetadata.get(t);if(void 0!==s)for(const[t,i]of s)this.elementProperties.set(t,i)}this._$Eh=new Map;for(const[t,s]of this.elementProperties){const i=this._$Eu(t,s);void 0!==i&&this._$Eh.set(i,t)}this.elementStyles=this.finalizeStyles(this.styles)}static finalizeStyles(s){const i=[];if(Array.isArray(s)){const e=new Set(s.flat(1/0).reverse());for(const s of e)i.unshift(t(s))}else void 0!==s&&i.push(t(s));return i}static _$Eu(t,s){const i=s.attribute;return!1===i?void 0:\"string\"==typeof i?i:\"string\"==typeof t?t.toLowerCase():void 0}constructor(){super(),this._$Ep=void 0,this.isUpdatePending=!1,this.hasUpdated=!1,this._$Em=null,this._$Ev()}_$Ev(){this._$ES=new Promise((t=>this.enableUpdating=t)),this._$AL=new Map,this._$E_(),this.requestUpdate(),this.constructor.l?.forEach((t=>t(this)))}addController(t){(this._$EO??=new Set).add(t),void 0!==this.renderRoot&&this.isConnected&&t.hostConnected?.()}removeController(t){this._$EO?.delete(t)}_$E_(){const t=new Map,s=this.constructor.elementProperties;for(const i of s.keys())this.hasOwnProperty(i)&&(t.set(i,this[i]),delete this[i]);t.size>0&&(this._$Ep=t)}createRenderRoot(){const t=this.shadowRoot??this.attachShadow(this.constructor.shadowRootOptions);return s(t,this.constructor.elementStyles),t}connectedCallback(){this.renderRoot??=this.createRenderRoot(),this.enableUpdating(!0),this._$EO?.forEach((t=>t.hostConnected?.()))}enableUpdating(t){}disconnectedCallback(){this._$EO?.forEach((t=>t.hostDisconnected?.()))}attributeChangedCallback(t,s,i){this._$AK(t,i)}_$ET(t,s){const i=this.constructor.elementProperties.get(t),e=this.constructor._$Eu(t,i);if(void 0!==e&&!0===i.reflect){const h=(void 0!==i.converter?.toAttribute?i.converter:u).toAttribute(s,i.type);this._$Em=t,null==h?this.removeAttribute(e):this.setAttribute(e,h),this._$Em=null}}_$AK(t,s){const i=this.constructor,e=i._$Eh.get(t);if(void 0!==e&&this._$Em!==e){const t=i.getPropertyOptions(e),h=\"function\"==typeof t.converter?{fromAttribute:t.converter}:void 0!==t.converter?.fromAttribute?t.converter:u;this._$Em=e,this[e]=h.fromAttribute(s,t.type)??this._$Ej?.get(e)??null,this._$Em=null}}requestUpdate(t,s,i){if(void 0!==t){const e=this.constructor,h=this[t];if(i??=e.getPropertyOptions(t),!((i.hasChanged??f)(h,s)||i.useDefault&&i.reflect&&h===this._$Ej?.get(t)&&!this.hasAttribute(e._$Eu(t,i))))return;this.C(t,s,i)}!1===this.isUpdatePending&&(this._$ES=this._$EP())}C(t,s,{useDefault:i,reflect:e,wrapped:h},r){i&&!(this._$Ej??=new Map).has(t)&&(this._$Ej.set(t,r??s??this[t]),!0!==h||void 0!==r)||(this._$AL.has(t)||(this.hasUpdated||i||(s=void 0),this._$AL.set(t,s)),!0===e&&this._$Em!==t&&(this._$Eq??=new Set).add(t))}async _$EP(){this.isUpdatePending=!0;try{await this._$ES}catch(t){Promise.reject(t)}const t=this.scheduleUpdate();return null!=t&&await t,!this.isUpdatePending}scheduleUpdate(){return this.performUpdate()}performUpdate(){if(!this.isUpdatePending)return;if(!this.hasUpdated){if(this.renderRoot??=this.createRenderRoot(),this._$Ep){for(const[t,s]of this._$Ep)this[t]=s;this._$Ep=void 0}const t=this.constructor.elementProperties;if(t.size>0)for(const[s,i]of t){const{wrapped:t}=i,e=this[s];!0!==t||this._$AL.has(s)||void 0===e||this.C(s,void 0,i,e)}}let t=!1;const s=this._$AL;try{t=this.shouldUpdate(s),t?(this.willUpdate(s),this._$EO?.forEach((t=>t.hostUpdate?.())),this.update(s)):this._$EM()}catch(s){throw t=!1,this._$EM(),s}t&&this._$AE(s)}willUpdate(t){}_$AE(t){this._$EO?.forEach((t=>t.hostUpdated?.())),this.hasUpdated||(this.hasUpdated=!0,this.firstUpdated(t)),this.updated(t)}_$EM(){this._$AL=new Map,this.isUpdatePending=!1}get updateComplete(){return this.getUpdateComplete()}getUpdateComplete(){return this._$ES}shouldUpdate(t){return!0}update(t){this._$Eq&&=this._$Eq.forEach((t=>this._$ET(t,this[t]))),this._$EM()}updated(t){}firstUpdated(t){}}y.elementStyles=[],y.shadowRootOptions={mode:\"open\"},y[d(\"elementProperties\")]=new Map,y[d(\"finalized\")]=new Map,p?.({ReactiveElement:y}),(a.reactiveElementVersions??=[]).push(\"2.1.0\");export{y as ReactiveElement,s as adoptStyles,u as defaultConverter,t as getCompatibleStyle,f as notEqual};\n//# sourceMappingURL=reactive-element.js.map\n","import{ReactiveElement as t}from\"@lit/reactive-element\";export*from\"@lit/reactive-element\";import{render as e,noChange as r}from\"lit-html\";export*from\"lit-html\";\n/**\n * @license\n * Copyright 2017 Google LLC\n * SPDX-License-Identifier: BSD-3-Clause\n */const s=globalThis;class i extends t{constructor(){super(...arguments),this.renderOptions={host:this},this._$Do=void 0}createRenderRoot(){const t=super.createRenderRoot();return this.renderOptions.renderBefore??=t.firstChild,t}update(t){const r=this.render();this.hasUpdated||(this.renderOptions.isConnected=this.isConnected),super.update(t),this._$Do=e(r,this.renderRoot,this.renderOptions)}connectedCallback(){super.connectedCallback(),this._$Do?.setConnected(!0)}disconnectedCallback(){super.disconnectedCallback(),this._$Do?.setConnected(!1)}render(){return r}}i._$litElement$=!0,i[\"finalized\"]=!0,s.litElementHydrateSupport?.({LitElement:i});const o=s.litElementPolyfillSupport;o?.({LitElement:i});const n={_$AK:(t,e,r)=>{t._$AK(e,r)},_$AL:t=>t._$AL};(s.litElementVersions??=[]).push(\"4.2.0\");export{i as LitElement,n as _$LE};\n//# sourceMappingURL=lit-element.js.map\n"],"names":["globalThis","Document","CSSStyleSheet","Symbol","WeakMap","t","e","Error","s","Object","Boolean","Array","JSON","Number","String","y","HTMLElement","Map","litPropertyMetadata","Set","Promise","document","i","arguments"],"mappings":"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"}

package/dist/client/2297.0a9c74ff65a39b9e.js

@@ -0,0 +1,36 @@
+export const __webpack_ids__=["2297"];export const __webpack_modules__={62249:function(t,e,i){i.d(e,{Z:()=>n});var s=i(8081),r=i.n(s),l=i(23645),o=i.n(l)()(r());o.push([t.id,".visually-hidden{border:0!important;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important;clip:rect(1px,1px,1px,1px)!important;clip-path:inset(50%)!important}",""]);let n=o.toString()},85660:function(t,e,i){var s=i(14703),r=i(69535),l=i(44413);let o=(0,s.YP)`<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24"><path d="M10 20a1 1 0 0 0 .553.895l2 1A1 1 0 0 0 14 21v-7a2 2 0 0 1 .517-1.341L21.74 4.67A1 1 0 0 0 21 3H3a1 1 0 0 0-.742 1.67l7.225 7.989A2 2 0 0 1 10 14z"/></svg>`;var n=i(9451);let SidebarFilterer=class SidebarFilterer{constructor(t){this.allHeadings=[...t.querySelectorAll("li strong")].filter(t=>t instanceof HTMLElement),this.allParents=[...t.querySelectorAll("details")];let e=[...t.querySelectorAll("a[href]")].filter(t=>t instanceof HTMLAnchorElement);this.items=e.map(t=>({haystack:(t.textContent||"").toLowerCase(),link:t,container:this.getContainerOf(t),heading:this.getHeadingOf(t),parents:this.getParentsOf(t)})),this.toc=t.querySelector(".reference-toc")||null}applyFilter(t){if(t)return this.toggleTOC(!1),this.showOnlyMatchingItems(t);this.toggleTOC(!0),this.showAllItems()}toggleTOC(t){this.toc&&this.toggleElement(this.toc,t)}toggleElement(t,e){t.style.display=e?"":"none"}showAllItems(){for(let{link:t}of this.items)this.resetLink(t);for(let t of this.allHeadings)this.resetHeading(t);for(let t of this.allParents)this.resetParent(t)}resetLink(t){this.resetHighlighting(t);let e=this.getContainerOf(t);this.toggleElement(e,!0)}getContainerOf(t){return t.closest("li")||t}resetHeading(t){let e=this.getContainerOf(t);this.toggleElement(e,!0)}resetParent(t){let e=this.getContainerOf(t);this.toggleElement(e,!0),t.dataset.wasOpen&&(t.open=JSON.parse(t.dataset.wasOpen),delete t.dataset.wasOpen)}resetHighlighting(t){let e=[...t.querySelectorAll("span, mark")],i=new Set;for(let t of e){let e=t.parentElement;t.replaceWith(document.createTextNode(t.textContent||"")),e&&i.add(e)}for(let t of i)t.normalize()}showOnlyMatchingItems(t){for(let t of this.allHeadings)this.hideHeading(t);for(let t of this.allParents)this.collapseParent(t);let e=t.toLowerCase().split(/\s+/).filter(Boolean),i=0;for(let{haystack:t,link:s,container:r,heading:l,parents:o}of this.items){this.resetHighlighting(s);let n=e.every(e=>t.includes(e));if(this.toggleElement(r,n),n)for(let t of(i++,this.highlightMatches(s,e),l&&this.showHeading(l),o))this.expandParent(t)}return i}hideHeading(t){let e=this.getContainerOf(t);this.toggleElement(e,!1)}collapseParent(t){let e=this.getContainerOf(t);this.toggleElement(e,!1),t.dataset.wasOpen=t.dataset.wasOpen||String(t.open),t.open=!1}highlightMatches(t,e){for(let i of this.getTextNodesOf(t)){let t=i.textContent?.toLowerCase();if(!t)continue;let s=new Map;for(let i of e){let e=t.indexOf(i);-1!==e&&s.set(e,e+i.length)}let r=[...s.entries()].sort(([t,e],[i,s])=>t-i||e-s),l=this.replaceChildNode(i,"span");l.className="highlight-container";let o=[...l.childNodes].find(t=>t instanceof Text);if(!o)continue;let n=o,a=0;for(let[t,e]of r){if(t<a)continue;let i=n.splitText(t-a),s=i.splitText(e-t);this.replaceChildNode(i,"mark"),n=s,a=e}}}getTextNodesOf(t){let e=[t],i=[];for(let t of e)for(let s of t.childNodes)s.nodeType===Node.TEXT_NODE?i.push(s):s.hasChildNodes&&s.hasChildNodes()&&e.push(s);return i}replaceChildNode(t,e){let i=t.textContent,s=document.createElement(e);return s.textContent=i||"",t.replaceWith(s),s}showHeading(t){let e=t&&this.getContainerOf(t);e&&this.toggleElement(e,!0)}getHeadingOf(t){return this.findFirstElementBefore(t,this.allHeadings)}findFirstElementBefore(t,e){return[...e].reverse().find(e=>e.compareDocumentPosition(t)&Node.DOCUMENT_POSITION_FOLLOWING)}expandParent(t){let e=this.getContainerOf(t);this.toggleElement(e,!0),t.open=!0}getParentsOf(t){let e=[],i=t.parentElement?t.parentElement.closest("details"):null;for(;i;)e.push(i),i=i.parentElement?i.parentElement.closest("details"):null;return e}};let MDNSidebarFilter=class MDNSidebarFilter extends(0,r.q)(s.oi){static styles=n.Z;static properties={query:{type:String},matchCount:{state:!0,type:Number},_active:{state:!0,type:Boolean}};constructor(){super(),this.query="",this.matchCount=void 0,this._active=!1,this.hasTyped=!1,this._filterer=null,this._quicklinks=null,this._sidebarInnerNav=null}firstUpdated(){this._quicklinks=document.querySelector(".left-sidebar"),this._quicklinks&&(this._sidebarInnerNav=this._quicklinks.querySelector(".left-sidebar__content")||null)}_saveScrollPosition(){for(let t of[this._quicklinks,this._sidebarInnerNav])t&&void 0===t.dataset.lastScrollTop&&t.scrollTop>0&&(t.dataset.lastScrollTop=String(t.scrollTop),t.scrollTop=0)}_restoreScrollPosition(){for(let t of[this._quicklinks,this._sidebarInnerNav])t&&"string"==typeof t.dataset.lastScrollTop&&(t.scrollTop=Number(t.dataset.lastScrollTop),delete t.dataset.lastScrollTop)}updated(t){if(t.has("query")&&(this.query&&this.query.trim().length>0&&!this.hasTyped&&(this.hasTyped=!0),this._quicklinks)){if(!this._filterer){let t=this._quicklinks.querySelector(".left-sidebar__content");t instanceof HTMLElement&&(this._filterer=new SidebarFilterer(t))}let t=this.query.trim();if(t&&this._saveScrollPosition(),this._filterer){let e=this._filterer.applyFilter(t);this.matchCount=e}t||this._restoreScrollPosition()}}_onFocus(){this._active=!0}_onInput(t){let e=t.target;this.query=e.value}_clearFilter(){this.query="",this._active=!1}render(){return(0,s.dy)`
+      <div class="sidebar-filter ${this.query?"has-input":""}">
+        <label
+          id="sidebar-filter-label"
+          class="sidebar-filter-label"
+          for="sidebar-filter-input"
+        >
+          <span class="icon">${o}</span>
+          <span class="visually-hidden">${this.l10n`Filter sidebar`}</span>
+        </label>
+        <input
+          id="sidebar-filter-input"
+          autocomplete="off"
+          class="sidebar-filter-input-field ${this._active?"is-active":""}"
+          type="text"
+          placeholder=${this.l10n`Filter`}
+          .value=${this.query}
+          @focus=${this._onFocus}
+          @input=${this._onInput}
+        />
+        ${void 0===this.matchCount?"":(0,s.dy)`
+              <span class="sidebar-filter-count">
+                ${this.l10n.raw({id:"sidebar-filter-matches",args:{matches:this.matchCount}})}
+              </span>
+            `}
+        <mdn-button
+          class="clear-sidebar-filter-button"
+          variant="plain"
+          label=${this.l10n`Clear filter input`}
+          .icon=${l.Z}
+          icon-only
+          @click=${this._clearFilter}
+        ></mdn-button>
+      </div>
+    `}};customElements.define("mdn-sidebar-filter",MDNSidebarFilter)},9451:function(t,e,i){i.d(e,{Z:()=>d});var s=i(14703),r=i(8081),l=i.n(r),o=i(23645),n=i.n(o),a=i(62249),h=n()(l());h.i(a.Z),h.push([t.id,':host{display:flex;flex-direction:column;position:relative}:host .sidebar-filter{display:flex;place-items:center}:host .sidebar-filter-label{left:.375em;position:absolute;top:.375em}:is(:host .sidebar-filter-label) .icon{color:var(--color-text-primary)}:host .clear-sidebar-filter-button{--button-bg:none;--button-color:var(--color-text-primary);--button-border-color:none;position:absolute;right:0}:is(:host .clear-sidebar-filter-button):hover{--button-color:var(--color-text-secondary)}:host .sidebar-filter-input-field{border:1px solid var(--color-border-primary);border-radius:1em;color:var(--color-text-primary);padding-bottom:.5em;padding-left:2em;padding-top:.5em;width:100%}:is(:host .sidebar-filter-input-field):focus{outline:0 none;--csstools-light-dark-toggle--0:var(--csstools-color-scheme--light) #5e9eff;border-color:light-dark(#0085f2,#5e9eff)}:is(:host .sidebar-filter-input-field):focus .icon{color:var(--color-border-primary)}[value=""]:is(:host .sidebar-filter-input-field):not(:focus,.is-active){width:5em}[value=""]:is(:host .sidebar-filter-input-field):not(:focus,.is-active)~.clear-sidebar-filter-button,[value=""]:is(:host .sidebar-filter-input-field):not(:focus,.is-active)~.sidebar-filter-count{display:none}.is-active:is(:host .sidebar-filter-input-field),:is(:host .sidebar-filter-input-field):focus{padding-right:7.5em}:is(:host .sidebar-filter-input-field)~.sidebar-filter-count{background:var(--color-background-blue);border-radius:1em;color:var(--color-text-secondary);font-size:.7rem;padding:0 .5em;position:absolute;right:2.5em;white-space:nowrap}:host .button{appearance:none;background:none;border:none}:is(:host .icon) svg{height:1em;width:1em}',""]);let d=(0,s.iv)([h.toString()])},44413:function(t,e,i){i.d(e,{Z:()=>r});var s=i(14703);let r=(0,s.YP)`<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="2" viewBox="0 0 24 24"><path d="M18 6 6 18M6 6l12 12"/></svg>`}};
+//# sourceMappingURL=2297.0a9c74ff65a39b9e.js.map

package/dist/client/2297.0a9c74ff65a39b9e.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"2297.0a9c74ff65a39b9e.js","sources":["webpack://@mdn/fred/./components/visually-hidden/global.css?9b14","webpack://@mdn/fred/./components/icon/filter.svg","webpack://@mdn/fred/./components/sidebar-filter/sidebar-filterer.js","webpack://@mdn/fred/./components/sidebar-filter/element.js","webpack://@mdn/fred/./components/sidebar-filter/element.css","webpack://@mdn/fred/./components/icon/cancel.svg"],"sourcesContent":["// 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;height:1px!important;margin:-1px!important;overflow:hidden!important;padding:0!important;position:absolute!important;white-space:nowrap!important;width:1px!important;clip:rect(1px,1px,1px,1px)!important;clip-path:inset(50%)!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\" width=\"24\" height=\"24\" fill=\"none\" stroke=\"currentColor\" stroke-linecap=\"round\" stroke-linejoin=\"round\" stroke-width=\"2\" viewBox=\"0 0 24 24\"><path d=\"M10 20a1 1 0 0 0 .553.895l2 1A1 1 0 0 0 14 21v-7a2 2 0 0 1 .517-1.341L21.74 4.67A1 1 0 0 0 21 3H3a1 1 0 0 0-.742 1.67l7.225 7.989A2 2 0 0 1 10 14z\"/></svg>`;","/**\n * Splits a search query into an array of lowercase terms.\n * @param {string} query The input search query.\n * @returns {string[]} The resulting array of query terms.\n */\nfunction splitQuery(query) {\n  return query.toLowerCase().split(/\\s+/).filter(Boolean);\n}\n\n/**\n * @typedef {object} Item\n * @property {string} haystack - The lowercased text for matching.\n * @property {HTMLAnchorElement} link - The anchor element.\n * @property {HTMLElement} container - The container (closest 'li' element).\n * @property {HTMLElement|undefined} heading - The heading element (if any).\n * @property {HTMLDetailsElement[]} parents - The parent details elements.\n */\n\n/**\n * A class to filter sidebar items based on search queries.\n */\nexport class SidebarFilterer {\n  /**\n   * @param {HTMLElement} root The root element to search within.\n   */\n  constructor(root) {\n    /**\n     * @type {HTMLElement[]}\n     */\n    this.allHeadings = [...root.querySelectorAll(\"li strong\")].filter(\n      (el) => el instanceof HTMLElement,\n    );\n\n    /**\n     * @type {HTMLDetailsElement[]}\n     */\n    this.allParents = [...root.querySelectorAll(\"details\")];\n\n    const links = [...root.querySelectorAll(\"a[href]\")].filter(\n      (a) => a instanceof HTMLAnchorElement,\n    );\n\n    /**\n     * @type {Item[]}\n     */\n    this.items = links.map((link) => ({\n      haystack: (link.textContent || \"\").toLowerCase(),\n      link,\n      container: this.getContainerOf(link),\n      heading: this.getHeadingOf(link),\n      parents: this.getParentsOf(link),\n    }));\n\n    /**\n     * @type {HTMLElement|null}\n     */\n    this.toc = root.querySelector(\".reference-toc\") || null;\n  }\n\n  /**\n   * Applies a filter to the sidebar items.\n   * @param {string} query The filter query.\n   * @returns {number|undefined} The number of matching items if a query is provided; otherwise undefined.\n   */\n  applyFilter(query) {\n    if (query) {\n      this.toggleTOC(false);\n      return this.showOnlyMatchingItems(query);\n    } else {\n      this.toggleTOC(true);\n      this.showAllItems();\n      return;\n    }\n  }\n\n  /**\n   * Toggles the TOC (table of contents) element's visibility.\n   * @private\n   * @param {boolean} show Whether to show the TOC.\n   */\n  toggleTOC(show) {\n    if (this.toc) {\n      this.toggleElement(this.toc, show);\n    }\n  }\n\n  /**\n   * Toggles the display style of an element.\n   * @private\n   * @param {HTMLElement} el The element to toggle.\n   * @param {boolean} show Whether to show (true) or hide (false) the element.\n   */\n  toggleElement(el, show) {\n    el.style.display = show ? \"\" : \"none\";\n  }\n\n  /**\n   * Resets and shows all sidebar items.\n   */\n  showAllItems() {\n    for (const { link } of this.items) this.resetLink(link);\n    for (const heading of this.allHeadings) this.resetHeading(heading);\n    for (const parent of this.allParents) this.resetParent(parent);\n  }\n\n  /**\n   * Resets a link by removing any highlighting and ensuring its container is visible.\n   * @private\n   * @param {HTMLAnchorElement} link The link to reset.\n   */\n  resetLink(link) {\n    this.resetHighlighting(link);\n    const container = this.getContainerOf(link);\n    this.toggleElement(container, true);\n  }\n\n  /**\n   * Returns the container element (the closest \"li\") for the provided element.\n   * @private\n   * @param {HTMLElement} el The element to find the container for.\n   * @returns {HTMLElement} The container element.\n   */\n  getContainerOf(el) {\n    return el.closest(\"li\") || el;\n  }\n\n  /**\n   * Resets a heading by ensuring its container is visible.\n   * @private\n   * @param {HTMLElement} heading The heading element to reset.\n   */\n  resetHeading(heading) {\n    const container = this.getContainerOf(heading);\n    this.toggleElement(container, true);\n  }\n\n  /**\n   * Resets a parent details element by showing its container and restoring its open state.\n   * @private\n   * @param {HTMLDetailsElement} parent The details element to reset.\n   */\n  resetParent(parent) {\n    const container = this.getContainerOf(parent);\n    this.toggleElement(container, true);\n    if (parent.dataset.wasOpen) {\n      parent.open = JSON.parse(parent.dataset.wasOpen);\n      delete parent.dataset.wasOpen;\n    }\n  }\n\n  /**\n   * Removes highlighting from the given link element.\n   * @private\n   * @param {HTMLAnchorElement} link The link element to reset.\n   */\n  resetHighlighting(link) {\n    const nodes = [...link.querySelectorAll(\"span, mark\")];\n    const parents = new Set();\n    for (const node of nodes) {\n      const parent = node.parentElement;\n      node.replaceWith(document.createTextNode(node.textContent || \"\"));\n      if (parent) {\n        parents.add(parent);\n      }\n    }\n    for (const parent of parents) parent.normalize();\n  }\n\n  /**\n   * Shows only the items that match the provided query.\n   * @param {string} query The search query.\n   * @returns {number} The count of matching items.\n   */\n  showOnlyMatchingItems(query) {\n    for (const heading of this.allHeadings) this.hideHeading(heading);\n    for (const parent of this.allParents) this.collapseParent(parent);\n\n    // Split the query into search terms.\n    const terms = splitQuery(query);\n    let matchCount = 0;\n\n    // Evaluate each item.\n    for (const { haystack, link, container, heading, parents } of this.items) {\n      this.resetHighlighting(link);\n      const isMatch = terms.every((needle) => haystack.includes(needle));\n\n      this.toggleElement(container, isMatch);\n\n      if (isMatch) {\n        matchCount++;\n        this.highlightMatches(link, terms);\n        if (heading) {\n          this.showHeading(heading);\n        }\n        for (const parent of parents) {\n          this.expandParent(parent);\n        }\n      }\n    }\n\n    return matchCount;\n  }\n\n  /**\n   * Hides a heading element by toggling its container.\n   * @private\n   * @param {HTMLElement} heading The heading element to hide.\n   */\n  hideHeading(heading) {\n    const container = this.getContainerOf(heading);\n    this.toggleElement(container, false);\n  }\n\n  /**\n   * Collapses a parent details element and hides its container.\n   * @private\n   * @param {HTMLDetailsElement} parent The details element to collapse.\n   */\n  collapseParent(parent) {\n    const container = this.getContainerOf(parent);\n    this.toggleElement(container, false);\n    parent.dataset.wasOpen = parent.dataset.wasOpen || String(parent.open);\n    parent.open = false;\n  }\n\n  /**\n   * Highlights matching terms within an element by wrapping them with a <mark> element.\n   * @private\n   * @param {HTMLElement} el The element to highlight.\n   * @param {string[]} terms The search terms.\n   */\n  highlightMatches(el, terms) {\n    const nodes = this.getTextNodesOf(el);\n\n    for (const node of nodes) {\n      const haystack = node.textContent?.toLowerCase();\n      if (!haystack) {\n        continue;\n      }\n\n      const ranges = new Map();\n      for (const needle of terms) {\n        const index = haystack.indexOf(needle);\n        if (index !== -1) {\n          ranges.set(index, index + needle.length);\n        }\n      }\n      const sortedRanges = [...ranges.entries()].sort(\n        ([x1, y1], [x2, y2]) => x1 - x2 || y1 - y2,\n      );\n\n      const span = this.replaceChildNode(node, \"span\");\n      span.className = \"highlight-container\";\n\n      /** @type {Text|undefined} */\n      const initialRest = [...span.childNodes].find(\n        (node) => node instanceof Text,\n      );\n\n      if (!initialRest) {\n        continue;\n      }\n\n      /** @type {Text} */\n      let rest = initialRest;\n      let cursor = 0;\n\n      for (const [rangeBegin, rangeEnd] of sortedRanges) {\n        if (rangeBegin < cursor) {\n          // Ignore overlapping or conflicting ranges.\n          continue;\n        }\n\n        // Split the text node to isolate the matching segment.\n        const match = rest.splitText(rangeBegin - cursor);\n        const newRest = match.splitText(rangeEnd - rangeBegin);\n\n        // Replace the matching text node with a <mark> element.\n        this.replaceChildNode(match, \"mark\");\n\n        rest = newRest;\n        cursor = rangeEnd;\n      }\n    }\n  }\n\n  /**\n   * Recursively collects all text nodes under a given node.\n   * @private\n   * @param {Node} node The node to search within.\n   * @returns {Array<Node & Text>} An array of text nodes.\n   */\n  getTextNodesOf(node) {\n    const parents = [node];\n    /** @type {Array<Node & Text>} */\n    const nodes = [];\n\n    for (const parent of parents) {\n      for (const childNode of parent.childNodes) {\n        if (childNode.nodeType === Node.TEXT_NODE) {\n          // @ts-expect-error TypeScript doesn't understand that Node.TEXT_NODE implies Node & Text.\n          nodes.push(childNode);\n        } else if (childNode.hasChildNodes && childNode.hasChildNodes()) {\n          parents.push(childNode);\n        }\n      }\n    }\n    return nodes;\n  }\n\n  /**\n   * Replaces a child node with a new element of the specified tag.\n   * @private\n   * @param {ChildNode} node The node to be replaced.\n   * @param {string} tagName The tag name for the new element.\n   * @returns {HTMLElement} The newly created element.\n   */\n  replaceChildNode(node, tagName) {\n    const text = node.textContent;\n    const newNode = document.createElement(tagName);\n    newNode.textContent = text || \"\";\n    node.replaceWith(newNode);\n    return newNode;\n  }\n\n  /**\n   * Ensures that the container for the given heading is visible.\n   * @private\n   * @param {HTMLElement} heading The heading element to show.\n   */\n  showHeading(heading) {\n    const container = heading && this.getContainerOf(heading);\n    if (container) {\n      this.toggleElement(container, true);\n    }\n  }\n\n  /**\n   * Retrieves the first heading element (from allHeadings) that appears before the specified element.\n   * @private\n   * @param {HTMLElement} el The reference element.\n   * @returns {HTMLElement|undefined} The matching heading or undefined.\n   */\n  getHeadingOf(el) {\n    return this.findFirstElementBefore(el, this.allHeadings);\n  }\n\n  /**\n   * Finds the first element among candidates that occurs before the specified element in the document.\n   * @private\n   * @param {HTMLElement} el The reference element.\n   * @param {HTMLElement[]} candidates An array of candidate elements.\n   * @returns {HTMLElement|undefined} The found element or undefined if none found.\n   */\n  findFirstElementBefore(el, candidates) {\n    return [...candidates]\n      .reverse()\n      .find(\n        (candidate) =>\n          candidate.compareDocumentPosition(el) &\n          Node.DOCUMENT_POSITION_FOLLOWING,\n      );\n  }\n\n  /**\n   * Expands a parent details element and ensures its container is visible.\n   * @private\n   * @param {HTMLDetailsElement} parent The details element to expand.\n   */\n  expandParent(parent) {\n    const container = this.getContainerOf(parent);\n    this.toggleElement(container, true);\n    parent.open = true;\n  }\n\n  /**\n   * Retrieves all parent <details> elements for the given element.\n   * @private\n   * @param {HTMLElement} el The element for which to find parent details.\n   * @returns {HTMLDetailsElement[]} An array of parent <details> elements.\n   */\n  getParentsOf(el) {\n    const parents = [];\n    let parent = el.parentElement ? el.parentElement.closest(\"details\") : null;\n\n    while (parent) {\n      parents.push(parent);\n      parent = parent.parentElement\n        ? parent.parentElement.closest(\"details\")\n        : null;\n    }\n\n    return parents;\n  }\n}\n","/**\n * @file Sidebar filter Lit element.\n */\n\nimport { LitElement, html } from \"lit\";\n\nimport { L10nMixin } from \"../../l10n/mixin.js\";\nimport cancelIcon from \"../icon/cancel.svg?lit\";\nimport filterIcon from \"../icon/filter.svg?lit\";\n\nimport styles from \"./element.css?lit\";\nimport { SidebarFilterer } from \"./sidebar-filterer.js\";\n\nclass MDNSidebarFilter extends L10nMixin(LitElement) {\n  static styles = styles;\n\n  static properties = {\n    query: { type: String },\n    matchCount: { state: true, type: Number },\n    _active: { state: true, type: Boolean },\n  };\n\n  /**\n   * Creates an instance of SidebarFilterElement.\n   */\n  constructor() {\n    super();\n    /** @type {string} */\n    this.query = \"\";\n    /** @type {number|undefined} */\n    this.matchCount = undefined;\n    /** @type {boolean} */\n    this._active = false;\n    /** @type {boolean} */\n    this.hasTyped = false;\n    /**\n     * @type {SidebarFilterer|null}\n     */\n    this._filterer = null;\n    /**\n     * @type {HTMLElement|null}\n     */\n    this._quicklinks = null;\n    /**\n     * @type {HTMLElement|null}\n     */\n    this._sidebarInnerNav = null;\n  }\n\n  firstUpdated() {\n    this._quicklinks = document.querySelector(\".left-sidebar\");\n    if (this._quicklinks) {\n      this._sidebarInnerNav =\n        /** @type {HTMLElement|null} */ (\n          this._quicklinks.querySelector(\".left-sidebar__content\")\n        ) || null;\n    }\n  }\n\n  /**\n   * Saves the current scroll position from the specified elements and resets them.\n   * @private\n   */\n  _saveScrollPosition() {\n    const refs = [this._quicklinks, this._sidebarInnerNav];\n    for (const el of refs) {\n      if (el && el.dataset.lastScrollTop === undefined && el.scrollTop > 0) {\n        el.dataset.lastScrollTop = String(el.scrollTop);\n        el.scrollTop = 0;\n      }\n    }\n  }\n\n  /**\n   * Restores the scroll position of the previously saved elements.\n   * @private\n   */\n  _restoreScrollPosition() {\n    const refs = [this._quicklinks, this._sidebarInnerNav];\n    for (const el of refs) {\n      if (el && typeof el.dataset.lastScrollTop === \"string\") {\n        el.scrollTop = Number(el.dataset.lastScrollTop);\n        delete el.dataset.lastScrollTop;\n      }\n    }\n  }\n\n  /**\n   * Lit lifecycle method called after properties are updated.\n   * Triggers telemetry events and applies filtering logic when properties change.\n   * @param {Map<string, any>} changedProperties\n   */\n  updated(changedProperties) {\n    if (changedProperties.has(\"query\")) {\n      // Mark that the user has typed if the query is non-empty.\n      if (this.query && this.query.trim().length > 0 && !this.hasTyped) {\n        this.hasTyped = true;\n      }\n\n      if (this._quicklinks) {\n        // Initialize the filterer if it has not yet been created.\n        if (!this._filterer) {\n          const root = this._quicklinks.querySelector(\".left-sidebar__content\");\n          if (root instanceof HTMLElement) {\n            this._filterer = new SidebarFilterer(root);\n          }\n        }\n        const trimmedQuery = this.query.trim();\n        if (trimmedQuery) {\n          this._saveScrollPosition();\n        }\n        if (this._filterer) {\n          const count = this._filterer.applyFilter(trimmedQuery);\n          this.matchCount = count;\n        }\n        if (!trimmedQuery) {\n          this._restoreScrollPosition();\n        }\n      }\n    }\n  }\n\n  /**\n   * Event handler for when the input field receives focus.\n   * @private\n   */\n  _onFocus() {\n    this._active = true;\n  }\n\n  /**\n   * Event handler for input events on the text field.\n   * @param {Event} event The input event.\n   * @private\n   */\n  _onInput(event) {\n    const target = /** @type {HTMLInputElement} */ (event.target);\n    this.query = target.value;\n  }\n\n  /**\n   * Clears the filter input and resets the active state.\n   * @private\n   */\n  _clearFilter() {\n    this.query = \"\";\n    this._active = false;\n  }\n\n  /**\n   * Renders the component template.\n   * @returns {import(\"@lit\").TemplateResult}\n   */\n  render() {\n    return html`\n      <div class=\"sidebar-filter ${this.query ? \"has-input\" : \"\"}\">\n        <label\n          id=\"sidebar-filter-label\"\n          class=\"sidebar-filter-label\"\n          for=\"sidebar-filter-input\"\n        >\n          <span class=\"icon\">${filterIcon}</span>\n          <span class=\"visually-hidden\">${this.l10n`Filter sidebar`}</span>\n        </label>\n        <input\n          id=\"sidebar-filter-input\"\n          autocomplete=\"off\"\n          class=\"sidebar-filter-input-field ${this._active ? \"is-active\" : \"\"}\"\n          type=\"text\"\n          placeholder=${this.l10n`Filter`}\n          .value=${this.query}\n          @focus=${this._onFocus}\n          @input=${this._onInput}\n        />\n        ${this.matchCount === undefined\n          ? \"\"\n          : html`\n              <span class=\"sidebar-filter-count\">\n                ${this.l10n.raw({\n                  id: \"sidebar-filter-matches\",\n                  args: {\n                    matches: this.matchCount,\n                  },\n                })}\n              </span>\n            `}\n        <mdn-button\n          class=\"clear-sidebar-filter-button\"\n          variant=\"plain\"\n          label=${this.l10n`Clear filter input`}\n          .icon=${cancelIcon}\n          icon-only\n          @click=${this._clearFilter}\n        ></mdn-button>\n      </div>\n    `;\n  }\n}\n\ncustomElements.define(\"mdn-sidebar-filter\", MDNSidebarFilter);\n","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]!../../node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!../visually-hidden/global.css\";\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___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `:host{display:flex;flex-direction:column;position:relative}:host .sidebar-filter{display:flex;place-items:center}:host .sidebar-filter-label{left:.375em;position:absolute;top:.375em}:is(:host .sidebar-filter-label) .icon{color:var(--color-text-primary)}:host .clear-sidebar-filter-button{--button-bg:none;--button-color:var(--color-text-primary);--button-border-color:none;position:absolute;right:0}:is(:host .clear-sidebar-filter-button):hover{--button-color:var(--color-text-secondary)}:host .sidebar-filter-input-field{border:1px solid var(--color-border-primary);border-radius:1em;color:var(--color-text-primary);padding-bottom:.5em;padding-left:2em;padding-top:.5em;width:100%}:is(:host .sidebar-filter-input-field):focus{outline:0 none;--csstools-light-dark-toggle--0:var(--csstools-color-scheme--light) #5e9eff;border-color:light-dark(#0085f2,#5e9eff)}:is(:host .sidebar-filter-input-field):focus .icon{color:var(--color-border-primary)}[value=\"\"]:is(:host .sidebar-filter-input-field):not(:focus,.is-active){width:5em}[value=\"\"]:is(:host .sidebar-filter-input-field):not(:focus,.is-active)~.clear-sidebar-filter-button,[value=\"\"]:is(:host .sidebar-filter-input-field):not(:focus,.is-active)~.sidebar-filter-count{display:none}.is-active:is(:host .sidebar-filter-input-field),:is(:host .sidebar-filter-input-field):focus{padding-right:7.5em}:is(:host .sidebar-filter-input-field)~.sidebar-filter-count{background:var(--color-background-blue);border-radius:1em;color:var(--color-text-secondary);font-size:.7rem;padding:0 .5em;position:absolute;right:2.5em;white-space:nowrap}:host .button{appearance:none;background:none;border:none}:is(:host .icon) svg{height:1em;width:1em}`, \"\"]);\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\"><path d=\"M18 6 6 18M6 6l12 12\"/></svg>`;"],"names":["s","SidebarFilterer","HTMLElement","HTMLAnchorElement","JSON","Set","document","Boolean","String","Map","Text","Node","MDNSidebarFilter","Number","t","customElements"],"mappings":"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"}

package/dist/client/2448.831aebeb9f07a23c.js

@@ -0,0 +1,35 @@
+/*! For license information please see 2448.831aebeb9f07a23c.js.LICENSE.txt */
+export const __webpack_ids__=["2448"];export const __webpack_modules__={61667:function(e){e.exports=function(e,t){return(t||(t={}),e&&(e=String(e.__esModule?e.default:e),/^['"].*['"]$/.test(e)&&(e=e.slice(1,-1)),t.hash&&(e+=t.hash),/["'() \t\n]|(%20)/.test(e)||t.needQuotes))?'"'.concat(e.replace(/"/g,'\\"').replace(/\n/g,"\\n"),'"'):e}},81123:function(e,t,s){e.exports=s.p+"survey.f654202dd710bc60.svg"},2211:function(e,t,s){s.r(t),s.d(t,{MDNSurvey:()=>MDNSurvey});var r=s(14703),i=s(13566),o=s(51968),a=s(62264);let n=[{key:"something unique in the current surveys",bucket:Object.freeze({BLOG_FEEDBACK_2023:"BLOG_FEEDBACK_2023",BROWSER_SURVEY_OCT_2022:"BROWSER_SURVEY_OCT_2022",CONTENT_DISCOVERY_2023:"CONTENT_DISCOVERY_2023",CSS_CASCADE_2022:"CSS_CASCADE_2022",DE_LOCALE_2024:"DE_LOCALE_2024",DE_LOCALE_2024_EVAL:"DE_LOCALE_2024_EVAL",FIREFOX_WEB_COMPAT_2023:"FIREFOX_WEB_COMPAT_2023",INTEROP_2023:"INTEROP_2023",IT_LOCALE_2025:"IT_LOCALE_2025",WEB_COMPONENTS_2023:"WEB_COMPONENTS_2023",DISCOVERABILITY_2023:"DISCOVERABILITY_2023",WEB_SECURITY_2023:"WEB_SECURITY_2023",DISCOVERABILITY_AUG_2023:"DISCOVERABILITY_AUG_2023",WEB_APP_AUGUST_2024:"WEB_APP_AUGUST_2024",HOMEPAGE_FEEDBACK_2024:"HOMEPAGE_FEEDBACK_2024",WEBDX_EDITING_2024:"WEBDX_EDITING_2024",HOUSE_SURVEY_2025:"HOUSE_SURVEY_2025",JS_PROPOSALS_2025:"JS_PROPOSALS_2025",FIRST_FRED_2025:"FIRST_FRED_2025"}).FIRST_FRED_2025,show:e=>/^\/[a-z]{2}(-[A-Z]{2})?\/docs\/Web\/CSS/.test(e),src:e=>{let t=new URL("https://www.example.com/");return t.searchParams.set("referrer",e),t.toString()},teaser:(0,r.dy)`Fred is <strong>MDN</strong>'s shiny now front-end!`,question:"Would you be so kind to answer some questions about fred?",footnote:"fred = Fr(ont)e(n)d",rateFrom:0,rateTill:1,start:0,end:1/0}];function u(e){let t,s=`survey.${e}`;try{t=JSON.parse(localStorage?.getItem(s)??"{}")}catch{t={}}return 0===Object.keys(t).length&&_(e,t={random:Math.random(),seen_at:null,dismissed_at:null,submitted_at:null,opened_at:null}),t}function _(e,t){let s=`survey.${e}`;try{localStorage?.setItem(s,JSON.stringify(t))}catch{}}let MDNSurvey=class MDNSurvey extends r.oi{static styles=a.Z;static ssr=!1;constructor(){super(),this._survey=void 0,this._surveyState=void 0,this._isOpen=!1,this._force=!1,this._source=void 0,this._detailsRef=(0,o.V)()}connectedCallback(){super.connectedCallback(),this.#e(),this.#t()}disconnectedCallback(){super.disconnectedCallback(),this.#s()}#e(){void 0!==globalThis.window&&(this._force=globalThis.location.hash.startsWith("#FORCE_SURVEY="),this._survey=this.#r(),this._survey&&(this._surveyState=u(this._survey.bucket),this._source="function"==typeof this._survey.src?this._survey.src(globalThis.location.pathname):this._survey.src,this.#i()))}#r(){return n.find(e=>{if(this._force)return e.key===globalThis.location.hash.slice(14);if(void 0===globalThis.window||!e.show(globalThis.location.pathname))return!1;let t=Date.now();if(t<e.start||e.end<t)return!1;let s=u(e.bucket);return s.random>=e.rateFrom&&s.random<e.rateTill})}#i(){this._survey&&this._surveyState&&!this._surveyState.seen_at&&(this._surveyState={...this._surveyState,seen_at:Date.now()},_(this._survey.bucket,this._surveyState),this.#o("seen"))}#a(){this._survey&&this._surveyState&&(this._surveyState={...this._surveyState,dismissed_at:Date.now()},_(this._survey.bucket,this._surveyState),this.#o("dismissed"),this.requestUpdate())}#n(){if(!this._survey||!this._surveyState||this._isOpen)return;let e=this._detailsRef.value;e&&e.open&&(this._surveyState={...this._surveyState,opened_at:Date.now()},_(this._survey.bucket,this._surveyState),this.#o("opened"),this._isOpen=!0,this.requestUpdate())}#u(){this._survey&&this._surveyState&&(this._surveyState={...this._surveyState,submitted_at:Date.now()},_(this._survey.bucket,this._surveyState),this.#o("submitted"),this.requestUpdate())}#o(e){this._survey&&console.log(`Survey: ${e} ${this._survey.bucket}`)}#t(){this._messageListener=e=>{"https://survey.alchemer.com"===e.origin&&"submit"===e.data&&this.#u()},window.addEventListener("message",this._messageListener,!1)}#s(){this._messageListener&&window.removeEventListener("message",this._messageListener,!1)}render(){return!this._survey||!this._surveyState||!this._force&&(this._surveyState.dismissed_at||this._surveyState?.submitted_at)?r.Ld:(0,r.dy)`
+      <div class="survey">
+        <div class="header">
+          <div class="teaser">${this._survey.teaser}</div>
+          <button
+            class="dismiss"
+            type="button"
+            aria-label="Hide this survey"
+            @click=${this.#a}
+            title="Hide this survey"
+          >
+            <svg class="icon" width="16" height="16" viewBox="0 0 16 16">
+              <path
+                fill="currentColor"
+                d="M8 6.586L13.657 1l1.414 1.414L9.414 8l5.657 5.586-1.414 1.414L8 9.414 2.343 15 .929 13.586 6.586 8 .929 2.414 2.343 1z"
+              />
+            </svg>
+          </button>
+        </div>
+        <details ${(0,o.i)(this._detailsRef)} @toggle=${this.#n}>
+          <summary>${this._survey.question}</summary>
+          ${this._isOpen&&this._source?(0,r.dy)`
+                <iframe
+                  title=${(0,i.o)(this._survey.question)}
+                  src=${this._source}
+                  height="500"
+                  style="overflow: hidden;"
+                ></iframe>
+              `:r.Ld}
+        </details>
+        ${this._survey.footnote?(0,r.dy)` <section class="footer">(${this._survey.footnote})</section> `:r.Ld}
+      </div>
+    `}};customElements.define("mdn-survey",MDNSurvey)},13566:function(e,t,s){s.d(t,{o:()=>i});var r=s(32529);let i=e=>e??r.Ld},62264:function(e,t,s){s.d(t,{Z:()=>l});var r=s(14703),i=s(8081),o=s.n(i),a=s(23645),n=s.n(a),u=s(61667),_=s.n(u),d=new s.U(s(81123)),h=n()(o()),c=_()(d);h.push([e.id,`:host{display:block}*{box-sizing:border-box}.survey{--margin-vertical:0.75rem;--margin-left:4rem;background-color:#f3f0ff;border-radius:.5rem;color:var(--color-black);padding:1rem;position:relative}.survey:before{background:url(${c});background-size:cover;content:"";display:inline-block;height:49px;position:absolute;width:53px}.survey .header{align-items:flex-start;display:flex;justify-content:space-between}.survey .footer,.survey .header,.survey summary{margin-left:var(--margin-left)}.survey .footer{font-size:var(--font-size-small);font-style:italic;margin-top:var(--margin-vertical)}.survey .dismiss{align-items:center;background:none;border:none;border-radius:.25rem;color:var(--color-gray-60);cursor:pointer;display:flex;justify-content:center;padding:.25rem}:is(.survey .dismiss):hover{background-color:#0000001a;color:#1a1a1a}:is(.survey .dismiss) .icon{height:16px;width:16px}.survey iframe{border:0;border-radius:.5rem;width:100%}.survey iframe,.survey summary{margin-top:var(--margin-vertical)}.survey summary{color:#6900d1;cursor:pointer;-webkit-text-decoration:underline;text-decoration:underline}:is(.survey summary):focus,:is(.survey summary):hover{-webkit-text-decoration:none;text-decoration:none}`,""]);let l=(0,r.iv)([h.toString()])}};
+//# sourceMappingURL=2448.831aebeb9f07a23c.js.map

package/dist/client/2448.831aebeb9f07a23c.js.LICENSE.txt

@@ -0,0 +1,5 @@
+/**
+ * @license
+ * Copyright 2018 Google LLC
+ * SPDX-License-Identifier: BSD-3-Clause
+ */

package/dist/client/2448.831aebeb9f07a23c.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"2448.831aebeb9f07a23c.js","sources":["webpack://@mdn/fred/./node_modules/css-loader/dist/runtime/getUrl.js","webpack://@mdn/fred/./components/survey/surveys.js","webpack://@mdn/fred/./components/survey/utils.js","webpack://@mdn/fred/./components/survey/element.js","webpack://@mdn/fred/./node_modules/lit-html/directives/if-defined.js","webpack://@mdn/fred/./components/survey/element.css"],"sourcesContent":["\"use strict\";\n\nmodule.exports = function (url, options) {\n  if (!options) {\n    options = {};\n  }\n  if (!url) {\n    return url;\n  }\n  url = String(url.__esModule ? url.default : url);\n\n  // If url is already wrapped in quotes, remove them\n  if (/^['\"].*['\"]$/.test(url)) {\n    url = url.slice(1, -1);\n  }\n  if (options.hash) {\n    url += options.hash;\n  }\n\n  // Should url be wrapped?\n  // See https://drafts.csswg.org/css-values-3/#urls\n  if (/[\"'() \\t\\n]|(%20)/.test(url) || options.needQuotes) {\n    return \"\\\"\".concat(url.replace(/\"/g, '\\\\\"').replace(/\\n/g, \"\\\\n\"), \"\\\"\");\n  }\n  return url;\n};","import { html } from \"lit\";\n\n/**\n * @import * as Survey from \"./types.js\";\n */\n/**\n * Survey bucket identifiers used for localStorage state management.\n * Each bucket represents a unique survey campaign and maintains separate state.\n * @readonly\n * @enum {string}\n */\nexport const SurveyBucket = Object.freeze({\n  BLOG_FEEDBACK_2023: \"BLOG_FEEDBACK_2023\",\n  BROWSER_SURVEY_OCT_2022: \"BROWSER_SURVEY_OCT_2022\",\n  CONTENT_DISCOVERY_2023: \"CONTENT_DISCOVERY_2023\",\n  CSS_CASCADE_2022: \"CSS_CASCADE_2022\",\n  DE_LOCALE_2024: \"DE_LOCALE_2024\",\n  DE_LOCALE_2024_EVAL: \"DE_LOCALE_2024_EVAL\",\n  FIREFOX_WEB_COMPAT_2023: \"FIREFOX_WEB_COMPAT_2023\",\n  INTEROP_2023: \"INTEROP_2023\",\n  IT_LOCALE_2025: \"IT_LOCALE_2025\",\n  WEB_COMPONENTS_2023: \"WEB_COMPONENTS_2023\",\n  DISCOVERABILITY_2023: \"DISCOVERABILITY_2023\",\n  WEB_SECURITY_2023: \"WEB_SECURITY_2023\",\n  DISCOVERABILITY_AUG_2023: \"DISCOVERABILITY_AUG_2023\",\n  WEB_APP_AUGUST_2024: \"WEB_APP_AUGUST_2024\",\n  HOMEPAGE_FEEDBACK_2024: \"HOMEPAGE_FEEDBACK_2024\",\n  WEBDX_EDITING_2024: \"WEBDX_EDITING_2024\",\n  HOUSE_SURVEY_2025: \"HOUSE_SURVEY_2025\",\n  JS_PROPOSALS_2025: \"JS_PROPOSALS_2025\",\n  FIRST_FRED_2025: \"FIRST_FRED_2025\",\n});\n\n/**\n * Array of survey configurations.\n *\n * When adding a survey, make sure it has this JavaScript action (in Alchemer)\n * so the banner is hidden for users who have already submitted it:\n * ```javascript\n * window.parent && window.parent.postMessage(\"submit\", \"*\");\n * ```\n *\n * @type {Survey.Survey[]}\n */\nexport const SURVEYS = [\n  {\n    key: \"something unique in the current surveys\",\n    bucket: SurveyBucket.FIRST_FRED_2025,\n    show: (mdn_url) => {\n      return /^\\/[a-z]{2}(-[A-Z]{2})?\\/docs\\/Web\\/CSS/.test(mdn_url);\n    },\n    src: (mdn_url) => {\n      const url = new URL(\"https://www.example.com/\");\n      url.searchParams.set(\"referrer\", mdn_url);\n      return url.toString();\n    },\n    teaser: html`Fred is <strong>MDN</strong>'s shiny now front-end!`,\n    question: \"Would you be so kind to answer some questions about fred?\",\n    footnote: \"fred = Fr(ont)e(n)d\",\n    rateFrom: 0,\n    rateTill: 1,\n    start: 0,\n    end: Infinity,\n  },\n];\n","/**\n * @import * as Survey from \"./types.js\";\n */\n/**\n * @param {string} key\n * @returns {Survey.SurveyState}\n */\nexport function getSurveyState(key) {\n  const stateKey = `survey.${key}`;\n  let state;\n\n  try {\n    state = JSON.parse(localStorage?.getItem(stateKey) ?? \"{}\");\n  } catch {\n    state = {};\n  }\n\n  if (Object.keys(state).length === 0) {\n    state = {\n      random: Math.random(),\n      seen_at: null,\n      dismissed_at: null,\n      submitted_at: null,\n      opened_at: null,\n    };\n    writeSurveyState(key, state);\n  }\n\n  return state;\n}\n\n/**\n * @param {string} key\n * @param {Survey.SurveyState} state\n */\nexport function writeSurveyState(key, state) {\n  const stateKey = `survey.${key}`;\n  try {\n    localStorage?.setItem(stateKey, JSON.stringify(state));\n  } catch {\n    // Handle localStorage errors silently\n  }\n}\n","import { LitElement, html, nothing } from \"lit\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { createRef, ref } from \"lit/directives/ref.js\";\n\nimport styles from \"./element.css?lit\";\nimport { SURVEYS } from \"./surveys.js\";\nimport { getSurveyState, writeSurveyState } from \"./utils.js\";\n\n/**\n * @import { TemplateResult } from \"lit\";\n * @import { Ref } from \"lit/directives/ref.js\";\n * @import * as Survey from \"./types.js\";\n */\n\nexport class MDNSurvey extends LitElement {\n  static styles = styles;\n\n  static ssr = false;\n\n  constructor() {\n    super();\n    /** @type {Survey.Survey | undefined} */\n    this._survey = undefined;\n    /** @type {Survey.SurveyState | undefined} */\n    this._surveyState = undefined;\n    /** @type {boolean} */\n    this._isOpen = false;\n    /** @type {boolean}  */\n    this._force = false;\n    /** @type {string | undefined} */\n    this._source = undefined;\n\n    /** @type {Ref<HTMLDetailsElement>} */\n    this._detailsRef = createRef();\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.#checkForSurvey();\n    this.#setupMessageListener();\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.#removeMessageListener();\n  }\n\n  #checkForSurvey() {\n    if (globalThis.window === undefined) return;\n\n    const FORCE_SURVEY_PREFIX = \"#FORCE_SURVEY=\";\n    this._force = globalThis.location.hash.startsWith(FORCE_SURVEY_PREFIX);\n\n    this._survey = this.#findSurvey();\n\n    if (this._survey) {\n      this._surveyState = getSurveyState(this._survey.bucket);\n      this._source =\n        typeof this._survey.src === \"function\"\n          ? this._survey.src(globalThis.location.pathname)\n          : this._survey.src;\n\n      this.#markAsSeen();\n    }\n  }\n\n  /**\n   * @returns {Survey.Survey | undefined}\n   */\n  #findSurvey() {\n    return SURVEYS.find((survey) => {\n      if (this._force) {\n        const FORCE_SURVEY_PREFIX = \"#FORCE_SURVEY=\";\n        return (\n          survey.key ===\n          globalThis.location.hash.slice(FORCE_SURVEY_PREFIX.length)\n        );\n      }\n\n      if (globalThis.window === undefined) {\n        return false;\n      }\n\n      if (!survey.show(globalThis.location.pathname)) {\n        return false;\n      }\n\n      const now = Date.now();\n      if (now < survey.start || survey.end < now) {\n        return false;\n      }\n\n      const state = getSurveyState(survey.bucket);\n      return state.random >= survey.rateFrom && state.random < survey.rateTill;\n    });\n  }\n\n  #markAsSeen() {\n    if (!this._survey || !this._surveyState || this._surveyState.seen_at)\n      return;\n\n    this._surveyState = {\n      ...this._surveyState,\n      seen_at: Date.now(),\n    };\n    writeSurveyState(this._survey.bucket, this._surveyState);\n    this.#measure(\"seen\");\n  }\n\n  #dismiss() {\n    if (!this._survey || !this._surveyState) return;\n\n    this._surveyState = {\n      ...this._surveyState,\n      dismissed_at: Date.now(),\n    };\n    writeSurveyState(this._survey.bucket, this._surveyState);\n    this.#measure(\"dismissed\");\n    this.requestUpdate();\n  }\n\n  #onToggle() {\n    if (!this._survey || !this._surveyState || this._isOpen) return;\n\n    const details = this._detailsRef.value;\n    if (details && details.open) {\n      this._surveyState = {\n        ...this._surveyState,\n        opened_at: Date.now(),\n      };\n      writeSurveyState(this._survey.bucket, this._surveyState);\n      this.#measure(\"opened\");\n      this._isOpen = true;\n      this.requestUpdate();\n    }\n  }\n\n  #onSubmitted() {\n    if (!this._survey || !this._surveyState) return;\n\n    this._surveyState = {\n      ...this._surveyState,\n      submitted_at: Date.now(),\n    };\n    writeSurveyState(this._survey.bucket, this._surveyState);\n    this.#measure(\"submitted\");\n    this.requestUpdate();\n  }\n\n  /**\n   * @param {string} action\n   */\n  #measure(action) {\n    if (!this._survey) return;\n\n    // TODO: GLEAN\n    console.log(`Survey: ${action} ${this._survey.bucket}`);\n  }\n\n  #setupMessageListener() {\n    /** @type {(event: MessageEvent) => void} */\n    this._messageListener = (event) => {\n      if (\n        event.origin === \"https://survey.alchemer.com\" &&\n        event.data === \"submit\"\n      ) {\n        this.#onSubmitted();\n      }\n    };\n    window.addEventListener(\"message\", this._messageListener, false);\n  }\n\n  #removeMessageListener() {\n    if (this._messageListener) {\n      window.removeEventListener(\"message\", this._messageListener, false);\n    }\n  }\n\n  /**\n   * @returns {TemplateResult | nothing}\n   */\n  render() {\n    if (!this._survey || !this._surveyState) {\n      return nothing;\n    }\n\n    if (\n      !this._force &&\n      (this._surveyState.dismissed_at || this._surveyState?.submitted_at)\n    ) {\n      return nothing;\n    }\n\n    return html`\n      <div class=\"survey\">\n        <div class=\"header\">\n          <div class=\"teaser\">${this._survey.teaser}</div>\n          <button\n            class=\"dismiss\"\n            type=\"button\"\n            aria-label=\"Hide this survey\"\n            @click=${this.#dismiss}\n            title=\"Hide this survey\"\n          >\n            <svg class=\"icon\" width=\"16\" height=\"16\" viewBox=\"0 0 16 16\">\n              <path\n                fill=\"currentColor\"\n                d=\"M8 6.586L13.657 1l1.414 1.414L9.414 8l5.657 5.586-1.414 1.414L8 9.414 2.343 15 .929 13.586 6.586 8 .929 2.414 2.343 1z\"\n              />\n            </svg>\n          </button>\n        </div>\n        <details ${ref(this._detailsRef)} @toggle=${this.#onToggle}>\n          <summary>${this._survey.question}</summary>\n          ${this._isOpen && this._source\n            ? html`\n                <iframe\n                  title=${ifDefined(this._survey.question)}\n                  src=${this._source}\n                  height=\"500\"\n                  style=\"overflow: hidden;\"\n                ></iframe>\n              `\n            : nothing}\n        </details>\n        ${this._survey.footnote\n          ? html` <section class=\"footer\">(${this._survey.footnote})</section> `\n          : nothing}\n      </div>\n    `;\n  }\n}\n\ncustomElements.define(\"mdn-survey\", MDNSurvey);\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","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(\"assets/survey.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___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `:host{display:block}*{box-sizing:border-box}.survey{--margin-vertical:0.75rem;--margin-left:4rem;background-color:#f3f0ff;border-radius:.5rem;color:var(--color-black);padding:1rem;position:relative}.survey:before{background:url(${___CSS_LOADER_URL_REPLACEMENT_0___});background-size:cover;content:\"\";display:inline-block;height:49px;position:absolute;width:53px}.survey .header{align-items:flex-start;display:flex;justify-content:space-between}.survey .footer,.survey .header,.survey summary{margin-left:var(--margin-left)}.survey .footer{font-size:var(--font-size-small);font-style:italic;margin-top:var(--margin-vertical)}.survey .dismiss{align-items:center;background:none;border:none;border-radius:.25rem;color:var(--color-gray-60);cursor:pointer;display:flex;justify-content:center;padding:.25rem}:is(.survey .dismiss):hover{background-color:#0000001a;color:#1a1a1a}:is(.survey .dismiss) .icon{height:16px;width:16px}.survey iframe{border:0;border-radius:.5rem;width:100%}.survey iframe,.survey summary{margin-top:var(--margin-vertical)}.survey summary{color:#6900d1;cursor:pointer;-webkit-text-decoration:underline;text-decoration:underline}:is(.survey summary):focus,:is(.survey summary):hover{-webkit-text-decoration:none;text-decoration:none}`, \"\"]);\n// Exports\nexport default css([___CSS_LOADER_EXPORT___.toString()]);\n"],"names":["String","Object","URL","s","JSON","localStorage","Math","MDNSurvey","globalThis","Date","console","e","window","i","customElements","_"],"mappings":"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"}

package/dist/client/2633.16d5148ada5e2597.js

@@ -0,0 +1,2 @@
+export const __webpack_ids__=["2633"];export const __webpack_modules__={22928:function(e,t,s){s.r(t),s.d(t,{MDNAboutTeamMember:()=>MDNAboutTeamMember});var o=s(14703);let MDNAboutTeamMember=class MDNAboutTeamMember extends o.oi{static ssr=!1;createRenderRoot(){return this}_setID(){let e=this.querySelector("h4, h5"),t=e?.closest(".tabpanel");if(e&&t){let s=`${t.id}_${e.id}`;this.id!==s&&(this.id=s)}}_focus({currentTarget:e}){e instanceof HTMLElement&&(globalThis.history.pushState({},"",`#${e.id}`),this.scrollIntoView({block:"nearest",inline:"nearest"}))}_mousedown(e){e.target instanceof HTMLAnchorElement&&e.preventDefault()}connectedCallback(){super.connectedCallback(),this.tabIndex=0,setTimeout(()=>{this._setID(),globalThis.location.hash.slice(1)===this.id&&this.focus({preventScroll:!0})},0),this.addEventListener("mousedown",this._mousedown),this.addEventListener("focus",this._focus)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("mousedown",this._mousedown),this.removeEventListener("focus",this._focus)}};customElements.define("mdn-about-team-member",MDNAboutTeamMember)}};
+//# sourceMappingURL=2633.16d5148ada5e2597.js.map

package/dist/client/2633.16d5148ada5e2597.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"2633.16d5148ada5e2597.js","sources":["webpack://@mdn/fred/./components/about-team-member/element.js"],"sourcesContent":["import { LitElement } from \"lit\";\n\nexport class MDNAboutTeamMember extends LitElement {\n  // Force client-side rendering for disabled shadow DOM\n  static ssr = false;\n\n  // Disable shadow DOM\n  createRenderRoot() {\n    return this;\n  }\n\n  _setID() {\n    const hx = this.querySelector(\"h4, h5\");\n    const panel = hx?.closest(\".tabpanel\");\n    if (hx && panel) {\n      const id = `${panel.id}_${hx.id}`;\n      if (this.id !== id) {\n        this.id = id;\n      }\n    }\n  }\n\n  /** @param {FocusEvent} ev */\n  _focus({ currentTarget }) {\n    if (currentTarget instanceof HTMLElement) {\n      globalThis.history.pushState({}, \"\", `#${currentTarget.id}`);\n      this.scrollIntoView({ block: \"nearest\", inline: \"nearest\" });\n    }\n  }\n\n  /** @param {MouseEvent} ev */\n  _mousedown(ev) {\n    if (ev.target instanceof HTMLAnchorElement) {\n      ev.preventDefault();\n    }\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this.tabIndex = 0;\n    setTimeout(() => {\n      this._setID();\n      if (globalThis.location.hash.slice(1) === this.id) {\n        this.focus({ preventScroll: true });\n      }\n    }, 0);\n    this.addEventListener(\"mousedown\", this._mousedown);\n    this.addEventListener(\"focus\", this._focus);\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    this.removeEventListener(\"mousedown\", this._mousedown);\n    this.removeEventListener(\"focus\", this._focus);\n  }\n}\n\ncustomElements.define(\"mdn-about-team-member\", MDNAboutTeamMember);\n"],"names":["MDNAboutTeamMember","HTMLElement","globalThis","e","HTMLAnchorElement","setTimeout","customElements"],"mappings":"uKAEO,IAAMA,mBAAN,MAAMA,2BAA2B,IAAU,CAEhD,OAAO,IAAM,EAAM,AAGnB,mBAAmB,CACjB,OAAO,IAAI,AACb,CAEA,QAAS,CACP,IAAM,EAAK,IAAI,CAAC,aAAa,CAAC,UACxB,EAAQ,GAAI,QAAQ,aAC1B,GAAI,GAAM,EAAO,CACf,IAAM,EAAK,CAAC,EAAE,EAAM,EAAE,CAAC,CAAC,EAAE,EAAG,EAAE,CAAC,CAAC,AAC7B,KAAI,CAAC,EAAE,GAAK,GACd,KAAI,CAAC,EAAE,CAAG,CAAC,CAEf,CACF,CAGA,OAAO,CAAE,eAAa,CAAE,CAAE,CACpB,aAAyBC,cAC3BC,WAAW,OAAO,CAAC,SAAS,CAAC,CAAC,EAAG,GAAI,CAAC,CAAC,EAAE,EAAc,EAAE,CAAC,CAAC,EAC3D,IAAI,CAAC,cAAc,CAAC,CAAE,MAAO,UAAW,OAAQ,SAAU,GAE9D,CAGA,WAAWC,CAAE,CAAE,CACTA,EAAG,MAAM,YAAYC,mBACvBD,EAAG,cAAc,EAErB,CAEA,mBAAoB,CAClB,KAAK,CAAC,oBACN,IAAI,CAAC,QAAQ,CAAG,EAChBE,WAAW,KACT,IAAI,CAAC,MAAM,GACPH,WAAW,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAC,KAAO,IAAI,CAAC,EAAE,EAC/C,IAAI,CAAC,KAAK,CAAC,CAAE,cAAe,EAAK,EAErC,EAAG,GACH,IAAI,CAAC,gBAAgB,CAAC,YAAa,IAAI,CAAC,UAAU,EAClD,IAAI,CAAC,gBAAgB,CAAC,QAAS,IAAI,CAAC,MAAM,CAC5C,CAEA,sBAAuB,CACrB,KAAK,CAAC,uBACN,IAAI,CAAC,mBAAmB,CAAC,YAAa,IAAI,CAAC,UAAU,EACrD,IAAI,CAAC,mBAAmB,CAAC,QAAS,IAAI,CAAC,MAAM,CAC/C,CACF,EAEAI,eAAe,MAAM,CAAC,wBAAyBN,mB"}

package/dist/client/2656.aff378afb664f75e.js

@@ -0,0 +1,104 @@
+export const __webpack_ids__=["2656"];export const __webpack_modules__={84011:function(e,t,r){e.exports=r.p+"triangle-alert.cff4c57ccef57da3.svg"},97877:function(e,t,r){r.r(t),r.d(t,{MDNInteractiveExample:()=>MDNInteractiveExample,InteractiveExampleBase:()=>InteractiveExampleBase});var o=r(14703),a=r(51968),i=r(61619),s=r(66178),l=r(48621),d=r(86492),c=r(69535),n=r(74580);function p(e){let t=document.createElement("div");e=e.replaceAll(/(\/\*)[\s\S]+(\*\/)/g,"");let r=/^-(?:webkit|moz|ms|o)-/,o=t.style,a=e.split(";").map(e=>e.trim()).filter(e=>e.length>0);o.cssText="";let i=new Set,s=new Set;for(let e of a){let t=o.cssText;o.cssText+=e+";";let a=o.cssText!==t,l=r.test(e),d=function(e){let t=r.exec(e),o=null===t?"":t[0];return(null===o?e:e.slice(o.length)).split(/[\s:]/)[0]??""}(e);a&&l?i.add(d):a||l||s.add(d)}if(s.size>0){for(let e of i)s.delete(e);if(s.size>0)return!1}return!0}r(4406),r(18103);let h=e=>class extends(0,c.q)(e){static properties={__choiceSelected:{state:!0},__choiceUnsupported:{state:!0}};constructor(...e){super(),this.__choiceSelected=-1,this.__choiceUnsupported=[]}#e({target:e}){e instanceof n.MDNPlayEditor&&e.focus()}#t({target:e}){e instanceof n.MDNPlayEditor&&(this.#r(e),this.#o(e))}#a({target:e}){e instanceof n.MDNPlayEditor&&(this.#r(e),this.__choiceSelected===this.#i(e)&&this.#o(e))}#s(){this.__choiceSelected=-1;let e=[...this.shadowRoot?.querySelectorAll("mdn-play-editor")||[]];for(let[t,r]of[...e].entries())r.value=this._choices?.at(t)??"";this.__choiceUnsupported=this._choices?.map(e=>!p(e||""))||[];let t=e[0];t&&this.#o(t)}async #o(e){let t=this.#i(e);await this._runner.value?.postMessage({typ:"choice",code:e.value}),this.__choiceSelected=t}#r(e){let t=this.#i(e);this.__choiceUnsupported=this.__choiceUnsupported.map((r,o)=>t===o?!p(e.value):r)}#i(e){return Number.parseInt(e.dataset.index??"-1",10)}#l(){return(0,o.dy)`
+        <div class="template-choices">
+          <header>
+            <h4>${(0,d.decode)(this.name)}</h4>
+            <mdn-button id="reset" @click=${this._reset} variant="secondary"
+              >${this.l10n`Reset`}</mdn-button
+            >
+          </header>
+          <div
+            class="choice-wrapper"
+            @click=${this.#e}
+            @focus=${this.#t}
+            @update=${this.#a}
+          >
+            ${this._choices?.map((e,t)=>(0,o.dy)`
+                <div
+                  class=${["choice",...t===this.__choiceSelected?["selected"]:[],...this.__choiceUnsupported[t]?["unsupported"]:[]].join(" ")}
+                >
+                  <mdn-play-editor
+                    data-index=${t}
+                    language="css"
+                    minimal="true"
+                    .delay=${100}
+                    .value=${e?.trim()}
+                  ></mdn-play-editor>
+                </div>
+              `)}
+          </div>
+          <div class="output-wrapper">
+            <mdn-play-controller ${(0,a.i)(this._controller)} run-on-start>
+              <mdn-play-runner
+                ${(0,a.i)(this._runner)}
+                defaults="ix-choice"
+              ></mdn-play-runner>
+            </mdn-play-controller>
+          </div>
+        </div>
+      `}_reset(){"choices"===this._template?this.#s():super._reset()}_initialCode(){let e=super._initialCode();return"choices"===this._template&&(e["js-hidden"]=`setChoice(${JSON.stringify(this._choices?.[0])})`),e}render(){return"choices"===this._template?this.#l():super.render()}firstUpdated(){super.firstUpdated(),"choices"===this._template&&this.#s()}};var m=r(13566);r(4976),r(49e3),r(89948),r(17739);let u=e=>class extends(0,c.q)(e){#l(){return(0,o.dy)`
+        <mdn-play-controller ${(0,a.i)(this._controller)}>
+          <div class="template-console">
+            <header>
+              <h4>${(0,d.decode)(this.name)}</h4>
+            </header>
+            ${1===this._languages.length?(0,o.dy)`<mdn-play-editor
+                  id="editor"
+                  language=${(0,m.o)(this._languages[0])}
+                ></mdn-play-editor>`:(0,o.dy)`<mdn-ix-tab-wrapper>
+                  ${this._languages.map(e=>(0,o.dy)`
+                      <mdn-ix-tab id=${e}
+                        >${this._langName(e)}</mdn-ix-tab
+                      >
+                      <mdn-ix-tab-panel id=${`${e}-panel`}>
+                        <mdn-play-editor language=${e}></mdn-play-editor>
+                      </mdn-ix-tab-panel>
+                    `)}
+                </mdn-ix-tab-wrapper>`}
+            <div class="buttons">
+              <mdn-button id="execute" @click=${this._run} variant="secondary"
+                >${this.l10n`Run`}</mdn-button
+              >
+              <mdn-button id="reset" @click=${this._reset} variant="secondary"
+                >${this.l10n`Reset`}</mdn-button
+              >
+            </div>
+            <mdn-play-console id="console"></mdn-play-console>
+            <mdn-play-runner
+              defaults=${(0,m.o)(this._languages.includes("wat")?"ix-wat":void 0)}
+            ></mdn-play-runner>
+          </div>
+        </mdn-play-controller>
+      `}render(){return"console"===this._template?this.#l():super.render()}},g=e=>class extends(0,c.q)(e){#l(){return(0,o.dy)`
+        <mdn-play-controller
+          ${(0,a.i)(this._controller)}
+          run-on-start
+          run-on-change
+        >
+          <div class="template-tabbed">
+            <header>
+              <h4>${(0,d.decode)(this.name)}</h4>
+              <mdn-button id="reset" @click=${this._reset} variant="secondary"
+                >${this.l10n`Reset`}</mdn-button
+              >
+            </header>
+            <mdn-ix-tab-wrapper>
+              ${this._languages.map(e=>(0,o.dy)`
+                  <mdn-ix-tab id=${e}>${this._langName(e)}</mdn-ix-tab>
+                  <mdn-ix-tab-panel id=${`${e}-panel`}>
+                    <mdn-play-editor language=${e}></mdn-play-editor>
+                  </mdn-ix-tab-panel>
+                `)}
+            </mdn-ix-tab-wrapper>
+            <div class="output-wrapper">
+              <h4>${this.l10n`Output`}</h4>
+              <mdn-play-runner
+                ${(0,a.i)(this._runner)}
+                sandbox="allow-top-navigation-by-user-activation"
+                defaults="ix-tabbed"
+              ></mdn-play-runner>
+            </div>
+          </div>
+        </mdn-play-controller>
+      `}render(){return"tabbed"===this._template?this.#l():super.render()}},b=["focus","copy","cut","paste","click"];let InteractiveExampleBase=class InteractiveExampleBase extends o.oi{static ssr=!1;static properties={name:{type:String}};static styles=l.Z;constructor(){super(),this.name="",this._languages=[],this._code={}}_controller=(0,a.V)();_runner=(0,a.V)();_run(){this._controller.value?.run()}_reset(){this._controller.value?.reset()}_initialCode(){let e={};for(let t of this.closest("section")?.querySelectorAll(".code-example pre.interactive-example")??[]){let r=(0,s.upgradePre)(t);if(r){let{language:t,code:o}=r;e[t]=e[t]?`${e[t]}
+${o}`:o}}return this._choices=[...this.closest("section")?.querySelectorAll(".code-example pre.interactive-example-choice")||[]].map(e=>(0,s.upgradePre)(e)?.code.trim()).filter(e=>void 0!==e),this._languages=Object.keys(e),this._template=this._choices.length>0?"choices":1===this._languages.length&&"js"===this._languages[0]||this._languages.includes("js")&&this._languages.includes("wat")?"console":"tabbed",e}_langName(e){return"js"===e?"JavaScript":e.toUpperCase()}_telemetryHandler(e){let t=e.type;"click"===e.type&&e.target instanceof HTMLElement&&e.target.id&&(t=`click@${e.target.id}`),(0,i.z)("interactive-example",{type:"action",label:t})}connectedCallback(){for(let e of(super.connectedCallback(),this._telemetryHandler=this._telemetryHandler.bind(this),b))this.renderRoot.addEventListener(e,this._telemetryHandler);this._code=this._initialCode()}firstUpdated(){this._controller.value&&(this._controller.value.code=this._code)}disconnectedCallback(){for(let e of(super.disconnectedCallback(),b))this.renderRoot.removeEventListener(e,this._telemetryHandler)}};let MDNInteractiveExample=class MDNInteractiveExample extends h(g(u(InteractiveExampleBase))){};customElements.define("interactive-example",MDNInteractiveExample)},61619:function(e,t,r){r.d(t,{z:()=>a});var o=r(26362);function a(e,{type:t,label:r}){o.Z.recordElementClick({id:e,type:t,label:r})}},48621:function(e,t,r){r.d(t,{Z:()=>m});var o=r(14703),a=r(8081),i=r.n(a),s=r(23645),l=r.n(s),d=r(61667),c=r.n(d),n=new r.U(r(84011)),p=l()(i()),h=c()(n);p.push([e.id,`:host{--border:1px solid var(--color-border-primary);--tabbed-font-heading:600 0.625rem/1.2 var(--font-family-text);--elem-radius:0.25rem}header{align-items:center;border-bottom:var(--border);border-top-left-radius:var(--elem-radius);border-top-right-radius:var(--elem-radius);display:flex;grid-area:header;justify-content:space-between;padding:.5rem 1rem}header h4{font-size:1rem;font-weight:400;line-height:1.1876;margin:0}header mdn-button{margin-right:-.5rem}mdn-play-editor{grid-area:editor;height:100%;overflow:auto}.buttons{display:flex;flex-direction:column;gap:.5rem;grid-area:buttons}mdn-play-console{border:var(--border);border-radius:var(--elem-radius);grid-area:console}mdn-ix-tab-wrapper{grid-area:tabs}.template-console{align-content:start;display:grid;gap:.5rem;grid-template-areas:"header  header" "editor  editor" "buttons console";grid-template-columns:max-content 1fr;grid-template-rows:max-content 1fr 8rem;height:100%}.template-console header{border:var(--border)}.template-console mdn-play-runner{display:none}.template-console mdn-ix-tab-wrapper,.template-console>mdn-play-editor{border:var(--border);border-bottom-left-radius:var(--elem-radius);border-bottom-right-radius:var(--elem-radius);border-top:0;grid-area:editor;margin-top:-.5rem}@media (max-width:769px){.template-console{grid-template-areas:"header" "editor" "buttons" "console";grid-template-columns:1fr;grid-template-rows:max-content 1fr max-content 8rem}.template-console .buttons{flex-direction:row;justify-content:space-between}}.template-tabbed{border:var(--border);border-radius:var(--elem-radius);display:grid;grid-template-areas:"header header" "tabs   runner";grid-template-columns:6fr 4fr;grid-template-rows:max-content 1fr;height:100%;overflow:hidden}.template-tabbed .output-wrapper{border-left:var(--border);grid-area:runner;overflow:hidden;position:relative}:is(.template-tabbed .output-wrapper) h4{background-color:var(--color-background-secondary);border-bottom-left-radius:var(--elem-radius);color:var(--text-secondary);font:var(--tabbed-font-heading);margin:0;padding:.5rem 1.6rem;position:absolute;right:0;text-transform:uppercase;top:0;z-index:2}@media (max-width:992px){.template-tabbed{grid-template-areas:"header" "tabs" "runner";grid-template-columns:1fr;grid-template-rows:max-content 1fr 1fr}.template-tabbed .output-wrapper{border-left:0;border-top:var(--border)}}.template-choices{border:var(--border);border-radius:var(--elem-radius);display:grid;grid-template-areas:"header header" "choice runner";grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:max-content 1fr;height:100%}@media (max-width:992px){.template-choices{grid-template-areas:"header" "choice" "runner";grid-template-columns:1fr}}.template-choices .choice-wrapper{border-right:var(--border);display:flex;flex-direction:column;grid-area:choice;overflow-y:auto;padding:1rem 0 1rem 1rem;row-gap:.4rem}@media (max-width:992px){.template-choices .choice-wrapper{border-bottom:var(--border);border-right:none;padding-right:1em}}:is(.template-choices .choice-wrapper) .choice{--csstools-light-dark-toggle--0:var(--csstools-color-scheme--light) var(--color-blue-80);--field-focus-border:var(--csstools-light-dark-toggle--0,var(--color-blue-50));--csstools-light-dark-toggle--1:var(--csstools-color-scheme--light) var(--color-blue-10);--focus-01:0 0 0 3px var(--csstools-light-dark-toggle--1,var(--color-blue-90));align-items:center;display:flex;flex-grow:1}@supports (color:light-dark(red,red)){:is(.template-choices .choice-wrapper) .choice{--field-focus-border:light-dark(var(--color-blue-50),var(--color-blue-80));--focus-01:0 0 0 3px light-dark(var(--color-blue-90),var(--color-blue-10))}}@supports not (color:light-dark(tan,tan)){:is(:is(.template-choices .choice-wrapper) .choice) *{--csstools-light-dark-toggle--0:var(--csstools-color-scheme--light) var(--color-blue-80);--field-focus-border:var(--csstools-light-dark-toggle--0,var(--color-blue-50));--csstools-light-dark-toggle--1:var(--csstools-color-scheme--light) var(--color-blue-10);--focus-01:0 0 0 3px var(--csstools-light-dark-toggle--1,var(--color-blue-90))}}:is(:is(.template-choices .choice-wrapper) .choice):after{color:var(--field-focus-border);content:"▶";font-size:.5rem;opacity:0;padding:0 1rem 0 .25rem;width:1rem}@media (max-width:992px){:is(:is(.template-choices .choice-wrapper) .choice):after{display:none}}.selected:is(:is(.template-choices .choice-wrapper) .choice) mdn-play-editor{border-color:var(--field-focus-border);box-shadow:var(--focus-01);cursor:text}.selected:is(:is(.template-choices .choice-wrapper) .choice):after{opacity:1;padding-left:.75rem;padding-right:.5rem;transition:all .2s ease-out}.unsupported:is(:is(.template-choices .choice-wrapper) .choice) mdn-play-editor{--csstools-light-dark-toggle--2:var(--csstools-color-scheme--light) var(--color-yellow-80);border-color:var(--csstools-light-dark-toggle--2,var(--color-yellow-50))}@supports (color:light-dark(red,red)){.unsupported:is(:is(.template-choices .choice-wrapper) .choice) mdn-play-editor{border-color:light-dark(var(--color-yellow-50),var(--color-yellow-80))}}.unsupported:is(:is(.template-choices .choice-wrapper) .choice):after{background-image:url(${h});background-position:50%;background-repeat:no-repeat;background-size:1rem;content:"";height:1rem;opacity:1;transition:none;width:1rem}:is(:is(.template-choices .choice-wrapper) .choice) mdn-play-editor{border:var(--border);border-radius:var(--elem-radius);cursor:pointer;width:100%}.template-choices .output-wrapper{height:300px;overflow:hidden}`,""]);let m=(0,o.iv)([p.toString()])}};
+//# sourceMappingURL=2656.aff378afb664f75e.js.map

package/dist/client/2656.aff378afb664f75e.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"2656.aff378afb664f75e.js","sources":["webpack://@mdn/fred/./components/interactive-example/utils.js","webpack://@mdn/fred/./components/interactive-example/with-choices.js","webpack://@mdn/fred/./components/interactive-example/with-console.js","webpack://@mdn/fred/./components/interactive-example/with-tabs.js","webpack://@mdn/fred/./components/interactive-example/element.js","webpack://@mdn/fred/./utils/glean.js","webpack://@mdn/fred/./components/interactive-example/element.css"],"sourcesContent":["/**\n * Checks if the CSS code is supported by the current browser.\n *\n * @param {string} code\n */\nexport function isCSSSupported(code) {\n  // http://regexr.com/3fvik\n  const cssCommentsMatch = /(\\/\\*)[\\s\\S]+(\\*\\/)/g;\n  const element = document.createElement(\"div\");\n\n  // strip out any CSS comments before applying the code\n  code = code.replaceAll(cssCommentsMatch, \"\");\n\n  const vendorPrefixMatch = /^-(?:webkit|moz|ms|o)-/;\n  const style = element.style;\n  // Expecting declarations to be separated by \";\"\n  // Declarations with just white space are ignored\n  const declarationsArray = code\n    .split(\";\")\n    .map((d) => d.trim())\n    .filter((d) => d.length > 0);\n\n  /**\n   * @param {string} declaration\n   * @returns {boolean} - true if declaration starts with -webkit-, -moz-, -ms- or -o-\n   */\n  function hasVendorPrefix(declaration) {\n    return vendorPrefixMatch.test(declaration);\n  }\n\n  /**\n   * Looks for property name by cutting off optional vendor prefix at the beginning\n   * and then cutting off rest of the declaration, starting from any whitespace or \":\" in property name.\n   * @param {string} declaration - single css declaration, with not white space at the beginning\n   * @returns {string} - property name without vendor prefix.\n   */\n  function getPropertyNameNoPrefix(declaration) {\n    const prefixMatch = vendorPrefixMatch.exec(declaration);\n    const prefix = prefixMatch === null ? \"\" : prefixMatch[0];\n    const declarationNoPrefix =\n      prefix === null ? declaration : declaration.slice(prefix.length);\n    // Expecting property name to be over, when any whitespace or \":\" is found\n    const propertyNameSeparator = /[\\s:]/;\n    return declarationNoPrefix.split(propertyNameSeparator)[0] ?? \"\";\n  }\n\n  // Clearing previous state\n  style.cssText = \"\";\n\n  // List of found and applied properties with vendor prefix\n  const appliedPropertiesWithPrefix = new Set();\n  // List of not applied properties - because of lack of support for its name or value\n  const notAppliedProperties = new Set();\n\n  for (const declaration of declarationsArray) {\n    const previousCSSText = style.cssText;\n    // Declarations are added one by one, because browsers sometimes combine multiple declarations into one\n    // For example Chrome changes \"column-count: auto;column-width: 8rem;\" into \"columns: 8rem auto;\"\n    style.cssText += declaration + \";\"; // \";\" was previous removed while using split method\n    // In case property name or value is not supported, browsers skip single declaration, while leaving rest of them intact\n    const correctlyApplied = style.cssText !== previousCSSText;\n\n    const vendorPrefixFound = hasVendorPrefix(declaration);\n    const propertyName = getPropertyNameNoPrefix(declaration);\n\n    if (correctlyApplied && vendorPrefixFound) {\n      // We are saving applied properties with prefix, so equivalent property with no prefix doesn't need to be supported\n      appliedPropertiesWithPrefix.add(propertyName);\n    } else if (!correctlyApplied && !vendorPrefixFound) {\n      notAppliedProperties.add(propertyName);\n    }\n  }\n\n  if (notAppliedProperties.size > 0) {\n    // If property with vendor prefix is supported, we can ignore the fact that browser doesn't support property with no prefix\n    for (const substitute of appliedPropertiesWithPrefix) {\n      notAppliedProperties.delete(substitute);\n    }\n    // If any other declaration is not supported, whole block should be marked as invalid\n    if (notAppliedProperties.size > 0) return false;\n  }\n  return true;\n}\n","import { decode } from \"he\";\nimport { html } from \"lit\";\nimport { ref } from \"lit/directives/ref.js\";\n\nimport { L10nMixin } from \"../../l10n/mixin.js\";\nimport { MDNPlayEditor } from \"../play-editor/element.js\";\n\nimport { isCSSSupported } from \"./utils.js\";\n\nimport \"../play-controller/element.js\";\nimport \"../play-runner/element.js\";\n\n/**\n * @import { InteractiveExampleBase } from \"./element.js\";\n */\n\n/**\n * @template {new (...args: any[]) => InteractiveExampleBase} TBase\n * @param {TBase} Base\n */\nexport const InteractiveExampleWithChoices = (Base) =>\n  class extends L10nMixin(Base) {\n    static properties = {\n      __choiceSelected: { state: true },\n      __choiceUnsupported: { state: true },\n    };\n\n    /** @param {any[]} _args  */\n    constructor(..._args) {\n      super();\n      /** @type {number} */\n      this.__choiceSelected = -1;\n      /** @type {boolean[]} */\n      this.__choiceUnsupported = [];\n    }\n\n    /** @param {MouseEvent} event  */\n    #choiceFocus({ target }) {\n      if (target instanceof MDNPlayEditor) {\n        target.focus();\n      }\n    }\n\n    /** @param {MouseEvent} event  */\n    #choiceSelect({ target }) {\n      if (target instanceof MDNPlayEditor) {\n        this.#updateUnsupported(target);\n        this.#selectChoice(target);\n      }\n    }\n\n    /** @param {Event} event  */\n    #choiceUpdate({ target }) {\n      if (target instanceof MDNPlayEditor) {\n        this.#updateUnsupported(target);\n        if (this.__choiceSelected === this.#getIndex(target)) {\n          this.#selectChoice(target);\n        }\n      }\n    }\n\n    #resetChoices() {\n      this.__choiceSelected = -1;\n\n      const editorNodes = [\n        ...(this.shadowRoot?.querySelectorAll(\"mdn-play-editor\") || []),\n      ];\n\n      for (const [index, editorNode] of [...editorNodes].entries()) {\n        const code = this._choices?.at(index) ?? \"\";\n        editorNode.value = code;\n      }\n\n      this.__choiceUnsupported =\n        this._choices?.map((code) => !isCSSSupported(code || \"\")) || [];\n\n      const first = editorNodes[0];\n      if (first) {\n        this.#selectChoice(first);\n      }\n    }\n\n    /** @param {MDNPlayEditor} editor */\n    async #selectChoice(editor) {\n      const index = this.#getIndex(editor);\n      await this._runner.value?.postMessage({\n        typ: \"choice\",\n        code: editor.value,\n      });\n      this.__choiceSelected = index;\n    }\n\n    /** @param {MDNPlayEditor} editor */\n    #updateUnsupported(editor) {\n      const index = this.#getIndex(editor);\n      this.__choiceUnsupported = this.__choiceUnsupported.map((value, i) =>\n        index === i ? !isCSSSupported(editor.value) : value,\n      );\n    }\n\n    /** @param {MDNPlayEditor} editor */\n    #getIndex(editor) {\n      return Number.parseInt(editor.dataset.index ?? \"-1\", 10);\n    }\n\n    #render() {\n      return html`\n        <div class=\"template-choices\">\n          <header>\n            <h4>${decode(this.name)}</h4>\n            <mdn-button id=\"reset\" @click=${this._reset} variant=\"secondary\"\n              >${this.l10n`Reset`}</mdn-button\n            >\n          </header>\n          <div\n            class=\"choice-wrapper\"\n            @click=${this.#choiceFocus}\n            @focus=${this.#choiceSelect}\n            @update=${this.#choiceUpdate}\n          >\n            ${this._choices?.map(\n              (code, index) => html`\n                <div\n                  class=${[\n                    \"choice\",\n                    ...(index === this.__choiceSelected ? [\"selected\"] : []),\n                    ...(this.__choiceUnsupported[index] ? [\"unsupported\"] : []),\n                  ].join(\" \")}\n                >\n                  <mdn-play-editor\n                    data-index=${index}\n                    language=\"css\"\n                    minimal=\"true\"\n                    .delay=${100}\n                    .value=${code?.trim()}\n                  ></mdn-play-editor>\n                </div>\n              `,\n            )}\n          </div>\n          <div class=\"output-wrapper\">\n            <mdn-play-controller ${ref(this._controller)} run-on-start>\n              <mdn-play-runner\n                ${ref(this._runner)}\n                defaults=\"ix-choice\"\n              ></mdn-play-runner>\n            </mdn-play-controller>\n          </div>\n        </div>\n      `;\n    }\n\n    _reset() {\n      if (this._template === \"choices\") {\n        this.#resetChoices();\n      } else {\n        super._reset();\n      }\n    }\n\n    _initialCode() {\n      const code = super._initialCode();\n      if (this._template === \"choices\") {\n        code[\"js-hidden\"] = `setChoice(${JSON.stringify(this._choices?.[0])})`;\n      }\n      return code;\n    }\n\n    render() {\n      return this._template === \"choices\" ? this.#render() : super.render();\n    }\n\n    firstUpdated() {\n      super.firstUpdated();\n      if (this._template === \"choices\") {\n        this.#resetChoices();\n      }\n    }\n  };\n","import { decode } from \"he\";\nimport { html } from \"lit\";\nimport { ifDefined } from \"lit/directives/if-defined.js\";\nimport { ref } from \"lit/directives/ref.js\";\n\nimport \"../play-controller/element.js\";\nimport \"../play-editor/element.js\";\nimport \"../play-runner/element.js\";\nimport \"../play-console/element.js\";\nimport \"../ix-tab/element.js\";\nimport \"../ix-tab-panel/element.js\";\nimport \"../ix-tab-wrapper/element.js\";\nimport { L10nMixin } from \"../../l10n/mixin.js\";\n\n/**\n * @import { InteractiveExampleBase } from \"./element.js\";\n */\n\n/**\n * @template {new (...args: any[]) => InteractiveExampleBase} TBase\n * @param {TBase} Base\n */\nexport const InteractiveExampleWithConsole = (Base) =>\n  class extends L10nMixin(Base) {\n    #render() {\n      return html`\n        <mdn-play-controller ${ref(this._controller)}>\n          <div class=\"template-console\">\n            <header>\n              <h4>${decode(this.name)}</h4>\n            </header>\n            ${this._languages.length === 1\n              ? html`<mdn-play-editor\n                  id=\"editor\"\n                  language=${ifDefined(this._languages[0])}\n                ></mdn-play-editor>`\n              : html`<mdn-ix-tab-wrapper>\n                  ${this._languages.map(\n                    (lang) => html`\n                      <mdn-ix-tab id=${lang}\n                        >${this._langName(lang)}</mdn-ix-tab\n                      >\n                      <mdn-ix-tab-panel id=${`${lang}-panel`}>\n                        <mdn-play-editor language=${lang}></mdn-play-editor>\n                      </mdn-ix-tab-panel>\n                    `,\n                  )}\n                </mdn-ix-tab-wrapper>`}\n            <div class=\"buttons\">\n              <mdn-button id=\"execute\" @click=${this._run} variant=\"secondary\"\n                >${this.l10n`Run`}</mdn-button\n              >\n              <mdn-button id=\"reset\" @click=${this._reset} variant=\"secondary\"\n                >${this.l10n`Reset`}</mdn-button\n              >\n            </div>\n            <mdn-play-console id=\"console\"></mdn-play-console>\n            <mdn-play-runner\n              defaults=${ifDefined(\n                this._languages.includes(\"wat\") ? \"ix-wat\" : undefined,\n              )}\n            ></mdn-play-runner>\n          </div>\n        </mdn-play-controller>\n      `;\n    }\n\n    render() {\n      return this._template === \"console\" ? this.#render() : super.render();\n    }\n  };\n","import { decode } from \"he\";\nimport { html } from \"lit\";\nimport { ref } from \"lit/directives/ref.js\";\n\nimport \"../play-controller/element.js\";\nimport \"../play-editor/element.js\";\nimport \"../play-runner/element.js\";\nimport \"../ix-tab/element.js\";\nimport \"../ix-tab-panel/element.js\";\nimport \"../ix-tab-wrapper/element.js\";\nimport { L10nMixin } from \"../../l10n/mixin.js\";\n\n/**\n * @import { InteractiveExampleBase } from \"./element.js\";\n */\n\n/**\n * @template {new (...args: any[]) => InteractiveExampleBase} TBase\n * @param {TBase} Base\n */\nexport const InteractiveExampleWithTabs = (Base) =>\n  class extends L10nMixin(Base) {\n    #render() {\n      return html`\n        <mdn-play-controller\n          ${ref(this._controller)}\n          run-on-start\n          run-on-change\n        >\n          <div class=\"template-tabbed\">\n            <header>\n              <h4>${decode(this.name)}</h4>\n              <mdn-button id=\"reset\" @click=${this._reset} variant=\"secondary\"\n                >${this.l10n`Reset`}</mdn-button\n              >\n            </header>\n            <mdn-ix-tab-wrapper>\n              ${this._languages.map(\n                (lang) => html`\n                  <mdn-ix-tab id=${lang}>${this._langName(lang)}</mdn-ix-tab>\n                  <mdn-ix-tab-panel id=${`${lang}-panel`}>\n                    <mdn-play-editor language=${lang}></mdn-play-editor>\n                  </mdn-ix-tab-panel>\n                `,\n              )}\n            </mdn-ix-tab-wrapper>\n            <div class=\"output-wrapper\">\n              <h4>${this.l10n`Output`}</h4>\n              <mdn-play-runner\n                ${ref(this._runner)}\n                sandbox=\"allow-top-navigation-by-user-activation\"\n                defaults=\"ix-tabbed\"\n              ></mdn-play-runner>\n            </div>\n          </div>\n        </mdn-play-controller>\n      `;\n    }\n\n    render() {\n      return this._template === \"tabbed\" ? this.#render() : super.render();\n    }\n  };\n","import { LitElement } from \"lit\";\nimport { createRef } from \"lit/directives/ref.js\";\n\nimport { gleanClick } from \"../../utils/glean.js\";\nimport { upgradePre } from \"../code-example/element.js\";\n\nimport styles from \"./element.css?lit\";\nimport { InteractiveExampleWithChoices } from \"./with-choices.js\";\nimport { InteractiveExampleWithConsole } from \"./with-console.js\";\nimport { InteractiveExampleWithTabs } from \"./with-tabs.js\";\n\n/**\n * @import { Ref } from 'lit/directives/ref.js';\n * @import { MDNPlayController } from \"../play-controller/element.js\";\n * @import { MDNPlayRunner } from \"../play-runner/element.js\";\n */\n\nconst GLEAN_EVENT_TYPES = [\"focus\", \"copy\", \"cut\", \"paste\", \"click\"];\n\n// eslint-disable-next-line fred/custom-element-name\nexport class InteractiveExampleBase extends LitElement {\n  static ssr = false;\n\n  static properties = { name: { type: String } };\n\n  static styles = styles;\n\n  constructor() {\n    super();\n    this.name = \"\";\n    /** @type {string[]} */\n    this._languages = [];\n    /** @type {Record<string, string>} */\n    this._code = {};\n  }\n\n  /** @type {Ref<MDNPlayController>} */\n  _controller = createRef();\n  /** @type {Ref<MDNPlayRunner>} */\n  _runner = createRef();\n\n  _run() {\n    this._controller.value?.run();\n  }\n\n  _reset() {\n    this._controller.value?.reset();\n  }\n\n  _initialCode() {\n    /** @type {Record<string, string>} */\n    const initialCode = {};\n    for (const pre of this.closest(\"section\")?.querySelectorAll(\n      \".code-example pre.interactive-example\",\n    ) ?? []) {\n      const example = upgradePre(pre);\n      if (example) {\n        const { language, code } = example;\n        initialCode[language] = initialCode[language]\n          ? `${initialCode[language]}\\n${code}`\n          : code;\n      }\n    }\n\n    this._choices = [\n      ...(this.closest(\"section\")?.querySelectorAll(\n        \".code-example pre.interactive-example-choice\",\n      ) || []),\n    ]\n      .map((pre) => upgradePre(pre)?.code.trim())\n      .filter((x) => x !== undefined);\n\n    this._languages = Object.keys(initialCode);\n    this._template =\n      this._choices.length > 0\n        ? \"choices\"\n        : (this._languages.length === 1 && this._languages[0] === \"js\") ||\n            (this._languages.includes(\"js\") && this._languages.includes(\"wat\"))\n          ? \"console\"\n          : \"tabbed\";\n\n    return initialCode;\n  }\n\n  /** @param {string} lang */\n  _langName(lang) {\n    switch (lang) {\n      case \"js\":\n        return \"JavaScript\";\n      default:\n        return lang.toUpperCase();\n    }\n  }\n\n  /** @param {Event} ev  */\n  _telemetryHandler(ev) {\n    let action = ev.type;\n    if (\n      ev.type === \"click\" &&\n      ev.target instanceof HTMLElement &&\n      ev.target.id\n    ) {\n      action = `click@${ev.target.id}`;\n    }\n    gleanClick(\"interactive-example\", { type: \"action\", label: action });\n  }\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._telemetryHandler = this._telemetryHandler.bind(this);\n    for (const type of GLEAN_EVENT_TYPES) {\n      this.renderRoot.addEventListener(type, this._telemetryHandler);\n    }\n    this._code = this._initialCode();\n  }\n\n  firstUpdated() {\n    if (this._controller.value) {\n      this._controller.value.code = this._code;\n    }\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback();\n    for (const type of GLEAN_EVENT_TYPES) {\n      this.renderRoot.removeEventListener(type, this._telemetryHandler);\n    }\n  }\n}\n\nexport class MDNInteractiveExample extends InteractiveExampleWithChoices(\n  InteractiveExampleWithTabs(\n    InteractiveExampleWithConsole(InteractiveExampleBase),\n  ),\n) {}\n\n// TODO: rari outputs <interactive-example> rather than <mdn-interactive-example>\n// customElements.define(\"mdn-interactive-example\", MDNInteractiveExample);\ncustomElements.define(\"interactive-example\", MDNInteractiveExample);\n","// @ts-expect-error \"Could not find declaration file\"\nimport GleanMetrics from \"@mozilla/glean/metrics\";\n\n/**\n * Records a click event.\n *\n * Use only if automatic click events are not an option.\n * See: https://mozilla.github.io/glean.js/automatic_instrumentation/click_events/\n *\n * @param {string} id\n * @param {object} options\n * @param {string=} options.type\n * @param {string=} options.label\n */\nexport function gleanClick(id, { type, label }) {\n  GleanMetrics.recordElementClick({\n    id,\n    type,\n    label,\n  });\n}\n","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/triangle-alert.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___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `:host{--border:1px solid var(--color-border-primary);--tabbed-font-heading:600 0.625rem/1.2 var(--font-family-text);--elem-radius:0.25rem}header{align-items:center;border-bottom:var(--border);border-top-left-radius:var(--elem-radius);border-top-right-radius:var(--elem-radius);display:flex;grid-area:header;justify-content:space-between;padding:.5rem 1rem}header h4{font-size:1rem;font-weight:400;line-height:1.1876;margin:0}header mdn-button{margin-right:-.5rem}mdn-play-editor{grid-area:editor;height:100%;overflow:auto}.buttons{display:flex;flex-direction:column;gap:.5rem;grid-area:buttons}mdn-play-console{border:var(--border);border-radius:var(--elem-radius);grid-area:console}mdn-ix-tab-wrapper{grid-area:tabs}.template-console{align-content:start;display:grid;gap:.5rem;grid-template-areas:\"header  header\" \"editor  editor\" \"buttons console\";grid-template-columns:max-content 1fr;grid-template-rows:max-content 1fr 8rem;height:100%}.template-console header{border:var(--border)}.template-console mdn-play-runner{display:none}.template-console mdn-ix-tab-wrapper,.template-console>mdn-play-editor{border:var(--border);border-bottom-left-radius:var(--elem-radius);border-bottom-right-radius:var(--elem-radius);border-top:0;grid-area:editor;margin-top:-.5rem}@media (max-width:769px){.template-console{grid-template-areas:\"header\" \"editor\" \"buttons\" \"console\";grid-template-columns:1fr;grid-template-rows:max-content 1fr max-content 8rem}.template-console .buttons{flex-direction:row;justify-content:space-between}}.template-tabbed{border:var(--border);border-radius:var(--elem-radius);display:grid;grid-template-areas:\"header header\" \"tabs   runner\";grid-template-columns:6fr 4fr;grid-template-rows:max-content 1fr;height:100%;overflow:hidden}.template-tabbed .output-wrapper{border-left:var(--border);grid-area:runner;overflow:hidden;position:relative}:is(.template-tabbed .output-wrapper) h4{background-color:var(--color-background-secondary);border-bottom-left-radius:var(--elem-radius);color:var(--text-secondary);font:var(--tabbed-font-heading);margin:0;padding:.5rem 1.6rem;position:absolute;right:0;text-transform:uppercase;top:0;z-index:2}@media (max-width:992px){.template-tabbed{grid-template-areas:\"header\" \"tabs\" \"runner\";grid-template-columns:1fr;grid-template-rows:max-content 1fr 1fr}.template-tabbed .output-wrapper{border-left:0;border-top:var(--border)}}.template-choices{border:var(--border);border-radius:var(--elem-radius);display:grid;grid-template-areas:\"header header\" \"choice runner\";grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:max-content 1fr;height:100%}@media (max-width:992px){.template-choices{grid-template-areas:\"header\" \"choice\" \"runner\";grid-template-columns:1fr}}.template-choices .choice-wrapper{border-right:var(--border);display:flex;flex-direction:column;grid-area:choice;overflow-y:auto;padding:1rem 0 1rem 1rem;row-gap:.4rem}@media (max-width:992px){.template-choices .choice-wrapper{border-bottom:var(--border);border-right:none;padding-right:1em}}:is(.template-choices .choice-wrapper) .choice{--csstools-light-dark-toggle--0:var(--csstools-color-scheme--light) var(--color-blue-80);--field-focus-border:var(--csstools-light-dark-toggle--0,var(--color-blue-50));--csstools-light-dark-toggle--1:var(--csstools-color-scheme--light) var(--color-blue-10);--focus-01:0 0 0 3px var(--csstools-light-dark-toggle--1,var(--color-blue-90));align-items:center;display:flex;flex-grow:1}@supports (color:light-dark(red,red)){:is(.template-choices .choice-wrapper) .choice{--field-focus-border:light-dark(var(--color-blue-50),var(--color-blue-80));--focus-01:0 0 0 3px light-dark(var(--color-blue-90),var(--color-blue-10))}}@supports not (color:light-dark(tan,tan)){:is(:is(.template-choices .choice-wrapper) .choice) *{--csstools-light-dark-toggle--0:var(--csstools-color-scheme--light) var(--color-blue-80);--field-focus-border:var(--csstools-light-dark-toggle--0,var(--color-blue-50));--csstools-light-dark-toggle--1:var(--csstools-color-scheme--light) var(--color-blue-10);--focus-01:0 0 0 3px var(--csstools-light-dark-toggle--1,var(--color-blue-90))}}:is(:is(.template-choices .choice-wrapper) .choice):after{color:var(--field-focus-border);content:\"▶\";font-size:.5rem;opacity:0;padding:0 1rem 0 .25rem;width:1rem}@media (max-width:992px){:is(:is(.template-choices .choice-wrapper) .choice):after{display:none}}.selected:is(:is(.template-choices .choice-wrapper) .choice) mdn-play-editor{border-color:var(--field-focus-border);box-shadow:var(--focus-01);cursor:text}.selected:is(:is(.template-choices .choice-wrapper) .choice):after{opacity:1;padding-left:.75rem;padding-right:.5rem;transition:all .2s ease-out}.unsupported:is(:is(.template-choices .choice-wrapper) .choice) mdn-play-editor{--csstools-light-dark-toggle--2:var(--csstools-color-scheme--light) var(--color-yellow-80);border-color:var(--csstools-light-dark-toggle--2,var(--color-yellow-50))}@supports (color:light-dark(red,red)){.unsupported:is(:is(.template-choices .choice-wrapper) .choice) mdn-play-editor{border-color:light-dark(var(--color-yellow-50),var(--color-yellow-80))}}.unsupported:is(:is(.template-choices .choice-wrapper) .choice):after{background-image:url(${___CSS_LOADER_URL_REPLACEMENT_0___});background-position:50%;background-repeat:no-repeat;background-size:1rem;content:\"\";height:1rem;opacity:1;transition:none;width:1rem}:is(:is(.template-choices .choice-wrapper) .choice) mdn-play-editor{border:var(--border);border-radius:var(--elem-radius);cursor:pointer;width:100%}.template-choices .output-wrapper{height:300px;overflow:hidden}`, \"\"]);\n// Exports\nexport default css([___CSS_LOADER_EXPORT___.toString()]);\n"],"names":["document","Set","e","Number","d","JSON","InteractiveExampleBase","String","Object","HTMLElement","MDNInteractiveExample","customElements","t"],"mappings":"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"}

package/dist/client/2683.28adf6c710696773.js

@@ -0,0 +1,45 @@
+export const __webpack_ids__=["2683"];export const __webpack_modules__={15823:function(e,r,o){o.d(r,{Z:()=>d});var n=o(8081),t=o.n(n),i=o(23645),l=o.n(i),s=o(56718),a=l()(t());a.i(s.Z),a.push([e.id,":host{display:inline-flex;vertical-align:middle}.button{box-sizing:border-box;height:100%;width:100%}",""]);let d=a.toString()},1849:function(e,r,o){o.r(r),o.d(r,{MDNUserMenu:()=>MDNUserMenu});var n=o(35470),t=o(14703),i=o(69535),l=o(8900),s=o(13117),a=o(54487);let MDNUserMenu=class MDNUserMenu extends(0,i.q)(t.oi){static styles=a.Z;static properties={locale:{type:String}};constructor(){super(),this.locale="en-US"}#e(){let e=globalThis.location.origin,r=new URL(l.sA,e);return r.searchParams.append("next",this.#r()),r.toString()}#r(){return globalThis.location.href.replace(globalThis.location.origin,"")}#o(){let e=globalThis.location.origin;return new URL(l.vd,e).toString()}_user=new n.iQ(this,{task:async()=>await (0,s.s)()});connectedCallback(){super.connectedCallback(),this._user.run()}render(){return this._user.render({initial:()=>t.Ld,pending:()=>t.Ld,complete:e=>{let r=[{href:`/${this.locale}/plus/ai-help`,label:this.l10n`AI Help`},{href:`/${this.locale}/plus/collections`,label:this.l10n`Collections`},{href:`/${this.locale}/plus/updates`,label:this.l10n`Updates`},{href:`/${this.locale}/plus/settings`,label:this.l10n("settings")},{href:"https://support.mozilla.org/products/mdn-plus",label:this.l10n`Help`,external:!0},{href:"https://github.com/mdn/MDN-feedback",label:this.l10n`Feedback`,external:!0}];return e.isAuthenticated?(0,t.dy)`<div class="user-menu">
+                <mdn-dropdown>
+                  <button
+                    slot="button"
+                    class="user-menu__button"
+                    title=${this.l10n("user-menu")}
+                  >
+                    <img width="34" height="34" src=${e.avatarUrl} />
+                  </button>
+                  <div slot="dropdown" class="user-menu__dropdown">
+                    <ul>
+                      <li>
+                        <div class="user-menu__item">${e.email}</div>
+                      </li>
+                      <li class="user-menu__divider"></li>
+                      ${r.map(e=>(0,t.dy)`<li>
+                            <a
+                              class=${e.external?"user-menu__item external":"user-menu__item"}
+                              href=${e.href}
+                              >${e.label}</a
+                            >
+                          </li>`)}
+                      <li class="user-menu__divider"></li>
+                      <li>
+                        <form method="post" action=${this.#o()}>
+                          <input
+                            type="hidden"
+                            name="next"
+                            .value=${this.#r()}
+                          />
+                          <button type="submit">${this.l10n("logout")}</button>
+                        </form>
+                      </li>
+                    </ul>
+                  </div>
+                </mdn-dropdown>
+              </div>`:(0,t.dy)`<div class="login-container">
+                <a
+                  class="login"
+                  title=${this.l10n("login")}
+                  href=${this.#e()}
+                  >👤</a
+                >
+              </div>`}})}};customElements.define("mdn-user-menu",MDNUserMenu)},54487:function(e,r,o){o.d(r,{Z:()=>c});var n=o(14703),t=o(8081),i=o.n(t),l=o(23645),s=o.n(l),a=o(15823),d=o(96818),u=s()(i());u.i(a.Z),u.i(d.Z),u.push([e.id,"*,:after,:before{box-sizing:border-box}:host{height:100%}.user-menu{position:relative}.login-container{display:flex;height:100%}.login-container .login{align-self:center;background-color:var(--color-background-secondary);border:1px solid var(--color-border-secondary);border-radius:100%;display:block;height:34px;justify-self:center;padding:.25rem .5rem;-webkit-text-decoration:none;text-decoration:none;text-wrap:nowrap;width:34px}.user-menu__button{align-items:center;border:none;border-radius:100%;cursor:pointer;display:inline-flex;height:100%}.user-menu__button img{border:1px solid var(--color-border-secondary);border-radius:100%}.user-menu__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}.user-menu__dropdown ul{list-style:none;margin:0;padding:0}.user-menu__dropdown a{border:1px solid #0000;color:var(--color-text-primary);display:flex;-webkit-text-decoration:none;text-decoration:none}:is(.user-menu__dropdown a):hover{background-color:var(--color-background-secondary);border-color:var(--color-border-primary)}.user-menu__dropdown button{cursor:pointer;padding:.5rem;width:100%}.user-menu__item{border-radius:.25rem;padding:.75rem}.user-menu__divider{border-bottom:1px solid var(--color-border-primary);margin:.75rem 0}",""]);let c=(0,n.iv)([u.toString()])}};
+//# sourceMappingURL=2683.28adf6c710696773.js.map

package/dist/client/2683.28adf6c710696773.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"2683.28adf6c710696773.js","sources":["webpack://@mdn/fred/./components/button/element.css","webpack://@mdn/fred/./components/user-menu/element.js","webpack://@mdn/fred/./components/user-menu/element.css"],"sourcesContent":["// 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]!../../node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!./server.css\";\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___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `:host{display:inline-flex;vertical-align:middle}.button{box-sizing:border-box;height:100%;width:100%}`, \"\"]);\n// Exports\nexport default ___CSS_LOADER_EXPORT___.toString();\n","import { Task } from \"@lit/task\";\nimport { LitElement, html, nothing } from \"lit\";\n\nimport { L10nMixin } from \"../../l10n/mixin.js\";\n\nimport { FXA_SIGNIN_URL, FXA_SIGNOUT_URL } from \"../env/index.js\";\nimport { globalUser } from \"../user/context.js\";\n\nimport styles from \"./element.css?lit\";\n\nexport class MDNUserMenu extends L10nMixin(LitElement) {\n  static styles = styles;\n\n  static properties = {\n    locale: { type: String },\n  };\n\n  constructor() {\n    super();\n    this.locale = \"en-US\";\n  }\n\n  #loginUrl() {\n    const base = globalThis.location.origin;\n    const url = new URL(FXA_SIGNIN_URL, base);\n    url.searchParams.append(\"next\", this.#next());\n    return url.toString();\n  }\n\n  #next() {\n    const next = globalThis.location.href.replace(\n      globalThis.location.origin,\n      \"\",\n    );\n    return next;\n  }\n\n  #logoutUrl() {\n    const base = globalThis.location.origin;\n    const url = new URL(FXA_SIGNOUT_URL, base);\n    return url.toString();\n  }\n\n  _user = new Task(this, {\n    task: async () => {\n      return await globalUser();\n    },\n  });\n\n  connectedCallback() {\n    super.connectedCallback();\n    this._user.run();\n  }\n\n  render() {\n    return this._user.render({\n      initial: () => nothing,\n      pending: () => nothing,\n\n      complete:\n        /**\n         * @param {import(\"../user/types.js\").User} user\n         */\n        (user) => {\n          const links = [\n            {\n              href: `/${this.locale}/plus/ai-help`,\n              label: this.l10n`AI Help`,\n            },\n            {\n              href: `/${this.locale}/plus/collections`,\n              label: this.l10n`Collections`,\n            },\n            {\n              href: `/${this.locale}/plus/updates`,\n              label: this.l10n`Updates`,\n            },\n            {\n              href: `/${this.locale}/plus/settings`,\n              label: this.l10n(\"settings\"),\n            },\n            {\n              href: \"https://support.mozilla.org/products/mdn-plus\",\n              label: this.l10n`Help`,\n              external: true,\n            },\n            {\n              href: \"https://github.com/mdn/MDN-feedback\",\n              label: this.l10n`Feedback`,\n              external: true,\n            },\n          ];\n\n          return user.isAuthenticated\n            ? html`<div class=\"user-menu\">\n                <mdn-dropdown>\n                  <button\n                    slot=\"button\"\n                    class=\"user-menu__button\"\n                    title=${this.l10n(\"user-menu\")}\n                  >\n                    <img width=\"34\" height=\"34\" src=${user.avatarUrl} />\n                  </button>\n                  <div slot=\"dropdown\" class=\"user-menu__dropdown\">\n                    <ul>\n                      <li>\n                        <div class=\"user-menu__item\">${user.email}</div>\n                      </li>\n                      <li class=\"user-menu__divider\"></li>\n                      ${links.map(\n                        (link) =>\n                          html`<li>\n                            <a\n                              class=${link.external\n                                ? \"user-menu__item external\"\n                                : \"user-menu__item\"}\n                              href=${link.href}\n                              >${link.label}</a\n                            >\n                          </li>`,\n                      )}\n                      <li class=\"user-menu__divider\"></li>\n                      <li>\n                        <form method=\"post\" action=${this.#logoutUrl()}>\n                          <input\n                            type=\"hidden\"\n                            name=\"next\"\n                            .value=${this.#next()}\n                          />\n                          <button type=\"submit\">${this.l10n(\"logout\")}</button>\n                        </form>\n                      </li>\n                    </ul>\n                  </div>\n                </mdn-dropdown>\n              </div>`\n            : html`<div class=\"login-container\">\n                <a\n                  class=\"login\"\n                  title=${this.l10n(\"login\")}\n                  href=${this.#loginUrl()}\n                  >👤</a\n                >\n              </div>`;\n        },\n    });\n  }\n}\n\ncustomElements.define(\"mdn-user-menu\", MDNUserMenu);\n","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]!../../node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!../button/element.css\";\nimport ___CSS_LOADER_AT_RULE_IMPORT_1___ from \"-!../../node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[4].use[1]!../../node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[4].use[2]!../external-link/global.css\";\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___);\n___CSS_LOADER_EXPORT___.i(___CSS_LOADER_AT_RULE_IMPORT_1___);\n// Module\n___CSS_LOADER_EXPORT___.push([module.id, `*,:after,:before{box-sizing:border-box}:host{height:100%}.user-menu{position:relative}.login-container{display:flex;height:100%}.login-container .login{align-self:center;background-color:var(--color-background-secondary);border:1px solid var(--color-border-secondary);border-radius:100%;display:block;height:34px;justify-self:center;padding:.25rem .5rem;-webkit-text-decoration:none;text-decoration:none;text-wrap:nowrap;width:34px}.user-menu__button{align-items:center;border:none;border-radius:100%;cursor:pointer;display:inline-flex;height:100%}.user-menu__button img{border:1px solid var(--color-border-secondary);border-radius:100%}.user-menu__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}.user-menu__dropdown ul{list-style:none;margin:0;padding:0}.user-menu__dropdown a{border:1px solid #0000;color:var(--color-text-primary);display:flex;-webkit-text-decoration:none;text-decoration:none}:is(.user-menu__dropdown a):hover{background-color:var(--color-background-secondary);border-color:var(--color-border-primary)}.user-menu__dropdown button{cursor:pointer;padding:.5rem;width:100%}.user-menu__item{border-radius:.25rem;padding:.75rem}.user-menu__divider{border-bottom:1px solid var(--color-border-primary);margin:.75rem 0}`, \"\"]);\n// Exports\nexport default css([___CSS_LOADER_EXPORT___.toString()]);\n"],"names":["MDNUserMenu","String","globalThis","URL","customElements"],"mappings":"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"}