@awc-ui/core 1.0.0-beta.2 → 1.0.0-beta.4

package/dist/components-csr/md-dialog.js

@@ -0,0 +1,2 @@
+import{p as e,H as i,c as a,h as s,d as t,t as o}from"./p-bSpXNc5J.js";import{d as n}from"./p-BZakoRau.js";import{d as l}from"./p-C3vB0Hd9.js";const d={close:"Close",cancel:"Cancel",ok:"OK"};const c={ar:{close:"إغلاق",cancel:"إلغاء",ok:"موافق"},de:{close:"Schließen",cancel:"Abbrechen",ok:"OK"},es:{close:"Cerrar",cancel:"Cancelar",ok:"Aceptar"},fr:{close:"Fermer",cancel:"Annuler",ok:"OK"},hi:{close:"बंद करें",cancel:"रद्द करें",ok:"ठीक"},it:{close:"Chiudi",cancel:"Annulla",ok:"OK"},ja:{close:"閉じる",cancel:"キャンセル",ok:"OK"},ko:{close:"닫기",cancel:"취소",ok:"확인"},nl:{close:"Sluiten",cancel:"Annuleren",ok:"OK"},pl:{close:"Zamknij",cancel:"Anuluj",ok:"OK"},pt:{close:"Fechar",cancel:"Cancelar",ok:"OK"},ro:{close:"Închide",cancel:"Anulează",ok:"OK"},ru:{close:"Закрыть",cancel:"Отмена",ok:"ОК"},zh:{close:"关闭",cancel:"取消",ok:"确定"}};function r(e){const i=e.trim();if(!i)return"en";try{return new Intl.Locale(i).language}catch{return i.split("-")[0].toLowerCase()}}function m(e,i){const a=r(e||"en-US");return c[a]?.[i]??d[i]}const h=()=>`:host{--_container-color:var(--md-dialog-container-color, var(--md-sys-color-surface-container-high, #ECE6F0));--_container-shape:var(--md-dialog-container-shape, max(16px, calc(28px + var(--md-sys-density-scale, 0) * 2px)));--_headline-color:var(--md-dialog-headline-color, var(--md-sys-color-on-surface, #1C1B1F));--_content-color:var(--md-dialog-content-color, var(--md-sys-color-on-surface-variant, #49454F));--_icon-color:var(--md-dialog-icon-color, var(--md-sys-color-secondary, #625B71));--_icon-size:var(--md-dialog-icon-size, 24px);--_scrim-color:var(--md-dialog-scrim-color, rgba(0, 0, 0, 0.32));--_divider-color:var(--md-dialog-divider-color, var(--md-sys-color-outline-variant, #CAC4D0));display:contents}.md-dialog__scrim{position:fixed;inset:0;background-color:var(--_scrim-color);z-index:var(--md-dialog-scrim-z-index, 2147483646);opacity:0;pointer-events:none;transition:opacity var(--md-sys-motion-duration-medium2, 300ms) var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1))}:host(.md-dialog--open) .md-dialog__scrim{opacity:1;pointer-events:auto}.md-dialog__container{position:fixed;top:50%;left:50%;transform:translate(-50%, calc(-50% + 20px));z-index:var(--md-dialog-z-index, 2147483647);background-color:var(--_container-color);border-radius:var(--_container-shape);box-shadow:var(--md-sys-elevation-3);min-inline-size:280px;max-inline-size:560px;inline-size:calc(100% - 48px);max-block-size:calc(100vh - 96px);display:flex;flex-direction:column;opacity:0;pointer-events:none;outline:none;overflow:hidden;transition:opacity var(--md-sys-motion-duration-medium2, 300ms) var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1)),     transform var(--md-sys-motion-duration-medium2, 300ms) var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1))}:host(.md-dialog--open) .md-dialog__container{opacity:1;pointer-events:auto;transform:translate(-50%, -50%)}.md-dialog__basic-header{display:flex;flex-direction:column;padding:max(12px, calc(24px + var(--md-sys-density-scale, 0) * 2px)) max(12px, calc(24px + var(--md-sys-density-scale, 0) * 2px)) 0;gap:max(8px, calc(16px + var(--md-sys-density-scale, 0) * 2px))}:host(.md-dialog--has-icon) .md-dialog__basic-header{align-items:center;text-align:center}:host(:not(.md-dialog--has-icon)) .md-dialog__basic-header{align-items:flex-start;text-align:start}.md-dialog__icon{font-family:var(--md-sys-icon-font-family, 'Material Symbols Outlined', 'Material Icons');font-size:var(--_icon-size);inline-size:var(--_icon-size);block-size:var(--_icon-size);color:var(--_icon-color);line-height:1;font-weight:normal;font-style:normal;letter-spacing:normal;text-transform:none;white-space:nowrap;overflow-wrap:normal;direction:ltr;-webkit-font-smoothing:antialiased}::slotted([slot="icon"]){display:inline-flex;align-items:center;justify-content:center;inline-size:var(--_icon-size);block-size:var(--_icon-size);font-size:var(--_icon-size);color:var(--_icon-color);fill:currentColor}.md-dialog__headline{font-family:var(--md-sys-typescale-headline-small-font-family, Roboto, sans-serif);font-size:max(18px, calc(24px + var(--md-sys-density-scale, 0) * 1px));font-weight:var(--md-sys-typescale-headline-small-font-weight, 400);line-height:max(24px, calc(32px + var(--md-sys-density-scale, 0) * 2px));letter-spacing:var(--md-sys-typescale-headline-small-letter-spacing, 0px);color:var(--_headline-color)}.md-dialog__content{padding:max(8px, calc(16px + var(--md-sys-density-scale, 0) * 2px)) max(12px, calc(24px + var(--md-sys-density-scale, 0) * 2px));flex:1;overflow-y:auto;font-family:var(--md-sys-typescale-body-medium-font-family, Roboto, sans-serif);font-size:max(12px, calc(14px + var(--md-sys-density-scale, 0) * 0.5px));font-weight:var(--md-sys-typescale-body-medium-font-weight, 400);line-height:max(16px, calc(20px + var(--md-sys-density-scale, 0) * 1px));letter-spacing:var(--md-sys-typescale-body-medium-letter-spacing, 0.25px);color:var(--_content-color)}.md-dialog__divider{block-size:1px;background-color:var(--_divider-color);margin-inline:0;flex-shrink:0}.md-dialog__actions{display:flex;align-items:center;justify-content:flex-end;gap:var(--md-sys-spacing-gap-sm, 8px);padding:var(--md-sys-spacing-inset-xl, 24px);padding-block-start:0}:host([divider]) .md-dialog__actions{padding-block-start:var(--md-sys-spacing-inset-xl, 24px)}.md-dialog__actions:empty{display:none}:host(.md-dialog--fullscreen) .md-dialog__container{border-radius:0;inset:0;inline-size:100%;block-size:100%;max-inline-size:none;max-block-size:none;top:0;left:0;box-shadow:none;transform:translateY(30px)}:host(.md-dialog--fullscreen.md-dialog--open) .md-dialog__container{transform:translateY(0)}.md-dialog__header{display:flex;align-items:center;gap:max(4px, calc(12px + var(--md-sys-density-scale, 0) * 2px));block-size:max(48px, calc(64px + var(--md-sys-density-scale, 0) * 4px));min-block-size:max(48px, calc(64px + var(--md-sys-density-scale, 0) * 4px));padding-inline:max(8px, calc(16px + var(--md-sys-density-scale, 0) * 2px));flex-shrink:0;background-color:var(--_container-color)}.md-dialog__header-headline{flex:1;font-family:var(--md-sys-typescale-title-large-font-family, Roboto, sans-serif);font-size:max(16px, calc(22px + var(--md-sys-density-scale, 0) * 1px));font-weight:var(--md-sys-typescale-title-large-font-weight, 400);line-height:max(22px, calc(28px + var(--md-sys-density-scale, 0) * 1px));letter-spacing:var(--md-sys-typescale-title-large-letter-spacing, 0px);color:var(--_headline-color);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.md-dialog__close-btn{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;inline-size:40px;block-size:40px;min-inline-size:40px;border:none;border-radius:var(--md-sys-shape-corner-full, 50%);background:none;color:var(--md-sys-color-on-surface, #1C1B1F);cursor:pointer;padding:0;position:relative;transition:background-color var(--md-sys-motion-duration-short1, 100ms) var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1))}.md-dialog__close-btn:hover{background-color:color-mix(in srgb, var(--md-sys-color-on-surface, #1C1B1F) 8%, transparent)}.md-dialog__close-btn:focus-visible{outline:3px solid var(--md-sys-color-secondary);outline-offset:-3px}.md-dialog__close-btn:active{background-color:color-mix(in srgb, var(--md-sys-color-on-surface, #1C1B1F) 12%, transparent)}.md-dialog__close-btn svg{pointer-events:none}::slotted([slot="header-action"]){margin-inline-start:auto}:host(.md-dialog--fullscreen) .md-dialog__basic-header{display:none}:host(.md-dialog--fullscreen) .md-dialog__content{padding-block-start:max(12px, calc(24px + var(--md-sys-density-scale, 0) * 2px))}:host(.md-dialog--fullscreen) .md-dialog__actions{min-block-size:max(40px, calc(56px + var(--md-sys-density-scale, 0) * 4px));padding:max(4px, calc(8px + var(--md-sys-density-scale, 0) * 1px)) max(12px, calc(24px + var(--md-sys-density-scale, 0) * 2px));border-block-start:none}@media (prefers-reduced-motion: reduce){.md-dialog__scrim,.md-dialog__container,.md-dialog__close-btn{transition:none}}@media (forced-colors: active){.md-dialog__container{border:2px solid CanvasText}.md-dialog__divider{background-color:CanvasText}.md-dialog__close-btn{color:ButtonText}.md-dialog__close-btn:focus-visible{outline-color:Highlight}}:host([density='-1']){--md-sys-density-scale:-1}:host([density='-2']){--md-sys-density-scale:-2}:host([density='-3']){--md-sys-density-scale:-3}:host([density='-4']){--md-sys-density-scale:-4}`;const f=e(class e extends i{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow();this.mdOpen=a(this,"mdOpen",7);this.mdClose=a(this,"mdClose",7);this.mdCancel=a(this,"mdCancel",7);this.open=false;this.headline="";this.icon="";this.fullscreen=false;this.scrimDismissible=true;this.locale="en-US";this.closeLabel="";this.cancelLabel="";this.okLabel="";this.divider=false;this.headerDivider=false;this.density=0;this.animating=false;this.hasSlottedIcon=false;this.hasSlottedHeadline=false;this.hasSlottedActions=false;this.headlineId=`md-dialog-headline-${Math.random().toString(36).slice(2)}`;this.contentId=`md-dialog-content-${Math.random().toString(36).slice(2)}`;this.previousFocus=null;this.handleScrimClick=()=>{if(!this.scrimDismissible)return;this.mdCancel.emit();this.open=false};this.handleCloseClick=()=>{this.mdCancel.emit();this.open=false};this.handleDefaultOkClick=()=>{this.open=false}}openChanged(e){this.animating=true;setTimeout((()=>{this.animating=false}),300);if(e){this.previousFocus=document.activeElement;document.body.style.overflow="hidden";this.mdOpen.emit();requestAnimationFrame((()=>this.focusFirst()))}else{document.body.style.overflow="";this.mdClose.emit();this.previousFocus?.focus?.({preventScroll:true});this.previousFocus=null}}connectedCallback(){if(this.open){document.body.style.overflow="hidden"}}componentWillLoad(){this.hasSlottedHeadline=this.hasDirectSlottedChild("headline");this.hasSlottedIcon=this.hasDirectSlottedChild("icon");this.hasSlottedActions=this.hasDirectSlottedChild("actions")}hasDirectSlottedChild(e){const i=this.el.children;for(let a=0;a<i.length;a+=1){if(i[a].getAttribute("slot")===e)return true}return false}componentDidLoad(){this.bindSlotListener("icon",(e=>{this.hasSlottedIcon=e}));this.bindSlotListener("headline",(e=>{this.hasSlottedHeadline=e}));this.bindSlotListener("actions",(e=>{this.hasSlottedActions=e}))}bindSlotListener(e,i){const a=this.el.shadowRoot?.querySelector(`slot[name="${e}"]`);if(!a)return;a.addEventListener("slotchange",(()=>{i(a.assignedElements().length>0)}))}disconnectedCallback(){document.body.style.overflow=""}async show(){this.open=true}async close(){this.open=false}handleKeyDown(e){if(!this.open)return;if(e.key==="Escape"){e.preventDefault();e.stopPropagation();this.mdCancel.emit();this.open=false;return}if(e.key==="Tab"){this.trapFocus(e)}}resolvedLabel(e,i){return e||m(this.locale,i)}focusFirst(){if(!this.containerEl)return;const e=this.getFocusableElements();if(e.length>0){e[0].focus()}else{this.containerEl.focus()}}trapFocus(e){const i=this.getFocusableElements();if(i.length===0)return;const a=i[0];const s=i[i.length-1];const t=u();if(e.shiftKey){if(t===a){e.preventDefault();s.focus()}}else{if(t===s){e.preventDefault();a.focus()}}}renderActions(){if(this.hasSlottedActions){return s("div",{class:"md-dialog__actions",part:"actions"},s("slot",{name:"actions"}))}return s("div",{class:"md-dialog__actions",part:"actions"},s("md-button",{variant:"text",onMdClick:this.handleCloseClick,part:"cancel-button"},this.resolvedLabel(this.cancelLabel,"cancel")),s("md-button",{variant:"filled",onMdClick:this.handleDefaultOkClick,part:"ok-button"},this.resolvedLabel(this.okLabel,"ok")))}getFocusableElements(){if(!this.containerEl)return[];const i=[];p(this.containerEl,e.FOCUSABLE_SELECTOR,i);const a=this.containerEl.querySelectorAll("slot");a.forEach((a=>{const s=a.assignedElements({flatten:true});s.forEach((a=>{if(a.matches?.(e.FOCUSABLE_SELECTOR)){i.push(a)}p(a,e.FOCUSABLE_SELECTOR,i)}))}));const s=new Set;const t=[];for(const e of i){if(t.some((i=>y(e,i))))continue;if(s.has(e))continue;s.add(e);t.push(e)}return t.filter(g)}render(){const e=!!this.icon||this.hasSlottedIcon;const i=!!this.headline||this.hasSlottedHeadline;return s(t,{key:"a7a08aa4537ec3473f7ded83e8a3bccb35db9dc5",class:{"md-dialog":true,"md-dialog--open":this.open,"md-dialog--fullscreen":this.fullscreen,"md-dialog--animating":this.animating,"md-dialog--has-icon":e}},!this.fullscreen&&s("div",{key:"38d6f78fe15cfcdf449eb442cf60f62b63399a96",class:"md-dialog__scrim",part:"scrim","aria-hidden":"true",onClick:this.handleScrimClick}),s("div",{key:"4d5306f139440eb6e8c08e607d1b37470df45c4e",class:"md-dialog__container",part:"container",role:this.fullscreen?"dialog":"alertdialog","aria-modal":"true","aria-labelledby":i?this.headlineId:undefined,"aria-describedby":this.contentId,tabindex:-1,ref:e=>this.containerEl=e},this.fullscreen&&s("div",{key:"59f56a555b1ce523f13e1d1baa01c30b146d3fd4",class:"md-dialog__header",part:"header"},s("button",{key:"ba66dacb86b0f12b093b390049a985e39b649452",class:"md-dialog__close-btn",part:"close-button","aria-label":this.resolvedLabel(this.closeLabel,"close"),onClick:this.handleCloseClick},s("svg",{key:"d6fbf39a0c9b4041a510f44929a72f178e3f6dcc",viewBox:"0 0 24 24",width:"24",height:"24",fill:"currentColor","aria-hidden":"true"},s("path",{key:"a9e24803cbf3303a4f5bdd680de9aceb5d7b471f",d:"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z"}))),i&&s("span",{key:"3b5a5914a48a5db0adf4cb0ea559a4b1af939875",id:this.headlineId,class:"md-dialog__header-headline",part:"headline"},this.headline),s("slot",{key:"41e617d81a36ea2d5a682c63605cfb093d47a7e6",name:"header-action"})),this.fullscreen&&this.headerDivider&&s("div",{key:"a859f931cc334c3dbe3e9d12c0de3f636928a4fe",class:"md-dialog__divider",part:"divider","aria-hidden":"true"}),!this.fullscreen&&s("div",{key:"4fe1f49e2dd39d1390e9781d623144dee4ccc3ca",class:"md-dialog__basic-header",part:"header"},s("slot",{key:"45e4abee072480b8d8a7cb80c1c848fc6a8cb2ec",name:"icon"},this.icon&&s("span",{key:"4a3cb1428d3876e6fafe69e9592c9a3efae2604e",class:"md-dialog__icon material-symbols-outlined",part:"icon","aria-hidden":"true"},this.icon)),i&&s("div",{key:"05f30544f1a0f2486890d747361bd30ab12a7bf2",id:this.headlineId,class:"md-dialog__headline",part:"headline"},s("slot",{key:"8ea63db23f32df2f3945a9cb8645fd28f75a34d9",name:"headline"},this.headline))),s("div",{key:"e8819873ed88143416717feb133d02896dd10fbc",id:this.contentId,class:"md-dialog__content",part:"content"},s("slot",{key:"26478e466c5fb1162a4a4feb13ca86224c35506a"})),this.divider&&s("div",{key:"580b77e97e64d98c16e130253f5e60b4d1922b2f",class:"md-dialog__divider",part:"divider","aria-hidden":"true"}),this.renderActions()))}get el(){return this}static get watchers(){return{open:[{openChanged:0}]}}static get style(){return h()}},[257,"md-dialog",{open:[1540],headline:[1],icon:[1],fullscreen:[516],scrimDismissible:[4,"scrim-dismissible"],locale:[1],closeLabel:[1,"close-label"],cancelLabel:[1,"cancel-label"],okLabel:[1,"ok-label"],divider:[516],headerDivider:[516,"header-divider"],density:[514],animating:[32],hasSlottedIcon:[32],hasSlottedHeadline:[32],hasSlottedActions:[32],show:[64],close:[64]},[[0,"keydown","handleKeyDown"]],{open:[{openChanged:0}]}]);f.FOCUSABLE_SELECTOR="a[href], button:not([disabled]), "+'input:not([disabled]):not([type="hidden"]), '+"select:not([disabled]), textarea:not([disabled]), "+"audio[controls], video[controls], summary, "+'[tabindex]:not([tabindex="-1"])';function p(e,i,a){const s=e.querySelectorAll(i);s.forEach((e=>a.push(e)));const t=e.querySelectorAll("*");t.forEach((e=>{const s=e.shadowRoot;if(s)p(s,i,a)}))}function u(){let e=document.activeElement;while(e){const i=e.shadowRoot;if(!i||!i.activeElement)break;e=i.activeElement}return e}function y(e,i){if(!i.shadowRoot){return false}let a=e;while(a){const e=a.getRootNode?.();if(e&&e.host===i)return true;if(e&&e.host){a=e.host}else{a=a.parentNode}}return false}function g(e){if(!e.isConnected)return false;const i=e.getBoundingClientRect();if(i.width>0&&i.height>0)return true;return e.offsetWidth>0||e.offsetHeight>0||e.getClientRects().length>0}function b(){if(typeof customElements==="undefined"){return}const e=["md-dialog","md-button","md-ripple"];e.forEach((e=>{switch(e){case"md-dialog":if(!customElements.get(o(e))){customElements.define(o(e),f)}break;case"md-button":if(!customElements.get(o(e))){n()}break;case"md-ripple":if(!customElements.get(o(e))){l()}break}}))}b();const x=f;const v=b;export{x as MdDialog,v as defineCustomElement};
+//# sourceMappingURL=md-dialog.js.map

package/dist/components-csr/md-dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["EN_LABELS","close","cancel","ok","TRANSLATIONS","ar","de","es","fr","hi","it","ja","ko","nl","pl","pt","ro","ru","zh","languageCode","locale","tag","trim","Intl","Locale","language","split","toLowerCase","resolveDialogLabel","key","lang","mdDialogCss","MdDialog","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","open","headline","icon","fullscreen","scrimDismissible","closeLabel","cancelLabel","okLabel","divider","headerDivider","density","animating","hasSlottedIcon","hasSlottedHeadline","hasSlottedActions","headlineId","Math","random","toString","slice","contentId","previousFocus","handleScrimClick","mdCancel","emit","handleCloseClick","handleDefaultOkClick","openChanged","newVal","setTimeout","document","activeElement","body","style","overflow","mdOpen","requestAnimationFrame","focusFirst","mdClose","focus","preventScroll","connectedCallback","componentWillLoad","hasDirectSlottedChild","slotName","children","el","i","length","getAttribute","componentDidLoad","bindSlotListener","v","name","setter","slot","shadowRoot","querySelector","addEventListener","assignedElements","disconnectedCallback","show","handleKeyDown","e","preventDefault","stopPropagation","trapFocus","resolvedLabel","explicit","containerEl","focusable","getFocusableElements","first","last","deep","getDeepActiveElement","shiftKey","renderActions","h","class","part","variant","onMdClick","collected","collectTabbablesDeep","FOCUSABLE_SELECTOR","slots","querySelectorAll","forEach","assigned","flatten","matches","push","seen","Set","deduped","some","isShadowDescendant","has","add","filter","isVisible","render","hasIcon","hasHeadline","Host","onClick","role","undefined","tabindex","ref","viewBox","width","height","fill","d","id","root","selector","out","direct","everything","sr","active","node","host","cursor","getRootNode","parentNode","isConnected","rect","getBoundingClientRect","offsetWidth","offsetHeight","getClientRects"],"sources":["src/components/md-dialog/dialog-utils.ts","src/components/md-dialog/md-dialog.css?tag=md-dialog&encapsulation=shadow","src/components/md-dialog/md-dialog.tsx"],"sourcesContent":["/**\n * Locale-aware dialog chrome strings used by md-dialog.\n *\n * Co-located with the component but exported separately so we can\n * unit-test label resolution without booting a Stencil page.\n */\n\nexport type DialogLabelKey = 'close' | 'cancel' | 'ok';\n\nconst EN_LABELS: Record<DialogLabelKey, string> = {\n  close: 'Close',\n  cancel: 'Cancel',\n  ok: 'OK',\n};\n\n/** Language-code → localized labels (falls back to English). */\nconst TRANSLATIONS: Record<string, Partial<Record<DialogLabelKey, string>>> = {\n  ar: { close: 'إغلاق', cancel: 'إلغاء', ok: 'موافق' },\n  de: { close: 'Schließen', cancel: 'Abbrechen', ok: 'OK' },\n  es: { close: 'Cerrar', cancel: 'Cancelar', ok: 'Aceptar' },\n  fr: { close: 'Fermer', cancel: 'Annuler', ok: 'OK' },\n  hi: { close: 'बंद करें', cancel: 'रद्द करें', ok: 'ठीक' },\n  it: { close: 'Chiudi', cancel: 'Annulla', ok: 'OK' },\n  ja: { close: '閉じる', cancel: 'キャンセル', ok: 'OK' },\n  ko: { close: '닫기', cancel: '취소', ok: '확인' },\n  nl: { close: 'Sluiten', cancel: 'Annuleren', ok: 'OK' },\n  pl: { close: 'Zamknij', cancel: 'Anuluj', ok: 'OK' },\n  pt: { close: 'Fechar', cancel: 'Cancelar', ok: 'OK' },\n  ro: { close: 'Închide', cancel: 'Anulează', ok: 'OK' },\n  ru: { close: 'Закрыть', cancel: 'Отмена', ok: 'ОК' },\n  zh: { close: '关闭', cancel: '取消', ok: '确定' },\n};\n\n/** Extract the primary language subtag from a BCP-47 locale tag. */\nfunction languageCode(locale: string): string {\n  const tag = locale.trim();\n  if (!tag) return 'en';\n  try {\n    return new Intl.Locale(tag).language;\n  } catch {\n    return tag.split('-')[0].toLowerCase();\n  }\n}\n\n/**\n * Resolve a built-in dialog label for the given locale.\n * Unknown locales fall back to English.\n */\nexport function resolveDialogLabel(\n  locale: string | undefined,\n  key: DialogLabelKey,\n): string {\n  const lang = languageCode(locale || 'en-US');\n  return TRANSLATIONS[lang]?.[key] ?? EN_LABELS[key];\n}\n\n/** All built-in labels for a locale (useful for docs and tests). */\nexport function resolveDialogLabels(\n  locale: string | undefined,\n): Record<DialogLabelKey, string> {\n  return {\n    close: resolveDialogLabel(locale, 'close'),\n    cancel: resolveDialogLabel(locale, 'cancel'),\n    ok: resolveDialogLabel(locale, 'ok'),\n  };\n}\n","/* ==========================================================\n   md-dialog — Material Design 3 Dialog\n   Spec: https://m3.material.io/components/dialogs/specs\n\n   PUBLIC CSS CUSTOM PROPERTIES (override per-instance):\n     --md-dialog-container-color         Container background\n     --md-dialog-container-shape         Container corner radius\n     --md-dialog-headline-color          Headline text color\n     --md-dialog-content-color           Supporting text color\n     --md-dialog-icon-color              Icon color\n     --md-dialog-icon-size               Icon dimensions\n     --md-dialog-scrim-color             Scrim overlay color\n     --md-dialog-divider-color           Divider color\n     --md-dialog-z-index                 Surface z-index (default near int32 max)\n     --md-dialog-scrim-z-index           Scrim z-index (one below the surface)\n\n   CSS PARTS:\n     scrim          Scrim overlay (basic only)\n     container      Dialog surface\n     header         Header area (both variants)\n     icon           Icon element (basic)\n     headline       Headline text\n     content        Supporting text / body\n     divider        Horizontal divider\n     actions        Action buttons row\n     cancel-button  Default cancel button (slot fallback)\n     ok-button      Default confirm button (slot fallback)\n     close-button   Close button (full-screen)\n\n   SLOTS:\n     (default)      Supporting text / body content\n     icon           Custom icon (replaces icon prop)\n     headline       Custom headline content\n     actions        Action buttons\n     header-action  Full-screen header action (e.g. Save button)\n   ========================================================== */\n\n:host {\n  --_container-color: var(--md-dialog-container-color, var(--md-sys-color-surface-container-high, #ECE6F0));\n  --_container-shape: var(--md-dialog-container-shape, max(16px, calc(28px + var(--md-sys-density-scale, 0) * 2px)));\n  --_headline-color: var(--md-dialog-headline-color, var(--md-sys-color-on-surface, #1C1B1F));\n  --_content-color: var(--md-dialog-content-color, var(--md-sys-color-on-surface-variant, #49454F));\n  --_icon-color: var(--md-dialog-icon-color, var(--md-sys-color-secondary, #625B71));\n  --_icon-size: var(--md-dialog-icon-size, 24px);\n  --_scrim-color: var(--md-dialog-scrim-color, rgba(0, 0, 0, 0.32));\n  --_divider-color: var(--md-dialog-divider-color, var(--md-sys-color-outline-variant, #CAC4D0));\n\n  display: contents;\n}\n\n/* ==========================================================\n   SCRIM — fixed backdrop (basic dialogs only)\n   ========================================================== */\n\n.md-dialog__scrim {\n  position: fixed;\n  inset: 0;\n  background-color: var(--_scrim-color);\n  /* Modal dialogs must paint above any host-app chrome (sticky site\n     headers, sidebars, fixed CTAs, AI chat widgets, etc.). The design\n     token's 1000 is fine for in-app components but loses to host\n     environments that use higher values (some marketing sites push\n     toolbars to 9999). We pick a value that wins anywhere short of\n     int32 max, leaving headroom (1) for the dialog container above. */\n  z-index: var(--md-dialog-scrim-z-index, 2147483646);\n  opacity: 0;\n  pointer-events: none;\n  transition: opacity var(--md-sys-motion-duration-medium2, 300ms) var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1));\n}\n\n:host(.md-dialog--open) .md-dialog__scrim {\n  opacity: 1;\n  pointer-events: auto;\n}\n\n/* ==========================================================\n   CONTAINER — dialog surface\n   Min 280px, max 560px, centered, 28px radius (basic)\n   ========================================================== */\n\n.md-dialog__container {\n  position: fixed;\n  /* Physical properties for viewport centering — must not flip in RTL */\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, calc(-50% + 20px));\n  /* Sits exactly one stacking step above the scrim (see scrim rule\n     for the rationale on the high baseline). Override either via\n     `--md-dialog-z-index` for the surface or `--md-dialog-scrim-z-index`\n     for the backdrop on a per-instance basis. */\n  z-index: var(--md-dialog-z-index, 2147483647);\n  background-color: var(--_container-color);\n  border-radius: var(--_container-shape);\n  box-shadow: var(--md-sys-elevation-3);\n  min-inline-size: 280px;\n  max-inline-size: 560px;\n  inline-size: calc(100% - 48px);\n  max-block-size: calc(100vh - 96px);\n  display: flex;\n  flex-direction: column;\n  opacity: 0;\n  pointer-events: none;\n  outline: none;\n  overflow: hidden;\n  transition:\n    opacity var(--md-sys-motion-duration-medium2, 300ms) var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1)),\n    transform var(--md-sys-motion-duration-medium2, 300ms) var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1));\n}\n\n:host(.md-dialog--open) .md-dialog__container {\n  opacity: 1;\n  pointer-events: auto;\n  transform: translate(-50%, -50%);\n}\n\n/* ==========================================================\n   BASIC HEADER — icon (optional, centered) + headline\n   ========================================================== */\n\n.md-dialog__basic-header {\n  display: flex;\n  flex-direction: column;\n  padding: max(12px, calc(24px + var(--md-sys-density-scale, 0) * 2px)) max(12px, calc(24px + var(--md-sys-density-scale, 0) * 2px)) 0;\n  gap: max(8px, calc(16px + var(--md-sys-density-scale, 0) * 2px));\n}\n\n/* With icon: center-aligned */\n:host(.md-dialog--has-icon) .md-dialog__basic-header {\n  align-items: center;\n  text-align: center;\n}\n\n/* Without icon: start-aligned */\n:host(:not(.md-dialog--has-icon)) .md-dialog__basic-header {\n  align-items: flex-start;\n  text-align: start;\n}\n\n/* Icon (Material Symbols shorthand) */\n.md-dialog__icon {\n  font-family: var(--md-sys-icon-font-family, 'Material Symbols Outlined', 'Material Icons');\n  font-size: var(--_icon-size);\n  inline-size: var(--_icon-size);\n  block-size: var(--_icon-size);\n  color: var(--_icon-color);\n  line-height: 1;\n  font-weight: normal;\n  font-style: normal;\n  letter-spacing: normal;\n  text-transform: none;\n  white-space: nowrap;\n  overflow-wrap: normal;\n  direction: ltr;\n  -webkit-font-smoothing: antialiased;\n}\n\n/* Slotted custom icon */\n::slotted([slot=\"icon\"]) {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  inline-size: var(--_icon-size);\n  block-size: var(--_icon-size);\n  font-size: var(--_icon-size);\n  color: var(--_icon-color);\n  fill: currentColor;\n}\n\n/* Headline */\n.md-dialog__headline {\n  font-family: var(--md-sys-typescale-headline-small-font-family, Roboto, sans-serif);\n  font-size: max(18px, calc(24px + var(--md-sys-density-scale, 0) * 1px));\n  font-weight: var(--md-sys-typescale-headline-small-font-weight, 400);\n  line-height: max(24px, calc(32px + var(--md-sys-density-scale, 0) * 2px));\n  letter-spacing: var(--md-sys-typescale-headline-small-letter-spacing, 0px);\n  color: var(--_headline-color);\n}\n\n/* ==========================================================\n   CONTENT — supporting text / body\n   Padding: 16px between headline and body, 24px sides\n   ========================================================== */\n\n.md-dialog__content {\n  padding: max(8px, calc(16px + var(--md-sys-density-scale, 0) * 2px)) max(12px, calc(24px + var(--md-sys-density-scale, 0) * 2px));\n  flex: 1;\n  overflow-y: auto;\n  font-family: var(--md-sys-typescale-body-medium-font-family, Roboto, sans-serif);\n  font-size: max(12px, calc(14px + var(--md-sys-density-scale, 0) * 0.5px));\n  font-weight: var(--md-sys-typescale-body-medium-font-weight, 400);\n  line-height: max(16px, calc(20px + var(--md-sys-density-scale, 0) * 1px));\n  letter-spacing: var(--md-sys-typescale-body-medium-letter-spacing, 0.25px);\n  color: var(--_content-color);\n}\n\n/* ==========================================================\n   DIVIDER — 1px between content and actions\n   ========================================================== */\n\n.md-dialog__divider {\n  block-size: 1px;\n  background-color: var(--_divider-color);\n  margin-inline: 0;\n  flex-shrink: 0;\n}\n\n/* ==========================================================\n   ACTIONS — button row\n   Padding: 24px from body, 24px bottom, 8px gap\n   ========================================================== */\n\n/* Actions row.\n   The 0 top-padding is intentional: without a divider the body's\n   16px bottom padding already gives the buttons breathing room, and\n   keeping the top inset visually shorter pulls the actions tight\n   against the body the way M3 specs them. The moment a divider is\n   inserted (see `:host([divider])` rule below) we MUST restore the\n   24px top padding — otherwise the buttons end up pinned to the\n   divider line while the 24px bottom padding stays, producing the\n   asymmetric \"buttons crowded at the top\" look. */\n.md-dialog__actions {\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  gap: var(--md-sys-spacing-gap-sm, 8px);\n  padding: var(--md-sys-spacing-inset-xl, 24px);\n  padding-block-start: 0;\n}\n\n:host([divider]) .md-dialog__actions {\n  padding-block-start: var(--md-sys-spacing-inset-xl, 24px);\n}\n\n/* Hide actions row when empty */\n.md-dialog__actions:empty {\n  display: none;\n}\n\n/* ==========================================================\n   FULL-SCREEN VARIANT\n   0px radius, 100% w/h, max-width 560px, 56px header\n   ========================================================== */\n\n/* Full-screen dialogs occupy the entire viewport on every breakpoint\n   (per MD3 spec: \"full-screen dialogs provide a focused experience\n   without distractions\"). We pin to all four edges instead of the\n   centered-with-translate trick used by basic dialogs so the surface\n   reaches the viewport edges regardless of containing-block context.\n   `inset: 0` covers all four physical edges and is RTL-safe (it does\n   not flip). The translateY entry/exit animation is preserved via\n   `transform` only. */\n:host(.md-dialog--fullscreen) .md-dialog__container {\n  border-radius: 0;\n  inset: 0;\n  inline-size: 100%;\n  block-size: 100%;\n  max-inline-size: none;\n  max-block-size: none;\n  /* Reset basic-dialog centering — fullscreen does not center. */\n  top: 0;\n  left: 0;\n  box-shadow: none;\n  transform: translateY(30px);\n}\n\n:host(.md-dialog--fullscreen.md-dialog--open) .md-dialog__container {\n  transform: translateY(0);\n}\n\n/* Full-screen header — 64px (matches top app-bar), row layout.\n   Padding is symmetric (16px both ends) so the close icon's hit\n   area sits an equal optical distance from the leading edge as the\n   trailing action sits from the trailing edge. The 12px gap gives\n   the headline enough air against the close button's 48px hit area\n   without leaving the trailing action floating away from it. */\n.md-dialog__header {\n  display: flex;\n  align-items: center;\n  gap: max(4px, calc(12px + var(--md-sys-density-scale, 0) * 2px));\n  block-size: max(48px, calc(64px + var(--md-sys-density-scale, 0) * 4px));\n  min-block-size: max(48px, calc(64px + var(--md-sys-density-scale, 0) * 4px));\n  padding-inline: max(8px, calc(16px + var(--md-sys-density-scale, 0) * 2px));\n  flex-shrink: 0;\n  background-color: var(--_container-color);\n}\n\n.md-dialog__header-headline {\n  flex: 1;\n  font-family: var(--md-sys-typescale-title-large-font-family, Roboto, sans-serif);\n  font-size: max(16px, calc(22px + var(--md-sys-density-scale, 0) * 1px));\n  font-weight: var(--md-sys-typescale-title-large-font-weight, 400);\n  line-height: max(22px, calc(28px + var(--md-sys-density-scale, 0) * 1px));\n  letter-spacing: var(--md-sys-typescale-title-large-letter-spacing, 0px);\n  color: var(--_headline-color);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n\n/* Close button — 40px icon-button hit area sits comfortably inside\n   the 64px fullscreen header without dwarfing the trailing filled\n   action. The 24px svg child stays centered via inline-flex. */\n.md-dialog__close-btn {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  flex: 0 0 auto;\n  inline-size: 40px;\n  block-size: 40px;\n  min-inline-size: 40px;\n  border: none;\n  border-radius: var(--md-sys-shape-corner-full, 50%);\n  background: none;\n  color: var(--md-sys-color-on-surface, #1C1B1F);\n  cursor: pointer;\n  padding: 0;\n  position: relative;\n  transition: background-color var(--md-sys-motion-duration-short1, 100ms) var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1));\n}\n\n.md-dialog__close-btn:hover {\n  background-color: color-mix(in srgb, var(--md-sys-color-on-surface, #1C1B1F) 8%, transparent);\n}\n\n.md-dialog__close-btn:focus-visible {\n  outline: 3px solid var(--md-sys-color-secondary);\n  outline-offset: -3px;\n}\n\n.md-dialog__close-btn:active {\n  background-color: color-mix(in srgb, var(--md-sys-color-on-surface, #1C1B1F) 12%, transparent);\n}\n\n.md-dialog__close-btn svg {\n  pointer-events: none;\n}\n\n/* Full-screen: header-action slot (e.g. Save text button) */\n::slotted([slot=\"header-action\"]) {\n  margin-inline-start: auto;\n}\n\n/* Full-screen: hide basic header, show full-screen header */\n:host(.md-dialog--fullscreen) .md-dialog__basic-header {\n  display: none;\n}\n\n/* Full-screen: content takes remaining space with top padding */\n:host(.md-dialog--fullscreen) .md-dialog__content {\n  padding-block-start: max(12px, calc(24px + var(--md-sys-density-scale, 0) * 2px));\n}\n\n/* Full-screen: actions at bottom (bar-style) */\n:host(.md-dialog--fullscreen) .md-dialog__actions {\n  min-block-size: max(40px, calc(56px + var(--md-sys-density-scale, 0) * 4px));\n  padding: max(4px, calc(8px + var(--md-sys-density-scale, 0) * 1px)) max(12px, calc(24px + var(--md-sys-density-scale, 0) * 2px));\n  border-block-start: none;\n}\n\n/* ==========================================================\n   REDUCED MOTION\n   ========================================================== */\n\n@media (prefers-reduced-motion: reduce) {\n  .md-dialog__scrim,\n  .md-dialog__container,\n  .md-dialog__close-btn {\n    transition: none;\n  }\n}\n\n/* ==========================================================\n   FORCED COLORS (High Contrast)\n   ========================================================== */\n\n@media (forced-colors: active) {\n  .md-dialog__container {\n    border: 2px solid CanvasText;\n  }\n\n  .md-dialog__divider {\n    background-color: CanvasText;\n  }\n\n  .md-dialog__close-btn {\n    color: ButtonText;\n  }\n\n  .md-dialog__close-btn:focus-visible {\n    outline-color: Highlight;\n  }\n}\n\n/* ==========================================================\n   DENSITY (local override)\n   Maps the local `density` prop onto the same --md-sys-density-scale signal a\n   global `data-density` ancestor sets. Declared on :host, so a local rung wins\n   over the inherited global one. Every density-sensitive value in this file\n   derives from that single signal by calc — never add a fixed per-rung ladder.\n   ========================================================== */\n:host([density='-1']) { --md-sys-density-scale: -1; }\n:host([density='-2']) { --md-sys-density-scale: -2; }\n:host([density='-3']) { --md-sys-density-scale: -3; }\n:host([density='-4']) { --md-sys-density-scale: -4; }\n","import { Component, Host, h, Prop, Event, EventEmitter, Method, Watch, State, Element, Listen } from '@stencil/core';\nimport { resolveDialogLabel } from './dialog-utils';\n\n@Component({\n  tag: 'md-dialog',\n  styleUrl: 'md-dialog.css',\n  shadow: true,\n})\nexport class MdDialog {\n  @Element() el!: HTMLElement;\n\n  /** Whether the dialog is open */\n  @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n  /** Headline text (or use the headline slot) */\n  @Prop() headline: string = '';\n\n  /** Icon name (Material Symbols shorthand, or use the icon slot) */\n  @Prop() icon: string = '';\n\n  /** Full-screen variant */\n  @Prop({ reflect: true }) fullscreen: boolean = false;\n\n  /** Whether clicking the scrim closes the dialog */\n  @Prop({ attribute: 'scrim-dismissible' }) scrimDismissible: boolean = true;\n\n  /** BCP-47 locale for built-in button labels (Close, Cancel, OK). */\n  @Prop() locale: string = 'en-US';\n\n  /**\n   * Accessible label for the full-screen close button.\n   * Leave empty to derive from `locale`.\n   */\n  @Prop({ attribute: 'close-label' }) closeLabel: string = '';\n\n  /**\n   * Label for the default cancel action button (slot fallback).\n   * Leave empty to derive from `locale`.\n   */\n  @Prop({ attribute: 'cancel-label' }) cancelLabel: string = '';\n\n  /**\n   * Label for the default confirm action button (slot fallback).\n   * Leave empty to derive from `locale`.\n   */\n  @Prop({ attribute: 'ok-label' }) okLabel: string = '';\n\n  /** Show divider between content and actions */\n  @Prop({ reflect: true }) divider: boolean = false;\n\n  /** Show divider between header and content (full-screen) */\n  @Prop({ attribute: 'header-divider', reflect: true }) headerDivider: boolean = false;\n\n  /**\n   * Local density rung. Drives the same `--md-sys-density-scale` signal that a\n   * global `data-density` ancestor sets, so a local value simply overrides the\n   * inherited one. 0 = default, -4 = ultra-compact.\n   */\n  @Prop({ reflect: true }) density: 0 | -1 | -2 | -3 | -4 = 0;\n\n  /** Emits when the dialog opens */\n  @Event() mdOpen: EventEmitter<void>;\n\n  /** Emits when the dialog closes */\n  @Event() mdClose: EventEmitter<void>;\n\n  /** Emits when dismissed via scrim or Escape */\n  @Event() mdCancel: EventEmitter<void>;\n\n  @State() private animating: boolean = false;\n  @State() private hasSlottedIcon = false;\n  @State() private hasSlottedHeadline = false;\n  @State() private hasSlottedActions = false;\n\n  private headlineId = `md-dialog-headline-${Math.random().toString(36).slice(2)}`;\n  private contentId = `md-dialog-content-${Math.random().toString(36).slice(2)}`;\n  private containerEl!: HTMLElement;\n  private previousFocus: HTMLElement | null = null;\n\n  @Watch('open')\n  openChanged(newVal: boolean) {\n    this.animating = true;\n    setTimeout(() => { this.animating = false; }, 300);\n\n    if (newVal) {\n      this.previousFocus = document.activeElement as HTMLElement;\n      document.body.style.overflow = 'hidden';\n      this.mdOpen.emit();\n      requestAnimationFrame(() => this.focusFirst());\n    } else {\n      document.body.style.overflow = '';\n      this.mdClose.emit();\n      // `preventScroll` because a bare focus() scrolls its target into view: an\n      // overlay opened programmatically (or whose opener has since scrolled out\n      // of sight) would yank the page on close.\n      this.previousFocus?.focus?.({ preventScroll: true });\n      this.previousFocus = null;\n    }\n  }\n\n  connectedCallback() {\n    if (this.open) {\n      document.body.style.overflow = 'hidden';\n    }\n  }\n\n  componentWillLoad() {\n    // Seed slot-presence flags from the LIGHT-DOM children that are\n    // already in place on first render. The headline / icon slots\n    // are rendered *conditionally* — the surrounding wrapper only\n    // mounts when \"we have a headline\". If the user passes ONLY\n    // slotted content (no `headline` / `icon` prop), the first\n    // render has no slot in shadow DOM yet, so `slotchange` (wired\n    // in componentDidLoad) can never fire and we'd be stuck rendering\n    // nothing — exactly the \"custom headline slot doesn't show\" bug.\n    //\n    // We walk direct children explicitly (rather than running a\n    // `:scope > [slot=\"…\"]` query) because Stencil's mock-doc\n    // doesn't yet implement the `:scope` pseudo-class. Children-\n    // walking is also fractionally cheaper for the small N of\n    // direct dialog children.\n    this.hasSlottedHeadline = this.hasDirectSlottedChild('headline');\n    this.hasSlottedIcon = this.hasDirectSlottedChild('icon');\n    this.hasSlottedActions = this.hasDirectSlottedChild('actions');\n  }\n\n  private hasDirectSlottedChild(slotName: string): boolean {\n    const children = this.el.children;\n    for (let i = 0; i < children.length; i += 1) {\n      if (children[i].getAttribute('slot') === slotName) return true;\n    }\n    return false;\n  }\n\n  componentDidLoad() {\n    // Once the slot wrappers exist (because the seed above made them\n    // render), register `slotchange` listeners so dynamic add/remove\n    // of slotted children at runtime keeps the host state in sync.\n    this.bindSlotListener('icon', (v) => { this.hasSlottedIcon = v; });\n    this.bindSlotListener('headline', (v) => {\n      this.hasSlottedHeadline = v;\n    });\n    this.bindSlotListener('actions', (v) => {\n      this.hasSlottedActions = v;\n    });\n  }\n\n  private bindSlotListener(\n    name: string,\n    setter: (hasContent: boolean) => void,\n  ): void {\n    const slot = this.el.shadowRoot?.querySelector(\n      `slot[name=\"${name}\"]`,\n    ) as HTMLSlotElement | null;\n    if (!slot) return;\n    slot.addEventListener('slotchange', () => {\n      setter(slot.assignedElements().length > 0);\n    });\n  }\n\n  disconnectedCallback() {\n    document.body.style.overflow = '';\n  }\n\n  /** Open the dialog */\n  @Method()\n  async show() {\n    this.open = true;\n  }\n\n  /** Close the dialog */\n  @Method()\n  async close() {\n    this.open = false;\n  }\n\n  @Listen('keydown')\n  handleKeyDown(e: KeyboardEvent) {\n    if (!this.open) return;\n\n    if (e.key === 'Escape') {\n      e.preventDefault();\n      e.stopPropagation();\n      this.mdCancel.emit();\n      this.open = false;\n      return;\n    }\n\n    if (e.key === 'Tab') {\n      this.trapFocus(e);\n    }\n  }\n\n  private handleScrimClick = () => {\n    if (!this.scrimDismissible) return;\n    this.mdCancel.emit();\n    this.open = false;\n  };\n\n  private handleCloseClick = () => {\n    this.mdCancel.emit();\n    this.open = false;\n  };\n\n  private handleDefaultOkClick = () => {\n    this.open = false;\n  };\n\n  private resolvedLabel(\n    explicit: string,\n    key: 'close' | 'cancel' | 'ok',\n  ): string {\n    return explicit || resolveDialogLabel(this.locale, key);\n  }\n\n  private focusFirst() {\n    if (!this.containerEl) return;\n    const focusable = this.getFocusableElements();\n    if (focusable.length > 0) {\n      focusable[0].focus();\n    } else {\n      this.containerEl.focus();\n    }\n  }\n\n  private trapFocus(e: KeyboardEvent) {\n    const focusable = this.getFocusableElements();\n    if (focusable.length === 0) return;\n\n    const first = focusable[0];\n    const last = focusable[focusable.length - 1];\n\n    // The naïve `document.activeElement === first` check breaks the\n    // moment a slotted custom element (md-text-field, md-radio, …) owns\n    // focus: focus retargets to the host at every shadow boundary, so\n    // `document.activeElement` reports the host while `focusable[]`\n    // contains the inner <input>. `getDeepActiveElement()` walks down\n    // every open `shadowRoot.activeElement` link until it bottoms out\n    // on the actual focused leaf, which is what `focusable[]` stores.\n    const deep = getDeepActiveElement();\n\n    if (e.shiftKey) {\n      if (deep === first) {\n        e.preventDefault();\n        last.focus();\n      }\n    } else {\n      if (deep === last) {\n        e.preventDefault();\n        first.focus();\n      }\n    }\n  }\n\n  // Tabbable selector intentionally excludes hidden inputs / radios\n  // managed by a roving tabindex (-1) — those should never count as\n  // a stop in the dialog's tab order.\n  private static FOCUSABLE_SELECTOR =\n    'a[href], button:not([disabled]), ' +\n    'input:not([disabled]):not([type=\"hidden\"]), ' +\n    'select:not([disabled]), textarea:not([disabled]), ' +\n    'audio[controls], video[controls], summary, ' +\n    '[tabindex]:not([tabindex=\"-1\"])';\n\n  private renderActions() {\n    if (this.hasSlottedActions) {\n      return (\n        <div class=\"md-dialog__actions\" part=\"actions\">\n          <slot name=\"actions\" />\n        </div>\n      );\n    }\n\n    return (\n      <div class=\"md-dialog__actions\" part=\"actions\">\n        <md-button\n          variant=\"text\"\n          onMdClick={this.handleCloseClick}\n          part=\"cancel-button\"\n        >\n          {this.resolvedLabel(this.cancelLabel, 'cancel')}\n        </md-button>\n        <md-button\n          variant=\"filled\"\n          onMdClick={this.handleDefaultOkClick}\n          part=\"ok-button\"\n        >\n          {this.resolvedLabel(this.okLabel, 'ok')}\n        </md-button>\n      </div>\n    );\n  }\n\n  private getFocusableElements(): HTMLElement[] {\n    if (!this.containerEl) return [];\n\n    const collected: HTMLElement[] = [];\n\n    // 1. Built-in chrome inside md-dialog's own shadow root (the\n    //    fullscreen close button lives here).\n    collectTabbablesDeep(\n      this.containerEl,\n      MdDialog.FOCUSABLE_SELECTOR,\n      collected,\n    );\n\n    // 2. Slotted light-DOM content. For each assigned element we (a)\n    //    consider the host itself if it advertises a real tabindex\n    //    (md-button, md-radio, …) AND (b) descend into ITS shadow\n    //    root + light-DOM children. The shadow descent is what\n    //    surfaces the inner <input> of an <md-text-field>, the\n    //    inner <button> of a custom icon-button wrapper, etc.\n    const slots = this.containerEl.querySelectorAll('slot');\n    slots.forEach((slot) => {\n      const assigned = (slot as HTMLSlotElement).assignedElements({\n        flatten: true,\n      });\n      assigned.forEach((el) => {\n        if ((el as HTMLElement).matches?.(MdDialog.FOCUSABLE_SELECTOR)) {\n          collected.push(el as HTMLElement);\n        }\n        collectTabbablesDeep(el as Element, MdDialog.FOCUSABLE_SELECTOR, collected);\n      });\n    });\n\n    // De-dupe: a host that exposes its own focusable inner element\n    // (e.g. an md-button host with tabindex=0 AND an internal button\n    // in its shadow root) would otherwise contribute two stops for\n    // the same visual control. Keep the FIRST occurrence — that's the\n    // host the user/screen reader sees.\n    const seen = new Set<HTMLElement>();\n    const deduped: HTMLElement[] = [];\n    for (const el of collected) {\n      // For host-with-shadow custom elements, prefer the host: drop\n      // any later focusable that is a shadow-descendant of an already-\n      // added host.\n      if (deduped.some((h) => isShadowDescendant(el, h))) continue;\n      if (seen.has(el)) continue;\n      seen.add(el);\n      deduped.push(el);\n    }\n\n    return deduped.filter(isVisible);\n  }\n\n  render() {\n    const hasIcon = !!this.icon || this.hasSlottedIcon;\n    // `headline` prop OR slotted `[slot=\"headline\"]` child counts as\n    // \"has a headline\". Without the slot fork the entire headline\n    // wrapper (and the slot inside it) was suppressed when only\n    // slotted content was provided, which made the slot effectively\n    // unreachable.\n    const hasHeadline = !!this.headline || this.hasSlottedHeadline;\n\n    return (\n      <Host\n        class={{\n          'md-dialog': true,\n          'md-dialog--open': this.open,\n          'md-dialog--fullscreen': this.fullscreen,\n          'md-dialog--animating': this.animating,\n          'md-dialog--has-icon': hasIcon,\n        }}\n      >\n        {/* Scrim */}\n        {!this.fullscreen && (\n          <div\n            class=\"md-dialog__scrim\"\n            part=\"scrim\"\n            aria-hidden=\"true\"\n            onClick={this.handleScrimClick}\n          ></div>\n        )}\n\n        {/* Container */}\n        <div\n          class=\"md-dialog__container\"\n          part=\"container\"\n          role={this.fullscreen ? 'dialog' : 'alertdialog'}\n          aria-modal=\"true\"\n          aria-labelledby={hasHeadline ? this.headlineId : undefined}\n          aria-describedby={this.contentId}\n          tabindex={-1}\n          ref={(el) => (this.containerEl = el!)}\n        >\n          {/* Full-screen header */}\n          {this.fullscreen && (\n            <div class=\"md-dialog__header\" part=\"header\">\n              <button\n                class=\"md-dialog__close-btn\"\n                part=\"close-button\"\n                aria-label={this.resolvedLabel(this.closeLabel, 'close')}\n                onClick={this.handleCloseClick}\n              >\n                <svg viewBox=\"0 0 24 24\" width=\"24\" height=\"24\" fill=\"currentColor\" aria-hidden=\"true\">\n                  <path d=\"M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z\"/>\n                </svg>\n              </button>\n              {hasHeadline && (\n                <span id={this.headlineId} class=\"md-dialog__header-headline\" part=\"headline\">\n                  {this.headline}\n                </span>\n              )}\n              <slot name=\"header-action\"></slot>\n            </div>\n          )}\n\n          {this.fullscreen && this.headerDivider && (\n            <div class=\"md-dialog__divider\" part=\"divider\" aria-hidden=\"true\"></div>\n          )}\n\n          {/* Basic header: icon + headline */}\n          {!this.fullscreen && (\n            <div class=\"md-dialog__basic-header\" part=\"header\">\n              {/* Icon */}\n              <slot name=\"icon\">\n                {this.icon && (\n                  <span class=\"md-dialog__icon material-symbols-outlined\" part=\"icon\" aria-hidden=\"true\">\n                    {this.icon}\n                  </span>\n                )}\n              </slot>\n\n              {/* Headline */}\n              {hasHeadline && (\n                <div\n                  id={this.headlineId}\n                  class=\"md-dialog__headline\"\n                  part=\"headline\"\n                >\n                  <slot name=\"headline\">{this.headline}</slot>\n                </div>\n              )}\n            </div>\n          )}\n\n          {/* Content */}\n          <div id={this.contentId} class=\"md-dialog__content\" part=\"content\">\n            <slot></slot>\n          </div>\n\n          {/* Divider */}\n          {this.divider && (\n            <div class=\"md-dialog__divider\" part=\"divider\" aria-hidden=\"true\"></div>\n          )}\n\n          {/* Actions */}\n          {this.renderActions()}\n        </div>\n      </Host>\n    );\n  }\n}\n\n// ─── Module-private focus-trap helpers ─────────────────────────────\n//\n// Lifted out of the class so the focus-trap logic stays declarative\n// (`getFocusableElements()` reads as a pipeline, not a maze of inline\n// recursions) AND so each helper is independently unit-testable in\n// the future without instantiating a Stencil component.\n\n/** Walk into every open shadow root reachable from `root`, collecting\n *  every element matching `selector`. Light-DOM `querySelectorAll`\n *  doesn't pierce shadow boundaries on its own — this helper does the\n *  recursion explicitly. Closed shadow roots are inaccessible by spec\n *  and silently skipped (third-party closed-shadow components inside\n *  the dialog will simply not contribute focus stops). */\nfunction collectTabbablesDeep(\n  root: Element | ShadowRoot,\n  selector: string,\n  out: HTMLElement[],\n): void {\n  const direct = root.querySelectorAll<HTMLElement>(selector);\n  direct.forEach((el) => out.push(el));\n\n  // Walk every descendant looking for shadow roots. We can't use\n  // `:has(*)` or similar — we must enumerate every element to peek at\n  // `.shadowRoot`. The cost is bounded by the dialog's subtree, which\n  // is always small.\n  const everything = root.querySelectorAll<Element>('*');\n  everything.forEach((el) => {\n    const sr = (el as Element & { shadowRoot?: ShadowRoot | null }).shadowRoot;\n    if (sr) collectTabbablesDeep(sr, selector, out);\n  });\n}\n\n/** Find the actually-focused element, regardless of how many open\n *  shadow boundaries it sits behind. `document.activeElement` reports\n *  the host of the topmost open shadow root, so for an `<input>`\n *  inside `<md-text-field>` it returns `<md-text-field>` rather than\n *  the input. We chase `shadowRoot.activeElement` until it bottoms\n *  out — the leaf is what `collectTabbablesDeep()` stored in the\n *  focusable list, so a `===` comparison against it works. */\nfunction getDeepActiveElement(): Element | null {\n  let active: Element | null = document.activeElement;\n  while (active) {\n    const sr = (active as Element & { shadowRoot?: ShadowRoot | null })\n      .shadowRoot;\n    if (!sr || !sr.activeElement) break;\n    active = sr.activeElement;\n  }\n  return active;\n}\n\n/** True if `node` lives inside the shadow root of `host` (at any\n *  depth). Used to de-dupe when both a custom-element host and one\n *  of its shadow descendants would land in the focusable list — the\n *  host wins and the descendant is dropped. */\nfunction isShadowDescendant(node: Element, host: Element): boolean {\n  // No shadow root means `host` can't have shadow descendants at all.\n  if (!(host as Element & { shadowRoot?: ShadowRoot | null }).shadowRoot) {\n    return false;\n  }\n  let cursor: Node | null = node;\n  while (cursor) {\n    const root = cursor.getRootNode?.();\n    if (root && (root as ShadowRoot).host === host) return true;\n    // Step out of the current shadow root, if any, then continue\n    // walking up the next ancestor chain.\n    if (root && (root as ShadowRoot).host) {\n      cursor = (root as ShadowRoot).host;\n    } else {\n      cursor = (cursor as Element).parentNode;\n    }\n  }\n  return false;\n}\n\n/** Tab-order visibility check that survives shadow boundaries.\n *  `offsetParent` returns null for shadow descendants in some engines\n *  (and for `position: fixed` elements always), so we fall back to a\n *  bounding-rect probe — an element with non-zero size in the layout\n *  tree is what the user can actually focus. */\nfunction isVisible(el: HTMLElement): boolean {\n  if (!el.isConnected) return false;\n  const rect = el.getBoundingClientRect();\n  if (rect.width > 0 && rect.height > 0) return true;\n  // Off-screen-but-laid-out check (e.g. virtualised inputs that have\n  // zero box but are still tabbable in the DOM). Conservative — if\n  // both probes fail we treat the element as not focusable.\n  return el.offsetWidth > 0 || el.offsetHeight > 0 || el.getClientRects().length > 0;\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/components-csr/md-divider.js

@@ -0,0 +1,2 @@
+import{p as i,H as e,h as d,d as n,t}from"./p-bSpXNc5J.js";const r=()=>`:host{--_color:var(--md-divider-color, var(--md-sys-color-outline-variant, #CAC4D0));--_thickness:var(--md-divider-thickness, 1px);--_inset-start:var(--md-divider-inset-start, 16px);--_inset-end:var(--md-divider-inset-end, 16px);display:block;block-size:var(--_thickness);flex-shrink:0;box-sizing:border-box}.md-divider__line{block-size:100%;inline-size:auto;background-color:var(--_color);box-sizing:border-box}:host(.md-divider--inset) .md-divider__line{margin-inline-start:var(--_inset-start);margin-inline-end:var(--_inset-end)}:host(.md-divider--inset-start) .md-divider__line{margin-inline-start:var(--_inset-start);margin-inline-end:0}:host(.md-divider--inset-end) .md-divider__line{margin-inline-start:0;margin-inline-end:var(--_inset-end)}:host(.md-divider--vertical){display:inline-flex;inline-size:var(--_thickness);block-size:auto;min-block-size:1em;align-self:stretch}:host(.md-divider--vertical) .md-divider__line{block-size:auto;inline-size:100%;align-self:stretch}:host(.md-divider--vertical.md-divider--inset) .md-divider__line{margin-inline-start:0;margin-inline-end:0;margin-block-start:var(--_inset-start);margin-block-end:var(--_inset-end)}:host(.md-divider--vertical.md-divider--inset-start) .md-divider__line{margin-inline-start:0;margin-inline-end:0;margin-block-start:var(--_inset-start);margin-block-end:0}:host(.md-divider--vertical.md-divider--inset-end) .md-divider__line{margin-inline-start:0;margin-inline-end:0;margin-block-start:0;margin-block-end:var(--_inset-end)}@media (forced-colors: active){.md-divider__line{background-color:CanvasText}}`;const s=i(class i extends e{constructor(i){super();if(i!==false){this.__registerHost()}this.__attachShadow();this.inset=false;this.insetStart=false;this.insetEnd=false;this.vertical=false}render(){return d(n,{key:"ac4ff97d8cd888c42a726d7d57898576b5d4591f",class:{"md-divider":true,"md-divider--inset":this.inset,"md-divider--inset-start":this.insetStart,"md-divider--inset-end":this.insetEnd,"md-divider--vertical":this.vertical},role:"separator","aria-orientation":this.vertical?"vertical":"horizontal"},d("div",{key:"ae92f30866cb2da8675c50a794f8cfd86c08ea63",class:"md-divider__line",part:"divider"}))}static get style(){return r()}},[1,"md-divider",{inset:[516],insetStart:[516,"inset-start"],insetEnd:[516,"inset-end"],vertical:[516]}]);function a(){if(typeof customElements==="undefined"){return}const i=["md-divider"];i.forEach((i=>{switch(i){case"md-divider":if(!customElements.get(t(i))){customElements.define(t(i),s)}break}}))}a();const l=s;const o=a;export{l as MdDivider,o as defineCustomElement};
+//# sourceMappingURL=md-divider.js.map

package/dist/components-csr/md-divider.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["mdDividerCss","MdDivider","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","inset","insetStart","insetEnd","vertical","render","h","Host","key","class","role","part"],"sources":["src/components/md-divider/md-divider.css?tag=md-divider&encapsulation=shadow","src/components/md-divider/md-divider.tsx"],"sourcesContent":["/* ==========================================================\n   md-divider — Material Design 3 Divider\n   Spec: https://m3.material.io/components/divider/specs\n\n   PUBLIC CSS CUSTOM PROPERTIES (override per-instance):\n     --md-divider-color          Divider line color\n     --md-divider-thickness      Line thickness (default 1px)\n     --md-divider-inset-start    Start-side inset margin\n     --md-divider-inset-end      End-side inset margin\n\n   CSS PARTS:\n     divider   The divider element itself (host)\n\n   SLOTS:\n     (none)\n   ========================================================== */\n\n:host {\n  --_color: var(--md-divider-color, var(--md-sys-color-outline-variant, #CAC4D0));\n  --_thickness: var(--md-divider-thickness, 1px);\n  --_inset-start: var(--md-divider-inset-start, 16px);\n  --_inset-end: var(--md-divider-inset-end, 16px);\n\n  display: block;\n  block-size: var(--_thickness);\n  flex-shrink: 0;\n  box-sizing: border-box;\n}\n\n/* The painted rule. Insets live here, not on the host — see md-divider.tsx. */\n.md-divider__line {\n  block-size: 100%;\n  inline-size: auto;\n  background-color: var(--_color);\n  box-sizing: border-box;\n}\n\n/* ==========================================================\n   INSET VARIANTS\n   Full-width (default): 100%, no margins\n   Inset-start: 16px leading, 0px trailing\n   Inset-end: 0px leading, 16px trailing\n   Middle-inset (inset): 16px both sides\n   ========================================================== */\n\n:host(.md-divider--inset) .md-divider__line {\n  margin-inline-start: var(--_inset-start);\n  margin-inline-end: var(--_inset-end);\n}\n\n:host(.md-divider--inset-start) .md-divider__line {\n  margin-inline-start: var(--_inset-start);\n  margin-inline-end: 0;\n}\n\n:host(.md-divider--inset-end) .md-divider__line {\n  margin-inline-start: 0;\n  margin-inline-end: var(--_inset-end);\n}\n\n/* ==========================================================\n   VERTICAL ORIENTATION\n   ========================================================== */\n\n:host(.md-divider--vertical) {\n  /* flex, so the rule inside can `stretch` to the host's height MINUS its own\n     inset margins. With a plain block host the rule needed `block-size: 100%`,\n     which ignores margins and pushed an inset divider past its container by\n     exactly the inset. */\n  display: inline-flex;\n  inline-size: var(--_thickness);\n  block-size: auto;\n  min-block-size: 1em;\n  align-self: stretch;\n}\n\n:host(.md-divider--vertical) .md-divider__line {\n  block-size: auto;\n  inline-size: 100%;\n  align-self: stretch;\n}\n\n:host(.md-divider--vertical.md-divider--inset) .md-divider__line {\n  margin-inline-start: 0;\n  margin-inline-end: 0;\n  margin-block-start: var(--_inset-start);\n  margin-block-end: var(--_inset-end);\n}\n\n:host(.md-divider--vertical.md-divider--inset-start) .md-divider__line {\n  margin-inline-start: 0;\n  margin-inline-end: 0;\n  margin-block-start: var(--_inset-start);\n  margin-block-end: 0;\n}\n\n:host(.md-divider--vertical.md-divider--inset-end) .md-divider__line {\n  margin-inline-start: 0;\n  margin-inline-end: 0;\n  margin-block-start: 0;\n  margin-block-end: var(--_inset-end);\n}\n\n/* ==========================================================\n   FORCED COLORS (High Contrast)\n   ========================================================== */\n\n@media (forced-colors: active) {\n  .md-divider__line {\n    background-color: CanvasText;\n  }\n}\n","import { Component, Host, h, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'md-divider',\n  styleUrl: 'md-divider.css',\n  shadow: true,\n})\nexport class MdDivider {\n  /** Middle-inset: 16px margin on both sides */\n  @Prop({ reflect: true }) inset: boolean = false;\n\n  /** Inset start only: 16px leading margin, 0px trailing */\n  @Prop({ reflect: true, attribute: 'inset-start' }) insetStart: boolean = false;\n\n  /** Inset end only: 0px leading margin, 16px trailing */\n  @Prop({ reflect: true, attribute: 'inset-end' }) insetEnd: boolean = false;\n\n  /** Vertical orientation */\n  @Prop({ reflect: true }) vertical: boolean = false;\n\n  render() {\n    return (\n      <Host\n        class={{\n          'md-divider': true,\n          'md-divider--inset': this.inset,\n          'md-divider--inset-start': this.insetStart,\n          'md-divider--inset-end': this.insetEnd,\n          'md-divider--vertical': this.vertical,\n        }}\n        role=\"separator\"\n        aria-orientation={this.vertical ? 'vertical' : 'horizontal'}\n      >\n        {/*\n          The rule is an element INSIDE the shadow root rather than the host\n          itself. The insets are margins, and a host margin is trivially wiped\n          by a page-level reset — `* { margin: 0 }` (Tailwind Preflight, most\n          normalize variants) beats a `:host` rule outright, because outer-tree\n          styles win the shadow cascade regardless of specificity. Inside the\n          shadow root nothing on the page can reach it.\n        */}\n        <div class=\"md-divider__line\" part=\"divider\" />\n      </Host>\n    );\n  }\n}\n"],"mappings":"2DAAA,MAAMA,EAAe,IAAM,4iD,MCOdC,EAASC,EAAA,MAAAD,UAAAE,EALtB,WAAAC,CAAAC,G,kEAO2BC,KAAAC,MAAiB,MAGSD,KAAAE,WAAsB,MAGxBF,KAAAG,SAAoB,MAG5CH,KAAAI,SAAoB,KA2B9C,CAzBC,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,aAAc,KACd,oBAAqBT,KAAKC,MAC1B,0BAA2BD,KAAKE,WAChC,wBAAyBF,KAAKG,SAC9B,uBAAwBH,KAAKI,UAE/BM,KAAK,YAAW,mBACEV,KAAKI,SAAW,WAAa,cAU/CE,EAAA,OAAAE,IAAA,2CAAKC,MAAM,mBAAmBE,KAAK,Y","ignoreList":[]}

package/dist/components-csr/md-fab-menu-item.js

@@ -0,0 +1,2 @@
+import{p as e,H as t,c as s,h as a,d as i,t as o}from"./p-bSpXNc5J.js";import{t as n}from"./p-DYBUr7K_.js";import{d as r}from"./p-C3vB0Hd9.js";const l=()=>`:host{--_container-color:var(--md-fab-menu-item-container-color, var(--md-sys-color-primary-container));--_label-color:var(--md-fab-menu-item-label-color, var(--md-sys-color-on-primary-container));--_icon-color:var(--md-fab-menu-item-icon-color, var(--_label-color));--_icon-size:var(--md-fab-menu-item-icon-size, max(16px, calc(20px + var(--md-sys-density-scale, 0) * 1px)));--_container-shape:var(--md-fab-menu-item-container-shape, var(--md-sys-shape-corner-full, 9999px));--_state-layer-color:var(--_label-color);display:inline-flex;align-items:center;justify-content:center;position:relative;overflow:hidden;cursor:pointer;user-select:none;border:none;outline:none;box-sizing:border-box;min-height:max(32px, calc(48px + var(--md-sys-density-scale, 0) * 4px));padding-inline:var(--md-sys-spacing-inset-xl, 24px);gap:var(--md-sys-spacing-gap-sm, 8px);background-color:var(--_container-color);color:var(--_label-color);border-radius:var(--_container-shape);box-shadow:none;font-family:var(--md-sys-typescale-title-small-font-family, Roboto, sans-serif);font-size:max(12px, calc(14px + var(--md-sys-density-scale, 0) * 0.5px));font-weight:var(--md-sys-typescale-title-small-font-weight, 500);letter-spacing:var(--md-sys-typescale-title-small-letter-spacing, 0.1px);line-height:max(16px, calc(20px + var(--md-sys-density-scale, 0) * 1px));transition:background-color 280ms var(--md-sys-motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1));-webkit-tap-highlight-color:transparent;white-space:nowrap}:host(.md-fab-menu-item--with-icon){padding-inline-start:var(--md-sys-spacing-inset-lg, 16px)}.md-fab-menu-item__state-layer{position:absolute;inset:0;border-radius:inherit;background-color:var(--_state-layer-color);opacity:0;transition:opacity 280ms var(--md-sys-motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1));pointer-events:none}:host(:hover) .md-fab-menu-item__state-layer{opacity:var(--md-sys-state-hover-state-layer-opacity, 0.08)}:host(:focus-visible) .md-fab-menu-item__state-layer,:host(.md-fab-menu-item--roving-focus-visible:not(:focus)) .md-fab-menu-item__state-layer{opacity:var(--md-sys-state-focus-state-layer-opacity, 0.12)}:host(:active) .md-fab-menu-item__state-layer{opacity:var(--md-sys-state-pressed-state-layer-opacity, 0.12)}:host(:focus:not(:focus-visible)){outline:none}:host(:focus-visible),:host(.md-fab-menu-item--roving-focus-visible:not(:focus)){outline:3px solid var(--md-sys-color-secondary);outline-offset:2px;z-index:1}:host(.md-fab-menu-item--disabled){cursor:default;pointer-events:none;--_container-color:color-mix(in srgb, var(--md-sys-color-on-surface) calc(var(--md-sys-state-disabled-container-opacity, 0.12) * 100%), transparent);--_label-color:color-mix(in srgb, var(--md-sys-color-on-surface) calc(var(--md-sys-state-disabled-content-opacity, 0.38) * 100%), transparent)}:host([soft-disabled]){cursor:default;pointer-events:auto;--_container-color:color-mix(in srgb, var(--md-sys-color-on-surface) calc(var(--md-sys-state-disabled-container-opacity, 0.12) * 100%), transparent);--_label-color:color-mix(in srgb, var(--md-sys-color-on-surface) calc(var(--md-sys-state-disabled-content-opacity, 0.38) * 100%), transparent)}:host(.md-fab-menu-item--disabled:hover) .md-fab-menu-item__state-layer,:host(.md-fab-menu-item--disabled:active) .md-fab-menu-item__state-layer,:host(.md-fab-menu-item--disabled:focus-visible) .md-fab-menu-item__state-layer{opacity:0}:host([soft-disabled]) .md-fab-menu-item__state-layer{display:none}.md-fab-menu-item__icon{color:var(--_icon-color);font-size:var(--_icon-size);inline-size:var(--_icon-size);block-size:var(--_icon-size);display:flex;align-items:center;justify-content:center;flex-shrink:0}slot[name="icon"]{display:contents}::slotted([slot="icon"]){color:var(--_icon-color);inline-size:var(--_icon-size);block-size:var(--_icon-size);flex-shrink:0;fill:currentColor}.md-fab-menu-item__label{display:flex;align-items:center;white-space:nowrap}.material-symbols-outlined{font-family:var(--md-sys-icon-font-family, 'Material Symbols Outlined', 'Material Icons');font-weight:normal;font-style:normal;font-size:var(--_icon-size, 20px);line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;overflow-wrap:normal;direction:ltr;font-feature-settings:'liga';-webkit-font-smoothing:antialiased}@media (prefers-reduced-motion: reduce){:host{transition:none}.md-fab-menu-item__state-layer{transition:none}}@media (forced-colors: active){:host{border:1px solid ButtonText;background-color:ButtonFace;color:ButtonText;forced-color-adjust:none}:host(:focus-visible){outline-color:Highlight}:host(.md-fab-menu-item--disabled){border-color:GrayText;color:GrayText;opacity:1}.md-fab-menu-item__state-layer{display:none}.md-fab-menu-item__icon,.md-fab-menu-item__label{color:inherit}}:host([density='-1']){--md-sys-density-scale:-1}:host([density='-2']){--md-sys-density-scale:-2}:host([density='-3']){--md-sys-density-scale:-3}:host([density='-4']){--md-sys-density-scale:-4}`;const c=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow();this.mdClick=s(this,"mdClick",7);this.icon="";this.label="";this.disabled=false;this.softDisabled=false;this.rovingFocusVisible=false;this.density=0;this.hasSlottedIcon=false;this.handleClick=e=>{if(this.isDisabled){e.preventDefault();e.stopPropagation();return}this.mdClick.emit()};this.handleKeyDown=e=>{if(e.key==="Enter"||e.key===" "){e.preventDefault();if(!this.isDisabled){n(this.el);this.mdClick.emit()}}}}get isDisabled(){return this.disabled||this.softDisabled}componentWillLoad(){if(!this.el.hasAttribute("tabindex")){this.el.setAttribute("tabindex","-1")}}componentDidLoad(){const e=this.el.shadowRoot;if(!e)return;const t=e.querySelector('slot[name="icon"]');t?.addEventListener("slotchange",(()=>{this.hasSlottedIcon=t.assignedElements().length>0}))}render(){const e=!!this.icon;const t=this.isDisabled;return a(i,{key:"e699015c04bd99bff0b6115f748e6f5d3f4aef6a",class:{"md-fab-menu-item":true,"md-fab-menu-item--with-icon":e||this.hasSlottedIcon,"md-fab-menu-item--disabled":t,"md-fab-menu-item--roving-focus-visible":this.rovingFocusVisible},role:"menuitem","aria-disabled":t?"true":null,onClick:this.handleClick,onKeyDown:this.handleKeyDown},a("md-ripple",{key:"66d1d6c5ee657a7c5b2ec5ec3dac1308b6131d1c",disabled:t}),a("span",{key:"29baf1f4a5381ef65b9d508331ec7ab133dcc21b",class:"md-fab-menu-item__state-layer",part:"state-layer","aria-hidden":"true"}),a("slot",{key:"b5d40819f7a5ece262ca67095137a109b160b28a",name:"icon"},e&&a("span",{key:"ce2dd960172dea53be26ceefdc0aee394ee1f8ae",class:"md-fab-menu-item__icon material-symbols-outlined",part:"icon","aria-hidden":"true"},this.icon)),a("span",{key:"f35e75ed18e628c9dfcd972001b79b365e29b7a6",class:"md-fab-menu-item__label",part:"label"},this.label?this.label:a("slot",null)))}get el(){return this}static get style(){return l()}},[257,"md-fab-menu-item",{icon:[1],label:[1],disabled:[516],softDisabled:[516,"soft-disabled"],rovingFocusVisible:[1028,"roving-focus-visible"],density:[514],hasSlottedIcon:[32]}]);function m(){if(typeof customElements==="undefined"){return}const e=["md-fab-menu-item","md-ripple"];e.forEach((e=>{switch(e){case"md-fab-menu-item":if(!customElements.get(o(e))){customElements.define(o(e),c)}break;case"md-ripple":if(!customElements.get(o(e))){r()}break}}))}m();const d=c;const f=m;export{d as MdFabMenuItem,f as defineCustomElement};
+//# sourceMappingURL=md-fab-menu-item.js.map

package/dist/components-csr/md-fab-menu-item.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["mdFabMenuItemCss","MdFabMenuItem","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","icon","label","disabled","softDisabled","rovingFocusVisible","density","hasSlottedIcon","handleClick","e","isDisabled","preventDefault","stopPropagation","mdClick","emit","handleKeyDown","key","triggerRipple","el","componentWillLoad","hasAttribute","setAttribute","componentDidLoad","shadow","shadowRoot","iconSlot","querySelector","addEventListener","assignedElements","length","render","hasIcon","effectivelyDisabled","h","Host","class","role","onClick","onKeyDown","part","name"],"sources":["src/components/md-fab-menu-item/md-fab-menu-item.css?tag=md-fab-menu-item&encapsulation=shadow","src/components/md-fab-menu-item/md-fab-menu-item.tsx"],"sourcesContent":["/* ==========================================================\n   md-fab-menu-item — Material Design 3 Expressive FAB Menu Item\n   Spec: https://m3.material.io/components/floating-action-button/specs\n   Measurements match the medium button specs (48px height).\n\n   PUBLIC CSS CUSTOM PROPERTIES (override per-instance):\n     --md-fab-menu-item-container-color     Container background\n     --md-fab-menu-item-label-color         Label + icon color\n     --md-fab-menu-item-icon-color          Icon color override\n     --md-fab-menu-item-icon-size           Icon dimensions\n     --md-fab-menu-item-container-shape     Border-radius override\n\n   CSS PARTS:\n     state-layer   State-layer overlay\n     icon          Leading icon (fallback)\n     label         Label text wrapper\n\n   SLOTS:\n     icon      Custom leading icon (replaces icon prop)\n     (default) Fallback for label text (when label prop is empty)\n   ========================================================== */\n\n:host {\n  --_container-color: var(--md-fab-menu-item-container-color, var(--md-sys-color-primary-container));\n  --_label-color: var(--md-fab-menu-item-label-color, var(--md-sys-color-on-primary-container));\n  --_icon-color: var(--md-fab-menu-item-icon-color, var(--_label-color));\n  --_icon-size: var(--md-fab-menu-item-icon-size, max(16px, calc(20px + var(--md-sys-density-scale, 0) * 1px)));\n  --_container-shape: var(--md-fab-menu-item-container-shape, var(--md-sys-shape-corner-full, 9999px));\n  --_state-layer-color: var(--_label-color);\n\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  position: relative;\n  overflow: hidden;\n  cursor: pointer;\n  user-select: none;\n  border: none;\n  outline: none;\n  box-sizing: border-box;\n\n  min-height: max(32px, calc(48px + var(--md-sys-density-scale, 0) * 4px));\n  padding-inline: var(--md-sys-spacing-inset-xl, 24px);\n  gap: var(--md-sys-spacing-gap-sm, 8px);\n\n  background-color: var(--_container-color);\n  color: var(--_label-color);\n  border-radius: var(--_container-shape);\n  box-shadow: none;\n\n  font-family: var(--md-sys-typescale-title-small-font-family, Roboto, sans-serif);\n  font-size: max(12px, calc(14px + var(--md-sys-density-scale, 0) * 0.5px));\n  font-weight: var(--md-sys-typescale-title-small-font-weight, 500);\n  letter-spacing: var(--md-sys-typescale-title-small-letter-spacing, 0.1px);\n  line-height: max(16px, calc(20px + var(--md-sys-density-scale, 0) * 1px));\n\n  transition:\n    background-color 280ms var(--md-sys-motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1));\n  -webkit-tap-highlight-color: transparent;\n  white-space: nowrap;\n}\n\n/* With icon: reduce start padding */\n:host(.md-fab-menu-item--with-icon) {\n  padding-inline-start: var(--md-sys-spacing-inset-lg, 16px);\n}\n\n/* ==========================================================\n   1. STATE LAYER\n   ========================================================== */\n\n.md-fab-menu-item__state-layer {\n  position: absolute;\n  inset: 0;\n  border-radius: inherit;\n  background-color: var(--_state-layer-color);\n  opacity: 0;\n  transition: opacity 280ms var(--md-sys-motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1));\n  pointer-events: none;\n}\n\n:host(:hover) .md-fab-menu-item__state-layer {\n  opacity: var(--md-sys-state-hover-state-layer-opacity, 0.08);\n}\n\n:host(:focus-visible) .md-fab-menu-item__state-layer,\n:host(.md-fab-menu-item--roving-focus-visible:not(:focus)) .md-fab-menu-item__state-layer {\n  opacity: var(--md-sys-state-focus-state-layer-opacity, 0.12);\n}\n\n:host(:active) .md-fab-menu-item__state-layer {\n  opacity: var(--md-sys-state-pressed-state-layer-opacity, 0.12);\n}\n\n/* ==========================================================\n   2. FOCUS RING\n   ========================================================== */\n\n:host(:focus:not(:focus-visible)) {\n  outline: none;\n}\n\n:host(:focus-visible),\n:host(.md-fab-menu-item--roving-focus-visible:not(:focus)) {\n  outline: 3px solid var(--md-sys-color-secondary);\n  outline-offset: 2px;\n  z-index: 1;\n}\n\n/* ==========================================================\n   4. DISABLED\n   ========================================================== */\n\n:host(.md-fab-menu-item--disabled) {\n  cursor: default;\n  pointer-events: none;\n  --_container-color: color-mix(in srgb, var(--md-sys-color-on-surface) calc(var(--md-sys-state-disabled-container-opacity, 0.12) * 100%), transparent);\n  --_label-color: color-mix(in srgb, var(--md-sys-color-on-surface) calc(var(--md-sys-state-disabled-content-opacity, 0.38) * 100%), transparent);\n}\n\n/* Soft-disabled: same visuals but remains focusable */\n:host([soft-disabled]) {\n  cursor: default;\n  pointer-events: auto;\n  --_container-color: color-mix(in srgb, var(--md-sys-color-on-surface) calc(var(--md-sys-state-disabled-container-opacity, 0.12) * 100%), transparent);\n  --_label-color: color-mix(in srgb, var(--md-sys-color-on-surface) calc(var(--md-sys-state-disabled-content-opacity, 0.38) * 100%), transparent);\n}\n\n:host(.md-fab-menu-item--disabled:hover) .md-fab-menu-item__state-layer,\n:host(.md-fab-menu-item--disabled:active) .md-fab-menu-item__state-layer,\n:host(.md-fab-menu-item--disabled:focus-visible) .md-fab-menu-item__state-layer {\n  opacity: 0;\n}\n\n:host([soft-disabled]) .md-fab-menu-item__state-layer {\n  display: none;\n}\n\n/* ==========================================================\n   5. ICON\n   ========================================================== */\n\n.md-fab-menu-item__icon {\n  color: var(--_icon-color);\n  font-size: var(--_icon-size);\n  inline-size: var(--_icon-size);\n  block-size: var(--_icon-size);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n}\n\nslot[name=\"icon\"] {\n  display: contents;\n}\n\n::slotted([slot=\"icon\"]) {\n  color: var(--_icon-color);\n  inline-size: var(--_icon-size);\n  block-size: var(--_icon-size);\n  flex-shrink: 0;\n  fill: currentColor;\n}\n\n/* ==========================================================\n   6. LABEL\n   ========================================================== */\n\n.md-fab-menu-item__label {\n  display: flex;\n  align-items: center;\n  white-space: nowrap;\n}\n\n/* ==========================================================\n   7. MATERIAL SYMBOLS\n   ========================================================== */\n\n.material-symbols-outlined {\n  font-family: var(--md-sys-icon-font-family, 'Material Symbols Outlined', 'Material Icons');\n  font-weight: normal;\n  font-style: normal;\n  font-size: var(--_icon-size, 20px);\n  line-height: 1;\n  letter-spacing: normal;\n  text-transform: none;\n  display: inline-block;\n  white-space: nowrap;\n  overflow-wrap: normal;\n  direction: ltr;\n  font-feature-settings: 'liga';\n  -webkit-font-smoothing: antialiased;\n}\n\n/* ==========================================================\n   8. REDUCED MOTION\n   ========================================================== */\n\n@media (prefers-reduced-motion: reduce) {\n  :host {\n    transition: none;\n  }\n\n  .md-fab-menu-item__state-layer {\n    transition: none;\n  }\n}\n\n/* ==========================================================\n   9. FORCED COLORS — Windows High Contrast\n   ========================================================== */\n\n@media (forced-colors: active) {\n  :host {\n    border: 1px solid ButtonText;\n    background-color: ButtonFace;\n    color: ButtonText;\n    forced-color-adjust: none;\n  }\n\n  :host(:focus-visible) {\n    outline-color: Highlight;\n  }\n\n  :host(.md-fab-menu-item--disabled) {\n    border-color: GrayText;\n    color: GrayText;\n    opacity: 1;\n  }\n\n  .md-fab-menu-item__state-layer {\n    display: none;\n  }\n\n  .md-fab-menu-item__icon,\n  .md-fab-menu-item__label {\n    color: inherit;\n  }\n}\n\n/* ==========================================================\n   DENSITY (local override)\n   Maps the local `density` prop onto the same --md-sys-density-scale signal a\n   global `data-density` ancestor sets. Declared on :host, so a local rung wins\n   over the inherited global one. Every density-sensitive value in this file\n   derives from that single signal by calc — never add a fixed per-rung ladder.\n   ========================================================== */\n:host([density='-1']) { --md-sys-density-scale: -1; }\n:host([density='-2']) { --md-sys-density-scale: -2; }\n:host([density='-3']) { --md-sys-density-scale: -3; }\n:host([density='-4']) { --md-sys-density-scale: -4; }\n","import { Component, Host, h, Prop, State, Event, EventEmitter, Element } from '@stencil/core';\nimport { triggerRipple } from '../../utils/ripple';\n\n@Component({\n  tag: 'md-fab-menu-item',\n  styleUrl: 'md-fab-menu-item.css',\n  shadow: true,\n})\nexport class MdFabMenuItem {\n  @Element() el!: HTMLElement;\n\n  /** Material Symbols icon name. */\n  @Prop() icon: string = '';\n\n  /** Item label text. */\n  @Prop() label: string = '';\n\n  /** Whether the item is disabled (removed from tab order). */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /** Whether the item is soft-disabled (still focusable but not activatable). */\n  @Prop({ reflect: true, attribute: 'soft-disabled' }) softDisabled: boolean = false;\n\n  /**\n   * When `true`, paints the keyboard-focus ring even if the item does not hold DOM focus\n   * (e.g. arrow-key navigation drove `focusItem()`). Set by `md-fab-menu` during\n   * programmatic roving — not on initial open.\n   */\n  @Prop({ mutable: true, reflect: false }) rovingFocusVisible: boolean = false;\n\n  /**\n   * Local density rung. Drives the same `--md-sys-density-scale` signal that a\n   * global `data-density` ancestor sets, so a local value simply overrides the\n   * inherited one. 0 = default, -4 = ultra-compact.\n   */\n  @Prop({ reflect: true }) density: 0 | -1 | -2 | -3 | -4 = 0;\n\n  /** Fires when the item is activated. */\n  @Event() mdClick: EventEmitter<void>;\n\n  @State() private hasSlottedIcon = false;\n\n  private get isDisabled() {\n    return this.disabled || this.softDisabled;\n  }\n\n  componentWillLoad() {\n    if (!this.el.hasAttribute('tabindex')) {\n      this.el.setAttribute('tabindex', '-1');\n    }\n  }\n\n  componentDidLoad() {\n    const shadow = this.el.shadowRoot;\n    if (!shadow) return;\n\n    const iconSlot = shadow.querySelector('slot[name=\"icon\"]') as HTMLSlotElement | null;\n    iconSlot?.addEventListener('slotchange', () => {\n      this.hasSlottedIcon = iconSlot.assignedElements().length > 0;\n    });\n  }\n\n  private handleClick = (e: MouseEvent) => {\n    if (this.isDisabled) {\n      e.preventDefault();\n      e.stopPropagation();\n      return;\n    }\n    this.mdClick.emit();\n  };\n\n  private handleKeyDown = (e: KeyboardEvent) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      if (!this.isDisabled) {\n        triggerRipple(this.el);\n        this.mdClick.emit();\n      }\n    }\n  };\n\n  render() {\n    const hasIcon = !!this.icon;\n    const effectivelyDisabled = this.isDisabled;\n\n    return (\n      <Host\n        class={{\n          'md-fab-menu-item': true,\n          'md-fab-menu-item--with-icon': hasIcon || this.hasSlottedIcon,\n          'md-fab-menu-item--disabled': effectivelyDisabled,\n          'md-fab-menu-item--roving-focus-visible': this.rovingFocusVisible,\n        }}\n        role=\"menuitem\"\n        aria-disabled={effectivelyDisabled ? 'true' : null}\n        onClick={this.handleClick}\n        onKeyDown={this.handleKeyDown}\n      >\n        <md-ripple disabled={effectivelyDisabled}></md-ripple>\n        <span class=\"md-fab-menu-item__state-layer\" part=\"state-layer\" aria-hidden=\"true\"></span>\n        <slot name=\"icon\">\n          {hasIcon && (\n            <span class=\"md-fab-menu-item__icon material-symbols-outlined\" part=\"icon\" aria-hidden=\"true\">\n              {this.icon}\n            </span>\n          )}\n        </slot>\n        <span class=\"md-fab-menu-item__label\" part=\"label\">\n          {this.label ? this.label : <slot />}\n        </span>\n      </Host>\n    );\n  }\n}\n"],"mappings":"+IAAA,MAAMA,EAAmB,IAAM,43J,MCQlBC,EAAaC,EAAA,MAAAD,UAAAE,EAL1B,WAAAC,CAAAC,G,mGASUC,KAAAC,KAAe,GAGfD,KAAAE,MAAgB,GAGCF,KAAAG,SAAoB,MAGQH,KAAAI,aAAwB,MAOpCJ,KAAAK,mBAA8B,MAO9CL,KAAAM,QAAiC,EAKzCN,KAAAO,eAAiB,MAsB1BP,KAAAQ,YAAeC,IACrB,GAAIT,KAAKU,WAAY,CACnBD,EAAEE,iBACFF,EAAEG,kBACF,M,CAEFZ,KAAKa,QAAQC,MAAM,EAGbd,KAAAe,cAAiBN,IACvB,GAAIA,EAAEO,MAAQ,SAAWP,EAAEO,MAAQ,IAAK,CACtCP,EAAEE,iBACF,IAAKX,KAAKU,WAAY,CACpBO,EAAcjB,KAAKkB,IACnBlB,KAAKa,QAAQC,M,GAqCpB,CAvEC,cAAYJ,GACV,OAAOV,KAAKG,UAAYH,KAAKI,Y,CAG/B,iBAAAe,GACE,IAAKnB,KAAKkB,GAAGE,aAAa,YAAa,CACrCpB,KAAKkB,GAAGG,aAAa,WAAY,K,EAIrC,gBAAAC,GACE,MAAMC,EAASvB,KAAKkB,GAAGM,WACvB,IAAKD,EAAQ,OAEb,MAAME,EAAWF,EAAOG,cAAc,qBACtCD,GAAUE,iBAAiB,cAAc,KACvC3B,KAAKO,eAAiBkB,EAASG,mBAAmBC,OAAS,CAAC,G,CAuBhE,MAAAC,GACE,MAAMC,IAAY/B,KAAKC,KACvB,MAAM+B,EAAsBhC,KAAKU,WAEjC,OACEuB,EAACC,EAAI,CAAAlB,IAAA,2CACHmB,MAAO,CACL,mBAAoB,KACpB,8BAA+BJ,GAAW/B,KAAKO,eAC/C,6BAA8ByB,EAC9B,yCAA0ChC,KAAKK,oBAEjD+B,KAAK,WAAU,gBACAJ,EAAsB,OAAS,KAC9CK,QAASrC,KAAKQ,YACd8B,UAAWtC,KAAKe,eAEhBkB,EAAA,aAAAjB,IAAA,2CAAWb,SAAU6B,IACrBC,EAAA,QAAAjB,IAAA,2CAAMmB,MAAM,gCAAgCI,KAAK,cAAa,cAAa,SAC3EN,EAAA,QAAAjB,IAAA,2CAAMwB,KAAK,QACRT,GACCE,EAAA,QAAAjB,IAAA,2CAAMmB,MAAM,mDAAmDI,KAAK,OAAM,cAAa,QACpFvC,KAAKC,OAIZgC,EAAA,QAAAjB,IAAA,2CAAMmB,MAAM,0BAA0BI,KAAK,SACxCvC,KAAKE,MAAQF,KAAKE,MAAQ+B,EAAA,c","ignoreList":[]}

package/dist/components-csr/md-fab-menu.js

@@ -0,0 +1,2 @@
+import{p as t,H as s,c as i,h as e,d as n,t as o}from"./p-bSpXNc5J.js";const a=()=>`:host{display:none;position:fixed;inset:0;z-index:var(--md-sys-z-index-popup, 1000);pointer-events:none}:host(.md-fab-menu--open),:host(.md-fab-menu--closing){display:block}.md-fab-menu__container{position:fixed;display:flex;align-items:end;pointer-events:auto}:host(.md-fab-menu--up) .md-fab-menu__container{flex-direction:column}:host(.md-fab-menu--up) .md-fab-menu__items{display:flex;flex-direction:column-reverse;align-items:end;gap:var(--md-fab-menu-item-gap, var(--md-sys-spacing-gap-xs, 4px))}:host(.md-fab-menu--down) .md-fab-menu__container{flex-direction:column}:host(.md-fab-menu--down) .md-fab-menu__items{display:flex;flex-direction:column;align-items:end;gap:var(--md-fab-menu-item-gap, var(--md-sys-spacing-gap-xs, 4px))}:host(.md-fab-menu--primary){--md-fab-menu-item-container-color:var(--md-sys-color-primary-container);--md-fab-menu-item-label-color:var(--md-sys-color-on-primary-container)}:host(.md-fab-menu--secondary){--md-fab-menu-item-container-color:var(--md-sys-color-secondary-container);--md-fab-menu-item-label-color:var(--md-sys-color-on-secondary-container)}:host(.md-fab-menu--tertiary){--md-fab-menu-item-container-color:var(--md-sys-color-tertiary-container);--md-fab-menu-item-label-color:var(--md-sys-color-on-tertiary-container)}.md-fab-menu__container{opacity:0;transform:scaleY(0.8);transition:opacity var(--md-sys-motion-duration-short3, 150ms) var(--md-sys-motion-easing-emphasized-decelerate, cubic-bezier(0.05, 0.7, 0.1, 1)),     transform var(--md-sys-motion-duration-short3, 150ms) var(--md-sys-motion-easing-emphasized-decelerate, cubic-bezier(0.05, 0.7, 0.1, 1))}:host(.md-fab-menu--up) .md-fab-menu__container{transform-origin:bottom right}:host(.md-fab-menu--down) .md-fab-menu__container{transform-origin:top right}:host(.md-fab-menu--open) .md-fab-menu__container{opacity:1;transform:none}@starting-style{:host(.md-fab-menu--open) .md-fab-menu__container{opacity:0;transform:scaleY(0.8)}}:host(.md-fab-menu--closing) .md-fab-menu__container{opacity:0;transform:scaleY(0.8);transition:opacity var(--md-sys-motion-duration-short3, 150ms) var(--md-sys-motion-easing-emphasized-accelerate, cubic-bezier(0.3, 0, 0.8, 0.15)),     transform var(--md-sys-motion-duration-short3, 150ms) var(--md-sys-motion-easing-emphasized-accelerate, cubic-bezier(0.3, 0, 0.8, 0.15))}@media (prefers-reduced-motion: reduce){.md-fab-menu__container,:host(.md-fab-menu--open) .md-fab-menu__container,:host(.md-fab-menu--closing) .md-fab-menu__container{transition:none;opacity:1;transform:none}}@media (forced-colors: active){:host{forced-color-adjust:none}}:host([density='-1']){--md-sys-density-scale:-1}:host([density='-2']){--md-sys-density-scale:-2}:host([density='-3']){--md-sys-density-scale:-3}:host([density='-4']){--md-sys-density-scale:-4}`;const r=180;const h=400;const c=120;const m={primary:{bg:"var(--md-sys-color-primary)",fg:"var(--md-sys-color-on-primary)"},secondary:{bg:"var(--md-sys-color-secondary)",fg:"var(--md-sys-color-on-secondary)"},tertiary:{bg:"var(--md-sys-color-tertiary)",fg:"var(--md-sys-color-on-tertiary)"}};let d=0;const u=t(class t extends s{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.mdOpen=i(this,"mdOpen",7);this.mdClose=i(this,"mdClose",7);this.open=false;this.anchor="";this.variant="primary";this.placement="up";this.quick=false;this.menuLabel="Actions";this.density=0;this.closing=false;this.effectivePlacement="up";this.menuId=`md-fab-menu-${++d}`;this.focusedIndex=-1;this.openedViaKeyboard=false;this.pointerActivated=false;this.anchorFocusedAtActivation=false;this.savedIcon="";this.positionRafId=null;this.lastAnchorRect=null;this.anchorKeyHandler=t=>{if(t.key!=="Enter"&&t.key!==" ")return;this.openedViaKeyboard=true;const s=this.getAnchorEl();if(!s)return;const i=s.tagName.toLowerCase();if(i==="md-fab"||i==="md-button"||i==="button")return;t.preventDefault();t.stopPropagation();this.toggleMenu()};this.anchorClickHandler=t=>{if(!this.pointerActivated&&t.detail===0){this.openedViaKeyboard=true}this.pointerActivated=false;t.stopPropagation();this.toggleMenu()};this.anchorPointerHandler=()=>{this.pointerActivated=true;this.openedViaKeyboard=false;const t=this.getAnchorEl();const s=typeof document!=="undefined"?document.activeElement:null;this.anchorFocusedAtActivation=!!t&&!!s&&(t===s||t.contains(s))};this.handleKeyDown=t=>{if(!this.open)return;const s=t.target;if(s&&s.closest("md-fab-menu")!==this.el)return;const i=this.getItems();if(!i.length)return;switch(t.key){case"Escape":t.preventDefault();this.close();this.restoreFocusToAnchor();break;case"ArrowUp":t.preventDefault();if(this.effectivePlacement==="up"){this.focusItem(i,this.focusedIndex+1)}else{if(this.focusedIndex<=0){this.focusAnchor()}else{this.focusItem(i,this.focusedIndex-1)}}break;case"ArrowDown":t.preventDefault();if(this.effectivePlacement==="up"){if(this.focusedIndex<=0){this.focusAnchor()}else{this.focusItem(i,this.focusedIndex-1)}}else{this.focusItem(i,this.focusedIndex+1)}break;case"Home":t.preventDefault();this.focusItem(i,0);break;case"End":t.preventDefault();this.focusItem(i,i.length-1);break;case"Tab":{const e=this.getItemIndex(s,i);const n=e>=0?e:this.focusedIndex;if(t.shiftKey){if(n<=0){t.preventDefault();this.focusAnchor()}else{t.preventDefault();this.focusItem(i,n-1,false)}}else if(n>=i.length-1){t.stopPropagation();this.close()}else{t.preventDefault();this.focusItem(i,n+1,false)}break}default:if(t.key.length===1&&!t.ctrlKey&&!t.altKey&&!t.metaKey){this.handleTypeahead(i,t.key)}break}};this.typeaheadBuffer="";this.handleAnchorKeyDown=t=>{if(!this.open&&!this.closing)return;switch(t.key){case"Escape":t.preventDefault();this.close();break;case"ArrowUp":if(this.effectivePlacement==="up"){t.preventDefault();this.focusItem(null,0)}break;case"ArrowDown":if(this.effectivePlacement==="down"){t.preventDefault();this.focusItem(null,0)}break;case"Tab":if(!t.shiftKey){t.preventDefault();this.focusItem(null,0,false)}break}};this.handleOutsideClick=t=>{const s=t.composedPath();const i=this.getAnchorEl();if(!s.includes(this.el)&&(!i||!s.includes(i))){this.close()}};this.handleItemClick=()=>{this.close();this.restoreFocusToAnchor()}}connectedCallback(){this.effectivePlacement=this.placement==="auto"?"up":this.placement}componentDidLoad(){this.wireAnchor();if(this.open){this.resolveEffectivePlacement();requestAnimationFrame((()=>this.positionMenu()));this.updateAnchorAria(true);this.morphAnchorFab(true);this.addGlobalListeners();this.updateItemDelays();this.scheduleFocus((()=>this.initRovingTabindex()))}}disconnectedCallback(){this.unwireAnchor();this.removeGlobalListeners();clearTimeout(this.closeTimer);clearTimeout(this.morphCleanupTimer);clearTimeout(this.iconMorphTimer);clearTimeout(this.typeaheadTimer);this.resetAnchorFab()}onAnchorChange(){this.unwireAnchor();this.wireAnchor()}onPlacementChange(){if(this.placement!=="auto"){this.effectivePlacement=this.placement}}onOpenChange(t){if(t){this.resolveEffectivePlacement();requestAnimationFrame((()=>this.positionMenu()));this.mdOpen.emit();this.updateAnchorAria(true);this.morphAnchorFab(true);this.addGlobalListeners();this.updateItemDelays();if(this.openedViaKeyboard||this.anchorFocusedAtActivation){this.scheduleFocus((()=>this.focusFirstItem(3,true)))}else{this.scheduleFocus((()=>this.initRovingTabindex()))}this.openedViaKeyboard=false;this.anchorFocusedAtActivation=false}else{this.updateAnchorAria(false);this.morphAnchorFab(false);this.removeGlobalListeners();this.mdClose.emit();this.focusedIndex=-1;this.resetRovingTabindex();this.restoreFocusToAnchor()}}handleFocusIn(t){if(!this.open)return;const s=t.target;const i=this.getItems();const e=this.getItemIndex(s,i);if(e>=0&&e!==this.focusedIndex){if(this.focusedIndex>=0&&this.focusedIndex<i.length){i[this.focusedIndex].setAttribute("tabindex","-1")}this.focusedIndex=e;s.setAttribute("tabindex","0")}if(e>=0){this.clearRovingFocusVisible(i)}}async show(){clearTimeout(this.closeTimer);this.closing=false;this.open=true}async close(){if(!this.open||this.closing)return;if(this.quick){this.open=false;return}this.closing=true;this.closeTimer=setTimeout((()=>{this.closing=false;this.open=false}),r)}getAnchorEl(){return this.anchor?document.getElementById(this.anchor):null}toggleMenu(){if(this.open||this.closing){this.close()}else{this.show()}}wireAnchor(){this.unwireAnchor();if(!this.anchor||typeof document==="undefined")return;const t=this.getAnchorEl();if(!t)return;t.addEventListener("keydown",this.anchorKeyHandler,true);t.addEventListener("click",this.anchorClickHandler,true);t.addEventListener("mousedown",this.anchorPointerHandler);t.addEventListener("pointerdown",this.anchorPointerHandler)}unwireAnchor(){if(!this.anchor||typeof document==="undefined")return;const t=this.getAnchorEl();if(!t)return;t.removeEventListener("keydown",this.anchorKeyHandler,true);t.removeEventListener("click",this.anchorClickHandler,true);t.removeEventListener("mousedown",this.anchorPointerHandler);t.removeEventListener("pointerdown",this.anchorPointerHandler)}updateAnchorAria(t){const s=this.getAnchorEl();if(!s)return;if(t){s.setAttribute("aria-expanded","true");s.setAttribute("aria-haspopup","menu");s.setAttribute("aria-controls",this.menuId)}else{s.setAttribute("aria-expanded","false")}}morphAnchorFab(t){const s=this.getAnchorEl();if(!s)return;clearTimeout(this.morphCleanupTimer);clearTimeout(this.iconMorphTimer);if(t){this.savedIcon=s.icon||"";s.setAttribute("data-shape","circle");s.setAttribute("data-icon-morphing","");const t=m[this.variant];if(t){s.style.setProperty("--md-fab-container-color",t.bg);s.style.setProperty("--md-fab-icon-color",t.fg)}this.iconMorphTimer=setTimeout((()=>{s.icon="close";s.removeAttribute("data-icon-morphing")}),c);s.addEventListener("keydown",this.handleAnchorKeyDown)}else{s.removeAttribute("data-shape");s.setAttribute("data-icon-morphing","");s.style.removeProperty("--md-fab-container-color");s.style.removeProperty("--md-fab-icon-color");this.iconMorphTimer=setTimeout((()=>{s.icon=this.savedIcon;s.removeAttribute("data-icon-morphing")}),c);s.removeEventListener("keydown",this.handleAnchorKeyDown);this.morphCleanupTimer=setTimeout((()=>{this.savedIcon=""}),h)}}resetAnchorFab(){const t=this.getAnchorEl();if(!t)return;clearTimeout(this.morphCleanupTimer);clearTimeout(this.iconMorphTimer);t.removeAttribute("data-shape");t.removeAttribute("data-icon-morphing");if(this.savedIcon){t.icon=this.savedIcon;this.savedIcon=""}t.style.removeProperty("--md-fab-container-color");t.style.removeProperty("--md-fab-icon-color");t.removeEventListener("keydown",this.handleAnchorKeyDown)}restoreFocusToAnchor(){this.getAnchorEl()?.focus()}resolveEffectivePlacement(){if(this.placement!=="auto"){this.effectivePlacement=this.placement;return}const t=this.getAnchorEl();if(!t){this.effectivePlacement="up";return}const s=t.getBoundingClientRect();const i=s.top;const e=window.innerHeight-s.bottom;this.effectivePlacement=i>e?"up":"down"}positionMenu(){const t=this.getAnchorEl();const s=this.el.shadowRoot?.querySelector(".md-fab-menu__container");if(!t||!s)return;const i=t.getBoundingClientRect();const e=getComputedStyle(this.el).direction==="rtl";const n=8;if(e){s.style.left=`${i.left}px`;s.style.right=""}else{s.style.right=`${window.innerWidth-i.right}px`;s.style.left=""}if(this.effectivePlacement==="up"){s.style.bottom=`${window.innerHeight-i.top+n}px`;s.style.top=""}else{s.style.top=`${i.bottom+n}px`;s.style.bottom=""}}getItems(){return Array.from(this.el.querySelectorAll("md-fab-menu-item"))}getItemIndex(t,s){const i=s.indexOf(t);if(i>=0)return i;return s.findIndex((s=>s===t||s.contains(t)))}getEnabledItems(){return this.getItems().filter((t=>!t.hasAttribute("disabled")))}updateItemDelays(){const t=this.getItems();t.forEach(((t,s)=>{t.style.setProperty("--_fab-menu-item-index",String(s))}))}initRovingTabindex(){const t=this.getItems();t.forEach(((t,s)=>{t.setAttribute("tabindex",s===0?"0":"-1")}));this.focusedIndex=0}resetRovingTabindex(){const t=this.getItems();t.forEach((t=>{t.setAttribute("tabindex","-1")}));this.clearRovingFocusVisible(t)}scheduleFocus(t){setTimeout((()=>requestAnimationFrame((()=>t()))),0)}setRovingFocusVisible(t,s,i){t.forEach(((t,e)=>{t.rovingFocusVisible=i&&e===s}))}clearRovingFocusVisible(t){t.forEach((t=>{t.rovingFocusVisible=false}))}focusFirstItem(t=3,s=false){const i=this.getItems();if(i.length){this.focusItem(i,0,s)}else if(t>0){this.scheduleFocus((()=>this.focusFirstItem(t-1,s)))}}focusAnchor(){const t=this.getItems();t.forEach((t=>{t.setAttribute("tabindex","-1")}));this.clearRovingFocusVisible(t);const s=this.getAnchorEl();s?.focus();this.focusedIndex=-1}focusItem(t,s,i=true){const e=t??this.getItems();if(e.length===0)return;if(s<0)s=e.length-1;if(s>=e.length)s=0;if(this.focusedIndex>=0&&this.focusedIndex<e.length){e[this.focusedIndex].setAttribute("tabindex","-1")}this.focusedIndex=s;e[s].setAttribute("tabindex","0");this.setRovingFocusVisible(e,s,i);e[s].focus()}handleTypeahead(t,s){clearTimeout(this.typeaheadTimer);this.typeaheadBuffer+=s.toLowerCase();this.typeaheadTimer=setTimeout((()=>{this.typeaheadBuffer=""}),300);const i=this.focusedIndex>=0?this.focusedIndex:0;const e=t.length;for(let s=1;s<=e;s++){const n=(i+s)%e;const o=(t[n].getAttribute("label")||t[n].textContent||"").trim().toLowerCase();if(o.startsWith(this.typeaheadBuffer)){this.focusItem(t,n);return}}}startAnchorTracking(){this.stopAnchorTracking();const t=()=>{this.repositionIfAnchorMoved();this.positionRafId=requestAnimationFrame(t)};this.positionRafId=requestAnimationFrame(t)}repositionIfAnchorMoved(){const t=this.getAnchorEl();if(!t)return;const s=t.getBoundingClientRect();const i=this.lastAnchorRect;if(!i||i.top!==s.top||i.left!==s.left||i.right!==s.right||i.bottom!==s.bottom){this.lastAnchorRect={top:s.top,left:s.left,right:s.right,bottom:s.bottom};this.positionMenu()}}stopAnchorTracking(){if(this.positionRafId!==null){cancelAnimationFrame(this.positionRafId);this.positionRafId=null}this.lastAnchorRect=null}addGlobalListeners(){requestAnimationFrame((()=>{document.addEventListener("click",this.handleOutsideClick)}));this.startAnchorTracking();this.el.addEventListener("mdClick",this.handleItemClick)}removeGlobalListeners(){document.removeEventListener("click",this.handleOutsideClick);this.stopAnchorTracking();this.el.removeEventListener("mdClick",this.handleItemClick)}render(){return e(n,{key:"eb38be0588c7ca8b8cca6d04d15e5defd5ab196d",class:{"md-fab-menu":true,"md-fab-menu--open":this.open,"md-fab-menu--closing":this.closing,[`md-fab-menu--${this.variant}`]:true,[`md-fab-menu--${this.effectivePlacement}`]:true},role:"menu",id:this.menuId,"aria-label":this.menuLabel,"aria-orientation":"vertical","aria-hidden":!this.open&&!this.closing?"true":"false",onKeyDown:this.handleKeyDown},e("div",{key:"fb9347312ceb5cd36ad866a7ee2a384de4e6f55c",class:"md-fab-menu__container"},e("div",{key:"1537c4a81d7e70630f327183319fc48cd68e8eff",class:"md-fab-menu__items"},e("slot",{key:"5dc74d72ab07be74ca3ed0a937a5590a3c60b291"}))))}get el(){return this}static get watchers(){return{anchor:[{onAnchorChange:0}],placement:[{onPlacementChange:0}],open:[{onOpenChange:0}]}}static get style(){return a()}},[257,"md-fab-menu",{open:[1540],anchor:[1],variant:[513],placement:[513],quick:[4],menuLabel:[1,"menu-label"],density:[514],closing:[32],effectivePlacement:[32],show:[64],close:[64]},[[0,"focusin","handleFocusIn"]],{anchor:[{onAnchorChange:0}],placement:[{onPlacementChange:0}],open:[{onOpenChange:0}]}]);function l(){if(typeof customElements==="undefined"){return}const t=["md-fab-menu"];t.forEach((t=>{switch(t){case"md-fab-menu":if(!customElements.get(o(t))){customElements.define(o(t),u)}break}}))}l();const f=u;const b=l;export{f as MdFabMenu,b as defineCustomElement};
+//# sourceMappingURL=md-fab-menu.js.map

package/dist/components-csr/md-fab-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["mdFabMenuCss","CLOSE_ANIMATION_MS","MORPH_BACK_MS","ICON_FADE_MS","VARIANT_COLORS","primary","bg","fg","secondary","tertiary","fabMenuIdCounter","MdFabMenu","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","open","anchor","variant","placement","quick","menuLabel","density","closing","effectivePlacement","menuId","focusedIndex","openedViaKeyboard","pointerActivated","anchorFocusedAtActivation","savedIcon","positionRafId","lastAnchorRect","anchorKeyHandler","e","key","anchorEl","getAnchorEl","tag","tagName","toLowerCase","preventDefault","stopPropagation","toggleMenu","anchorClickHandler","detail","anchorPointerHandler","active","document","activeElement","contains","handleKeyDown","target","closest","el","items","getItems","length","close","restoreFocusToAnchor","focusItem","focusAnchor","itemIndex","getItemIndex","currentIndex","shiftKey","ctrlKey","altKey","metaKey","handleTypeahead","typeaheadBuffer","handleAnchorKeyDown","handleOutsideClick","path","composedPath","includes","handleItemClick","connectedCallback","componentDidLoad","wireAnchor","resolveEffectivePlacement","requestAnimationFrame","positionMenu","updateAnchorAria","morphAnchorFab","addGlobalListeners","updateItemDelays","scheduleFocus","initRovingTabindex","disconnectedCallback","unwireAnchor","removeGlobalListeners","clearTimeout","closeTimer","morphCleanupTimer","iconMorphTimer","typeaheadTimer","resetAnchorFab","onAnchorChange","onPlacementChange","onOpenChange","mdOpen","emit","focusFirstItem","mdClose","resetRovingTabindex","handleFocusIn","index","setAttribute","clearRovingFocusVisible","show","setTimeout","getElementById","addEventListener","removeEventListener","toOpen","icon","colors","style","setProperty","removeAttribute","removeProperty","focus","rect","getBoundingClientRect","spaceAbove","top","spaceBelow","window","innerHeight","bottom","container","shadowRoot","querySelector","isRtl","getComputedStyle","direction","gap","left","right","innerWidth","Array","from","querySelectorAll","direct","indexOf","findIndex","item","getEnabledItems","filter","hasAttribute","forEach","i","String","fn","setRovingFocusVisible","visible","rovingFocusVisible","retries","showRovingFocus","allItems","char","startIndex","len","offset","idx","label","getAttribute","textContent","trim","startsWith","startAnchorTracking","stopAnchorTracking","tick","repositionIfAnchorMoved","r","prev","cancelAnimationFrame","render","h","Host","class","role","id","onKeyDown"],"sources":["src/components/md-fab-menu/md-fab-menu.css?tag=md-fab-menu&encapsulation=shadow","src/components/md-fab-menu/md-fab-menu.tsx"],"sourcesContent":["/* ==========================================================\n   md-fab-menu — Material Design 3 Expressive FAB Menu\n   Spec: https://m3.material.io/components/floating-action-button/specs\n\n   Opens from a FAB to show 2–6 related actions floating on screen.\n   The anchor FAB morphs to a circle with a close icon when open.\n\n   PUBLIC CSS CUSTOM PROPERTIES (override per-instance):\n     --md-fab-menu-item-container-color     Item background (cascades to children)\n     --md-fab-menu-item-label-color         Item label + icon color (cascades)\n     --md-fab-menu-item-gap                  Gap between items (default 4px)\n\n   SLOTS:\n     (default)  md-fab-menu-item elements (2–6 items)\n   ========================================================== */\n\n:host {\n  display: none;\n  position: fixed;\n  inset: 0;\n  z-index: var(--md-sys-z-index-popup, 1000);\n  pointer-events: none;\n}\n\n:host(.md-fab-menu--open),\n:host(.md-fab-menu--closing) {\n  display: block;\n}\n\n/* ==========================================================\n   1. CONTAINER — holds items only (FAB is outside shadow DOM)\n   ========================================================== */\n\n.md-fab-menu__container {\n  position: fixed;\n  display: flex;\n  align-items: end;\n  pointer-events: auto;\n}\n\n/* ── Up: items stack above the FAB ── */\n\n:host(.md-fab-menu--up) .md-fab-menu__container {\n  flex-direction: column;\n}\n\n:host(.md-fab-menu--up) .md-fab-menu__items {\n  display: flex;\n  flex-direction: column-reverse;\n  align-items: end;\n  gap: var(--md-fab-menu-item-gap, var(--md-sys-spacing-gap-xs, 4px));\n}\n\n/* ── Down: items stack below the FAB ── */\n\n:host(.md-fab-menu--down) .md-fab-menu__container {\n  flex-direction: column;\n}\n\n:host(.md-fab-menu--down) .md-fab-menu__items {\n  display: flex;\n  flex-direction: column;\n  align-items: end;\n  gap: var(--md-fab-menu-item-gap, var(--md-sys-spacing-gap-xs, 4px));\n}\n\n/* ==========================================================\n   2. COLOR VARIANTS\n   Item container colors cascade through shadow DOM to children.\n   ========================================================== */\n\n/* ── Primary ── */\n\n:host(.md-fab-menu--primary) {\n  --md-fab-menu-item-container-color: var(--md-sys-color-primary-container);\n  --md-fab-menu-item-label-color: var(--md-sys-color-on-primary-container);\n}\n\n/* ── Secondary ── */\n\n:host(.md-fab-menu--secondary) {\n  --md-fab-menu-item-container-color: var(--md-sys-color-secondary-container);\n  --md-fab-menu-item-label-color: var(--md-sys-color-on-secondary-container);\n}\n\n/* ── Tertiary ── */\n\n:host(.md-fab-menu--tertiary) {\n  --md-fab-menu-item-container-color: var(--md-sys-color-tertiary-container);\n  --md-fab-menu-item-label-color: var(--md-sys-color-on-tertiary-container);\n}\n\n/* ==========================================================\n   3. ANIMATION — scaleY + opacity\n   Open  → emphasized-decelerate (150ms)\n   Close → emphasized-accelerate (150ms)\n   ========================================================== */\n\n.md-fab-menu__container {\n  opacity: 0;\n  transform: scaleY(0.8);\n  transition:\n    opacity var(--md-sys-motion-duration-short3, 150ms) var(--md-sys-motion-easing-emphasized-decelerate, cubic-bezier(0.05, 0.7, 0.1, 1)),\n    transform var(--md-sys-motion-duration-short3, 150ms) var(--md-sys-motion-easing-emphasized-decelerate, cubic-bezier(0.05, 0.7, 0.1, 1));\n}\n\n:host(.md-fab-menu--up) .md-fab-menu__container {\n  transform-origin: bottom right;\n}\n\n:host(.md-fab-menu--down) .md-fab-menu__container {\n  transform-origin: top right;\n}\n\n:host(.md-fab-menu--open) .md-fab-menu__container {\n  opacity: 1;\n  transform: none;\n}\n\n@starting-style {\n  :host(.md-fab-menu--open) .md-fab-menu__container {\n    opacity: 0;\n    transform: scaleY(0.8);\n  }\n}\n\n:host(.md-fab-menu--closing) .md-fab-menu__container {\n  opacity: 0;\n  transform: scaleY(0.8);\n  transition:\n    opacity var(--md-sys-motion-duration-short3, 150ms) var(--md-sys-motion-easing-emphasized-accelerate, cubic-bezier(0.3, 0, 0.8, 0.15)),\n    transform var(--md-sys-motion-duration-short3, 150ms) var(--md-sys-motion-easing-emphasized-accelerate, cubic-bezier(0.3, 0, 0.8, 0.15));\n}\n\n/* ==========================================================\n   4. REDUCED MOTION\n   ========================================================== */\n\n@media (prefers-reduced-motion: reduce) {\n  .md-fab-menu__container,\n  :host(.md-fab-menu--open) .md-fab-menu__container,\n  :host(.md-fab-menu--closing) .md-fab-menu__container {\n    transition: none;\n    opacity: 1;\n    transform: none;\n  }\n}\n\n/* ==========================================================\n   5. FORCED COLORS — Windows High Contrast\n   ========================================================== */\n\n@media (forced-colors: active) {\n  :host {\n    forced-color-adjust: none;\n  }\n}\n\n/* ==========================================================\n   DENSITY (local override)\n   Maps the local `density` prop onto the same --md-sys-density-scale signal a\n   global `data-density` ancestor sets. Declared on :host, so a local rung wins\n   over the inherited global one. Every density-sensitive value in this file\n   derives from that single signal by calc — never add a fixed per-rung ladder.\n   ========================================================== */\n:host([density='-1']) { --md-sys-density-scale: -1; }\n:host([density='-2']) { --md-sys-density-scale: -2; }\n:host([density='-3']) { --md-sys-density-scale: -3; }\n:host([density='-4']) { --md-sys-density-scale: -4; }\n","import { Component, Host, h, Prop, State, Event, EventEmitter, Element, Method, Watch, Listen } from '@stencil/core';\nimport { FabElement } from '../../utils/types';\n\ntype FabMenuFocusableElement = HTMLElement & { rovingFocusVisible?: boolean };\n\nconst CLOSE_ANIMATION_MS = 180;\nconst _ITEM_STAGGER_MS = 50;\nconst MORPH_BACK_MS = 400;\nconst ICON_FADE_MS = 120;\n\nconst VARIANT_COLORS: Record<string, { bg: string; fg: string }> = {\n  primary:   { bg: 'var(--md-sys-color-primary)',   fg: 'var(--md-sys-color-on-primary)' },\n  secondary: { bg: 'var(--md-sys-color-secondary)', fg: 'var(--md-sys-color-on-secondary)' },\n  tertiary:  { bg: 'var(--md-sys-color-tertiary)',  fg: 'var(--md-sys-color-on-tertiary)' },\n};\n\nlet fabMenuIdCounter = 0;\n\n@Component({\n  tag: 'md-fab-menu',\n  styleUrl: 'md-fab-menu.css',\n  shadow: true,\n})\nexport class MdFabMenu {\n  @Element() el!: HTMLElement;\n\n  /** Whether the menu is open. */\n  @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n  /** ID of the anchor FAB element to position relative to. */\n  @Prop() anchor: string = '';\n\n  /**\n   * Color set for the menu.\n   * Controls the FAB's open-state color (vibrant) and item container color (softer).\n   */\n  @Prop({ reflect: true }) variant: 'primary' | 'secondary' | 'tertiary' = 'primary';\n\n  /**\n   * Direction items fan out from the FAB.\n   * - 'up': items stack above the FAB (default, standard bottom-right placement)\n   * - 'down': items stack below the FAB\n   * - 'auto': detect based on available viewport space\n   */\n  @Prop({ reflect: true }) placement: 'up' | 'down' | 'auto' = 'up';\n\n  /** Skip open/close animation. */\n  @Prop() quick: boolean = false;\n\n  /**\n   * Accessible name for the popup itself (the `role=\"menu\"` container).\n   *\n   * A prop rather than a hardcoded string, matching how every other\n   * user-facing string in the library is localised: components stay\n   * i18n-engine-agnostic and the consumer resolves the text from its own\n   * dictionary. The default is English, so a translated app must set it.\n   */\n  @Prop({ attribute: 'menu-label' }) menuLabel: string = 'Actions';\n\n  /**\n   * Local density rung. Drives the same `--md-sys-density-scale` signal that a\n   * global `data-density` ancestor sets, so a local value simply overrides the\n   * inherited one. 0 = default, -4 = ultra-compact.\n   */\n  @Prop({ reflect: true }) density: 0 | -1 | -2 | -3 | -4 = 0;\n\n  /** Fires when the menu opens. */\n  @Event() mdOpen: EventEmitter<void>;\n\n  /** Fires when the menu closes. */\n  @Event() mdClose: EventEmitter<void>;\n\n  @State() private closing = false;\n  @State() private effectivePlacement: 'up' | 'down' = 'up';\n\n  private menuId = `md-fab-menu-${++fabMenuIdCounter}`;\n  private closeTimer?: ReturnType<typeof setTimeout>;\n  private morphCleanupTimer?: ReturnType<typeof setTimeout>;\n  private iconMorphTimer?: ReturnType<typeof setTimeout>;\n  private focusedIndex = -1;\n  /** Set when the anchor is activated via Enter/Space (cleared on pointer down). */\n  private openedViaKeyboard = false;\n  /** True after pointer/mouse down on the anchor until the following click completes. */\n  private pointerActivated = false;\n  /** Whether the anchor already held focus when a pointer activation began — a\n      click on an already-focused FAB moves focus into the menu (like keyboard). */\n  private anchorFocusedAtActivation = false;\n  private savedIcon = '';\n  /** rAF handle for the open-menu anchor tracker (see startAnchorTracking). */\n  private positionRafId: number | null = null;\n  /** Last anchor rect observed by the tracker; reposition only when it changes. */\n  private lastAnchorRect: { top: number; left: number; right: number; bottom: number } | null =\n    null;\n\n  connectedCallback() {\n    this.effectivePlacement = this.placement === 'auto' ? 'up' : this.placement;\n  }\n\n  componentDidLoad() {\n    this.wireAnchor();\n    if (this.open) {\n      this.resolveEffectivePlacement();\n      requestAnimationFrame(() => this.positionMenu());\n      // Initial open=true requires the same anchor-FAB setup that\n      // `@Watch('open')` does on a closed→open transition. Without\n      // morphAnchorFab() here, `savedIcon` would stay '' (its default)\n      // and the next close cycle would write an empty string back\n      // to anchorEl.icon, leaving a blank FAB. We deliberately skip\n      // mdOpen.emit() and the autofocus dance — both are interaction\n      // semantics; this branch is for \"already open at mount\" only.\n      this.updateAnchorAria(true);\n      this.morphAnchorFab(true);\n      this.addGlobalListeners();\n      this.updateItemDelays();\n      this.scheduleFocus(() => this.initRovingTabindex());\n    }\n  }\n\n  disconnectedCallback() {\n    this.unwireAnchor();\n    this.removeGlobalListeners();\n    clearTimeout(this.closeTimer);\n    clearTimeout(this.morphCleanupTimer);\n    clearTimeout(this.iconMorphTimer);\n    clearTimeout(this.typeaheadTimer);\n    this.resetAnchorFab();\n  }\n\n  @Watch('anchor')\n  onAnchorChange() {\n    this.unwireAnchor();\n    this.wireAnchor();\n  }\n\n  @Watch('placement')\n  onPlacementChange() {\n    if (this.placement !== 'auto') {\n      this.effectivePlacement = this.placement;\n    }\n  }\n\n  @Watch('open')\n  onOpenChange(open: boolean) {\n    if (open) {\n      this.resolveEffectivePlacement();\n      requestAnimationFrame(() => this.positionMenu());\n      this.mdOpen.emit();\n      this.updateAnchorAria(true);\n      this.morphAnchorFab(true);\n      this.addGlobalListeners();\n      this.updateItemDelays();\n      if (this.openedViaKeyboard || this.anchorFocusedAtActivation) {\n        this.scheduleFocus(() => this.focusFirstItem(3, true));\n      } else {\n        this.scheduleFocus(() => this.initRovingTabindex());\n      }\n      this.openedViaKeyboard = false;\n      this.anchorFocusedAtActivation = false;\n    } else {\n      this.updateAnchorAria(false);\n      this.morphAnchorFab(false);\n      this.removeGlobalListeners();\n      this.mdClose.emit();\n      this.focusedIndex = -1;\n      this.resetRovingTabindex();\n      this.restoreFocusToAnchor();\n    }\n  }\n\n  @Listen('focusin')\n  handleFocusIn(e: FocusEvent) {\n    if (!this.open) return;\n    const target = e.target as HTMLElement;\n    const items = this.getItems();\n    const index = this.getItemIndex(target, items);\n    if (index >= 0 && index !== this.focusedIndex) {\n      if (this.focusedIndex >= 0 && this.focusedIndex < items.length) {\n        items[this.focusedIndex].setAttribute('tabindex', '-1');\n      }\n      this.focusedIndex = index;\n      target.setAttribute('tabindex', '0');\n    }\n    if (index >= 0) {\n      this.clearRovingFocusVisible(items);\n    }\n  }\n\n  /** Opens the menu programmatically. */\n  @Method()\n  async show() {\n    clearTimeout(this.closeTimer);\n    this.closing = false;\n    this.open = true;\n  }\n\n  /** Closes the menu programmatically. */\n  @Method()\n  async close() {\n    if (!this.open || this.closing) return;\n\n    if (this.quick) {\n      this.open = false;\n      return;\n    }\n\n    this.closing = true;\n    this.closeTimer = setTimeout(() => {\n      this.closing = false;\n      this.open = false;\n    }, CLOSE_ANIMATION_MS);\n  }\n\n  /* ── Anchor wiring ────────────────────────────────────── */\n\n  private getAnchorEl(): HTMLElement | null {\n    return this.anchor ? document.getElementById(this.anchor) : null;\n  }\n\n  private toggleMenu() {\n    if (this.open || this.closing) {\n      this.close();\n    } else {\n      this.show();\n    }\n  }\n\n  private anchorKeyHandler = (e: KeyboardEvent) => {\n    if (e.key !== 'Enter' && e.key !== ' ') return;\n    this.openedViaKeyboard = true;\n\n    const anchorEl = this.getAnchorEl();\n    if (!anchorEl) return;\n\n    // md-fab / md-button synthesize a click — toggle there to avoid double-toggle.\n    const tag = anchorEl.tagName.toLowerCase();\n    if (tag === 'md-fab' || tag === 'md-button' || tag === 'button') return;\n\n    e.preventDefault();\n    e.stopPropagation();\n    this.toggleMenu();\n  };\n\n  /**\n   * Keyboard-synthesized clicks (Enter/Space on buttons) have `detail === 0` and\n   * no preceding pointer event. Capture-phase click runs before inline handlers.\n   */\n  private anchorClickHandler = (e: Event) => {\n    if (!this.pointerActivated && (e as MouseEvent).detail === 0) {\n      this.openedViaKeyboard = true;\n    }\n    this.pointerActivated = false;\n    e.stopPropagation();\n    this.toggleMenu();\n  };\n\n  private anchorPointerHandler = () => {\n    this.pointerActivated = true;\n    this.openedViaKeyboard = false;\n    // Capture focus state BEFORE the click moves focus to the anchor: clicking an\n    // already-focused FAB should land focus on the first menu item; a fresh mouse\n    // click on an unfocused FAB should leave focus on the anchor. activeElement\n    // resolves to the shadow host for custom-element anchors (e.g. md-fab).\n    const anchorEl = this.getAnchorEl();\n    const active = typeof document !== 'undefined' ? document.activeElement : null;\n    this.anchorFocusedAtActivation =\n      !!anchorEl && !!active && (anchorEl === active || anchorEl.contains(active));\n  };\n\n  private wireAnchor() {\n    this.unwireAnchor();\n    if (!this.anchor || typeof document === 'undefined') return;\n    const anchorEl = this.getAnchorEl();\n    if (!anchorEl) return;\n\n    anchorEl.addEventListener('keydown', this.anchorKeyHandler, true);\n    anchorEl.addEventListener('click', this.anchorClickHandler, true);\n    anchorEl.addEventListener('mousedown', this.anchorPointerHandler);\n    anchorEl.addEventListener('pointerdown', this.anchorPointerHandler);\n  }\n\n  private unwireAnchor() {\n    if (!this.anchor || typeof document === 'undefined') return;\n    const anchorEl = this.getAnchorEl();\n    if (!anchorEl) return;\n\n    anchorEl.removeEventListener('keydown', this.anchorKeyHandler, true);\n    anchorEl.removeEventListener('click', this.anchorClickHandler, true);\n    anchorEl.removeEventListener('mousedown', this.anchorPointerHandler);\n    anchorEl.removeEventListener('pointerdown', this.anchorPointerHandler);\n  }\n\n  private updateAnchorAria(open: boolean) {\n    const anchorEl = this.getAnchorEl();\n    if (!anchorEl) return;\n\n    if (open) {\n      anchorEl.setAttribute('aria-expanded', 'true');\n      anchorEl.setAttribute('aria-haspopup', 'menu');\n      anchorEl.setAttribute('aria-controls', this.menuId);\n    } else {\n      anchorEl.setAttribute('aria-expanded', 'false');\n    }\n  }\n\n  /* ── FAB shape-morph (icon + shape + colors) ────────── */\n\n  /**\n   * Morphs the anchor FAB: shape → circle, icon cross-fades to \"close\",\n   * colors → vibrant. Reverse on close.\n   *\n   * Icon cross-fade: fade-out (120ms) → swap icon → fade-in (120ms).\n   */\n  private morphAnchorFab(toOpen: boolean) {\n    const anchorEl = this.getAnchorEl() as FabElement | null;\n    if (!anchorEl) return;\n\n    clearTimeout(this.morphCleanupTimer);\n    clearTimeout(this.iconMorphTimer);\n\n    if (toOpen) {\n      this.savedIcon = anchorEl.icon || '';\n\n      anchorEl.setAttribute('data-shape', 'circle');\n      anchorEl.setAttribute('data-icon-morphing', '');\n\n      const colors = VARIANT_COLORS[this.variant];\n      if (colors) {\n        anchorEl.style.setProperty('--md-fab-container-color', colors.bg);\n        anchorEl.style.setProperty('--md-fab-icon-color', colors.fg);\n      }\n\n      this.iconMorphTimer = setTimeout(() => {\n        anchorEl.icon = 'close';\n        anchorEl.removeAttribute('data-icon-morphing');\n      }, ICON_FADE_MS);\n\n      anchorEl.addEventListener('keydown', this.handleAnchorKeyDown);\n    } else {\n      anchorEl.removeAttribute('data-shape');\n      anchorEl.setAttribute('data-icon-morphing', '');\n\n      anchorEl.style.removeProperty('--md-fab-container-color');\n      anchorEl.style.removeProperty('--md-fab-icon-color');\n\n      this.iconMorphTimer = setTimeout(() => {\n        anchorEl.icon = this.savedIcon;\n        anchorEl.removeAttribute('data-icon-morphing');\n      }, ICON_FADE_MS);\n\n      anchorEl.removeEventListener('keydown', this.handleAnchorKeyDown);\n\n      this.morphCleanupTimer = setTimeout(() => {\n        this.savedIcon = '';\n      }, MORPH_BACK_MS);\n    }\n  }\n\n  private resetAnchorFab() {\n    const anchorEl = this.getAnchorEl() as FabElement | null;\n    if (!anchorEl) return;\n    clearTimeout(this.morphCleanupTimer);\n    clearTimeout(this.iconMorphTimer);\n    anchorEl.removeAttribute('data-shape');\n    anchorEl.removeAttribute('data-icon-morphing');\n    if (this.savedIcon) {\n      anchorEl.icon = this.savedIcon;\n      this.savedIcon = '';\n    }\n    anchorEl.style.removeProperty('--md-fab-container-color');\n    anchorEl.style.removeProperty('--md-fab-icon-color');\n    anchorEl.removeEventListener('keydown', this.handleAnchorKeyDown);\n  }\n\n  private restoreFocusToAnchor() {\n    this.getAnchorEl()?.focus();\n  }\n\n  /* ── Positioning ──────────────────────────────────────── */\n\n  private resolveEffectivePlacement() {\n    if (this.placement !== 'auto') {\n      this.effectivePlacement = this.placement;\n      return;\n    }\n\n    const anchorEl = this.getAnchorEl();\n    if (!anchorEl) {\n      this.effectivePlacement = 'up';\n      return;\n    }\n\n    const rect = anchorEl.getBoundingClientRect();\n    const spaceAbove = rect.top;\n    const spaceBelow = window.innerHeight - rect.bottom;\n    this.effectivePlacement = spaceAbove > spaceBelow ? 'up' : 'down';\n  }\n\n  private positionMenu() {\n    const anchorEl = this.getAnchorEl();\n    const container = this.el.shadowRoot?.querySelector('.md-fab-menu__container') as HTMLElement;\n    if (!anchorEl || !container) return;\n\n    const rect = anchorEl.getBoundingClientRect();\n    const isRtl = getComputedStyle(this.el).direction === 'rtl';\n    const gap = 8;\n\n    if (isRtl) {\n      container.style.left = `${rect.left}px`;\n      container.style.right = '';\n    } else {\n      container.style.right = `${window.innerWidth - rect.right}px`;\n      container.style.left = '';\n    }\n\n    if (this.effectivePlacement === 'up') {\n      container.style.bottom = `${window.innerHeight - rect.top + gap}px`;\n      container.style.top = '';\n    } else {\n      container.style.top = `${rect.bottom + gap}px`;\n      container.style.bottom = '';\n    }\n  }\n\n  /* ── Items ────────────────────────────────────────────── */\n\n  private getItems(): HTMLElement[] {\n    return Array.from(this.el.querySelectorAll('md-fab-menu-item'));\n  }\n\n  private getItemIndex(target: HTMLElement, items: HTMLElement[]): number {\n    const direct = items.indexOf(target);\n    if (direct >= 0) return direct;\n    return items.findIndex(item => item === target || item.contains(target));\n  }\n\n  private getEnabledItems(): HTMLElement[] {\n    return this.getItems().filter(item => !item.hasAttribute('disabled'));\n  }\n\n  private updateItemDelays() {\n    const items = this.getItems();\n    items.forEach((item, i) => {\n      item.style.setProperty('--_fab-menu-item-index', String(i));\n    });\n  }\n\n  /* ── Focus management (roving tabindex) ──────────────── */\n\n  private initRovingTabindex() {\n    const items = this.getItems();\n    items.forEach((item, i) => {\n      item.setAttribute('tabindex', i === 0 ? '0' : '-1');\n    });\n    this.focusedIndex = 0;\n  }\n\n  private resetRovingTabindex() {\n    const items = this.getItems();\n    items.forEach(item => {\n      item.setAttribute('tabindex', '-1');\n    });\n    this.clearRovingFocusVisible(items);\n  }\n\n  private scheduleFocus(fn: () => void) {\n    setTimeout(() => requestAnimationFrame(() => fn()), 0);\n  }\n\n  private setRovingFocusVisible(items: HTMLElement[], index: number, visible: boolean) {\n    items.forEach((item, i) => {\n      (item as FabMenuFocusableElement).rovingFocusVisible = visible && i === index;\n    });\n  }\n\n  private clearRovingFocusVisible(items: HTMLElement[]) {\n    items.forEach(item => {\n      (item as FabMenuFocusableElement).rovingFocusVisible = false;\n    });\n  }\n\n  private focusFirstItem(retries = 3, showRovingFocus = false) {\n    const items = this.getItems();\n    if (items.length) {\n      this.focusItem(items, 0, showRovingFocus);\n    } else if (retries > 0) {\n      this.scheduleFocus(() => this.focusFirstItem(retries - 1, showRovingFocus));\n    }\n  }\n\n  private focusAnchor() {\n    const items = this.getItems();\n    items.forEach(item => {\n      item.setAttribute('tabindex', '-1');\n    });\n    this.clearRovingFocusVisible(items);\n    const anchorEl = this.getAnchorEl();\n    anchorEl?.focus();\n    this.focusedIndex = -1;\n  }\n\n  private focusItem(items: HTMLElement[] | null, index: number, showRovingFocus = true) {\n    const allItems = items ?? this.getItems();\n    if (allItems.length === 0) return;\n\n    if (index < 0) index = allItems.length - 1;\n    if (index >= allItems.length) index = 0;\n\n    if (this.focusedIndex >= 0 && this.focusedIndex < allItems.length) {\n      allItems[this.focusedIndex].setAttribute('tabindex', '-1');\n    }\n\n    this.focusedIndex = index;\n    allItems[index].setAttribute('tabindex', '0');\n    this.setRovingFocusVisible(allItems, index, showRovingFocus);\n    allItems[index].focus();\n  }\n\n  /* ── Keyboard navigation ──────────────────────────────── */\n\n  /**\n   * Handles keyboard events when focus is on menu items.\n   * Bound on Host (not @Listen) so keydown from slotted light-DOM items\n   * reliably reaches the handler in browsers.\n   */\n  private handleKeyDown = (e: KeyboardEvent) => {\n    if (!this.open) return;\n\n    const target = e.target as HTMLElement;\n    if (target && target.closest('md-fab-menu') !== this.el) return;\n\n    const items = this.getItems();\n    if (!items.length) return;\n\n    switch (e.key) {\n      case 'Escape':\n        e.preventDefault();\n        this.close();\n        this.restoreFocusToAnchor();\n        break;\n\n      case 'ArrowUp':\n        e.preventDefault();\n        if (this.effectivePlacement === 'up') {\n          this.focusItem(items, this.focusedIndex + 1);\n        } else {\n          if (this.focusedIndex <= 0) {\n            this.focusAnchor();\n          } else {\n            this.focusItem(items, this.focusedIndex - 1);\n          }\n        }\n        break;\n\n      case 'ArrowDown':\n        e.preventDefault();\n        if (this.effectivePlacement === 'up') {\n          if (this.focusedIndex <= 0) {\n            this.focusAnchor();\n          } else {\n            this.focusItem(items, this.focusedIndex - 1);\n          }\n        } else {\n          this.focusItem(items, this.focusedIndex + 1);\n        }\n        break;\n\n      case 'Home':\n        e.preventDefault();\n        this.focusItem(items, 0);\n        break;\n\n      case 'End':\n        e.preventDefault();\n        this.focusItem(items, items.length - 1);\n        break;\n\n      case 'Tab': {\n        const itemIndex = this.getItemIndex(target, items);\n        const currentIndex = itemIndex >= 0 ? itemIndex : this.focusedIndex;\n\n        if (e.shiftKey) {\n          if (currentIndex <= 0) {\n            e.preventDefault();\n            this.focusAnchor();\n          } else {\n            e.preventDefault();\n            this.focusItem(items, currentIndex - 1, false);\n          }\n        } else if (currentIndex >= items.length - 1) {\n          e.stopPropagation();\n          this.close();\n        } else {\n          e.preventDefault();\n          this.focusItem(items, currentIndex + 1, false);\n        }\n        break;\n      }\n\n      default:\n        if (e.key.length === 1 && !e.ctrlKey && !e.altKey && !e.metaKey) {\n          this.handleTypeahead(items, e.key);\n        }\n        break;\n    }\n  };\n\n  private typeaheadBuffer = '';\n  private typeaheadTimer?: ReturnType<typeof setTimeout>;\n\n  /**\n   * Moves focus to the next item whose label starts with the typed character(s).\n   * Accumulates characters typed within 300ms into a search buffer.\n   */\n  private handleTypeahead(items: HTMLElement[], char: string) {\n    clearTimeout(this.typeaheadTimer);\n    this.typeaheadBuffer += char.toLowerCase();\n    this.typeaheadTimer = setTimeout(() => { this.typeaheadBuffer = ''; }, 300);\n\n    const startIndex = this.focusedIndex >= 0 ? this.focusedIndex : 0;\n    const len = items.length;\n\n    for (let offset = 1; offset <= len; offset++) {\n      const idx = (startIndex + offset) % len;\n      const label = (items[idx].getAttribute('label') || items[idx].textContent || '').trim().toLowerCase();\n      if (label.startsWith(this.typeaheadBuffer)) {\n        this.focusItem(items, idx);\n        return;\n      }\n    }\n  }\n\n  /**\n   * Handles keyboard events when focus is on the anchor FAB (menu is open).\n   */\n  private handleAnchorKeyDown = (e: KeyboardEvent) => {\n    if (!this.open && !this.closing) return;\n\n    switch (e.key) {\n      case 'Escape':\n        e.preventDefault();\n        this.close();\n        break;\n\n      case 'ArrowUp':\n        if (this.effectivePlacement === 'up') {\n          e.preventDefault();\n          this.focusItem(null, 0);\n        }\n        break;\n\n      case 'ArrowDown':\n        if (this.effectivePlacement === 'down') {\n          e.preventDefault();\n          this.focusItem(null, 0);\n        }\n        break;\n\n      case 'Tab':\n        if (!e.shiftKey) {\n          e.preventDefault();\n          this.focusItem(null, 0, false);\n        }\n        break;\n    }\n  };\n\n  /* ── Global event handlers ────────────────────────────── */\n\n  private handleOutsideClick = (e: MouseEvent) => {\n    const path = e.composedPath();\n    const anchorEl = this.getAnchorEl();\n    if (!path.includes(this.el) && (!anchorEl || !path.includes(anchorEl))) {\n      this.close();\n    }\n  };\n\n  private handleItemClick = () => {\n    this.close();\n    this.restoreFocusToAnchor();\n  };\n\n  /**\n   * Keep the open menu glued to the anchor FAB on any layout change. A plain\n   * `scroll`/`resize` listener only fires for window-level events, so it misses\n   * moves that don't resize the window — e.g. dragging a CSS `resize:both`\n   * container, a flex/grid reflow, or an animated ancestor. Following Floating\n   * UI's `autoUpdate({ animationFrame: true })`, we poll the anchor rect each\n   * frame and reposition only when it actually moves. The loop is bounded by the\n   * menu's open lifetime (started in addGlobalListeners, stopped on close).\n   */\n  private startAnchorTracking() {\n    this.stopAnchorTracking();\n    const tick = () => {\n      this.repositionIfAnchorMoved();\n      this.positionRafId = requestAnimationFrame(tick);\n    };\n    this.positionRafId = requestAnimationFrame(tick);\n  }\n\n  /** One tracking frame: reposition only if the anchor rect changed since the last. */\n  private repositionIfAnchorMoved() {\n    const anchorEl = this.getAnchorEl();\n    if (!anchorEl) return;\n    const r = anchorEl.getBoundingClientRect();\n    const prev = this.lastAnchorRect;\n    if (\n      !prev ||\n      prev.top !== r.top ||\n      prev.left !== r.left ||\n      prev.right !== r.right ||\n      prev.bottom !== r.bottom\n    ) {\n      this.lastAnchorRect = { top: r.top, left: r.left, right: r.right, bottom: r.bottom };\n      this.positionMenu();\n    }\n  }\n\n  private stopAnchorTracking() {\n    if (this.positionRafId !== null) {\n      cancelAnimationFrame(this.positionRafId);\n      this.positionRafId = null;\n    }\n    this.lastAnchorRect = null;\n  }\n\n  private addGlobalListeners() {\n    requestAnimationFrame(() => {\n      document.addEventListener('click', this.handleOutsideClick);\n    });\n    this.startAnchorTracking();\n    this.el.addEventListener('mdClick', this.handleItemClick);\n  }\n\n  private removeGlobalListeners() {\n    document.removeEventListener('click', this.handleOutsideClick);\n    this.stopAnchorTracking();\n    this.el.removeEventListener('mdClick', this.handleItemClick);\n  }\n\n  /* ── Render ───────────────────────────────────────────── */\n\n  render() {\n    return (\n      <Host\n        class={{\n          'md-fab-menu': true,\n          'md-fab-menu--open': this.open,\n          'md-fab-menu--closing': this.closing,\n          [`md-fab-menu--${this.variant}`]: true,\n          [`md-fab-menu--${this.effectivePlacement}`]: true,\n        }}\n        role=\"menu\"\n        id={this.menuId}\n        aria-label={this.menuLabel}\n        aria-orientation=\"vertical\"\n        aria-hidden={(!this.open && !this.closing) ? 'true' : 'false'}\n        onKeyDown={this.handleKeyDown}\n      >\n        <div class=\"md-fab-menu__container\">\n          <div class=\"md-fab-menu__items\">\n            <slot></slot>\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/components-csr/md-fab.js

@@ -0,0 +1,2 @@
+import{p as a,H as e,c as s,h as o,d as i,t}from"./p-bSpXNc5J.js";import{t as r}from"./p-DYBUr7K_.js";import{d as n}from"./p-C3vB0Hd9.js";const d=()=>`:host{--_container-color:var(--md-fab-container-color, var(--md-sys-color-primary-container));--_icon-color:var(--md-fab-icon-color, var(--md-sys-color-on-primary-container));--_icon-size:var(--md-fab-icon-size, max(18px, calc(24px + var(--md-sys-density-scale, 0) * 1px)));--_container-shape:var(--md-fab-container-shape, var(--md-sys-shape-corner-large, 16px));--_container-elevation:var(--md-sys-elevation-3);--_state-layer-color:var(--_icon-color);--_morph-spatial-duration:var(--md-sys-motion-spring-spatial-default-duration, 500ms);--_morph-spatial-easing:var(     --md-sys-motion-spring-spatial-default-easing,     cubic-bezier(0.38, 1.21, 0.22, 1)   );--_morph-effects-duration:var(--md-sys-motion-spring-effects-default-duration, 200ms);--_morph-effects-easing:var(     --md-sys-motion-spring-effects-default-easing,     cubic-bezier(0.34, 0.8, 0.34, 1)   );display:inline-flex;align-items:center;justify-content:center;position:relative;overflow:hidden;cursor:pointer;user-select:none;border:none;outline:none;box-sizing:border-box;background-color:var(--_container-color);color:var(--_icon-color);border-radius:var(--_container-shape);box-shadow:var(--_container-elevation);transition:box-shadow 280ms var(--md-sys-motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)),     background-color 280ms var(--md-sys-motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)),     border-radius var(--md-sys-motion-duration-short4, 200ms) var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1)),     color var(--md-sys-motion-duration-short4, 200ms) var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1)),     min-width var(--_morph-spatial-duration) var(--_morph-spatial-easing),     padding-inline-start var(--_morph-spatial-duration) var(--_morph-spatial-easing),     padding-inline-end var(--_morph-spatial-duration) var(--_morph-spatial-easing);-webkit-tap-highlight-color:transparent;vertical-align:middle}:host(:not([data-ready])),:host(:not([data-ready])) .md-fab__label{transition:none}:host([data-shape="circle"]){border-radius:50%}:host(.md-fab--standard){--_icon-size:var(--md-fab-icon-size, max(18px, calc(24px + var(--md-sys-density-scale, 0) * 1px)));width:max(40px, calc(56px + var(--md-sys-density-scale, 0) * 4px));height:max(40px, calc(56px + var(--md-sys-density-scale, 0) * 4px))}:host(.md-fab--medium){--_icon-size:var(--md-fab-icon-size, max(21px, calc(28px + var(--md-sys-density-scale, 0) * 1px)));--_container-shape:var(--md-fab-container-shape, var(--md-sys-shape-corner-extra-large, 28px));width:max(64px, calc(80px + var(--md-sys-density-scale, 0) * 4px));height:max(64px, calc(80px + var(--md-sys-density-scale, 0) * 4px))}:host(.md-fab--large){--_icon-size:var(--md-fab-icon-size, max(27px, calc(36px + var(--md-sys-density-scale, 0) * 1px)));--_container-shape:var(--md-fab-container-shape, var(--md-sys-shape-corner-extra-large, 28px));width:max(80px, calc(96px + var(--md-sys-density-scale, 0) * 4px));height:max(80px, calc(96px + var(--md-sys-density-scale, 0) * 4px))}:host(.md-fab--extended),:host(.md-fab--collapsed){--_icon-size:var(--md-fab-icon-size, max(18px, calc(24px + var(--md-sys-density-scale, 0) * 1px)));height:max(40px, calc(56px + var(--md-sys-density-scale, 0) * 4px));width:auto;padding-inline:max(12px, calc(20px + var(--md-sys-density-scale, 0) * 2px));font-family:var(--md-sys-typescale-label-large-font-family, Roboto, sans-serif);font-size:max(11px, calc(14px + var(--md-sys-density-scale, 0) * 0.5px));font-weight:var(--md-sys-typescale-label-large-font-weight, 500);letter-spacing:var(--md-sys-typescale-label-large-letter-spacing, 0.1px);line-height:var(--md-sys-typescale-label-large-line-height, 20px)}:host(.md-fab--extended){min-width:80px}:host(.md-fab--extended.md-fab--with-icon){padding-inline:var(--md-sys-spacing-inset-lg, 16px) 20px}:host(.md-fab--collapsed){min-width:56px}:host(.md-fab--collapsed.md-fab--with-icon){padding-inline:var(--md-sys-spacing-inset-lg, 16px)}:host(.md-fab--surface){--_container-color:var(--md-fab-container-color, var(--md-sys-color-surface-container-high));--_icon-color:var(--md-fab-icon-color, var(--md-sys-color-primary))}:host(.md-fab--surface.md-fab--lowered){--_container-color:var(--md-fab-container-color, var(--md-sys-color-surface-container-low))}:host(.md-fab--primary-container){--_container-color:var(--md-fab-container-color, var(--md-sys-color-primary-container));--_icon-color:var(--md-fab-icon-color, var(--md-sys-color-on-primary-container))}:host(.md-fab--secondary-container){--_container-color:var(--md-fab-container-color, var(--md-sys-color-secondary-container));--_icon-color:var(--md-fab-icon-color, var(--md-sys-color-on-secondary-container))}:host(.md-fab--tertiary-container){--_container-color:var(--md-fab-container-color, var(--md-sys-color-tertiary-container));--_icon-color:var(--md-fab-icon-color, var(--md-sys-color-on-tertiary-container))}:host(.md-fab--primary){--_container-color:var(--md-fab-container-color, var(--md-sys-color-primary));--_icon-color:var(--md-fab-icon-color, var(--md-sys-color-on-primary))}:host(.md-fab--secondary){--_container-color:var(--md-fab-container-color, var(--md-sys-color-secondary));--_icon-color:var(--md-fab-icon-color, var(--md-sys-color-on-secondary))}:host(.md-fab--tertiary){--_container-color:var(--md-fab-container-color, var(--md-sys-color-tertiary));--_icon-color:var(--md-fab-icon-color, var(--md-sys-color-on-tertiary))}:host(.md-fab--lowered){--_container-elevation:var(--md-sys-elevation-1)}:host(.md-fab--lowered:hover){--_container-elevation:var(--md-sys-elevation-2)}:host(.md-fab--lowered:focus-visible){--_container-elevation:var(--md-sys-elevation-1)}:host(.md-fab--lowered:active){--_container-elevation:var(--md-sys-elevation-1)}:host(:hover){--_container-elevation:var(--md-sys-elevation-4)}:host(:focus-visible){--_container-elevation:var(--md-sys-elevation-3)}:host(:active){--_container-elevation:var(--md-sys-elevation-3)}.md-fab__state-layer{position:absolute;inset:0;border-radius:inherit;background-color:var(--_state-layer-color);opacity:0;transition:opacity 280ms var(--md-sys-motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1));pointer-events:none}:host(:hover) .md-fab__state-layer{opacity:var(--md-sys-state-hover-state-layer-opacity, 0.08)}:host(:focus-visible) .md-fab__state-layer{opacity:var(--md-sys-state-focus-state-layer-opacity, 0.10)}:host(:active) .md-fab__state-layer{opacity:var(--md-sys-state-pressed-state-layer-opacity, 0.10)}:host(:focus-visible){outline:3px solid var(--md-sys-color-secondary);outline-offset:2px}:host(.md-fab--disabled){cursor:default;pointer-events:none;--_container-elevation:var(--md-sys-elevation-0, none) !important;--_container-color:color-mix(in srgb, var(--md-sys-color-on-surface) calc(var(--md-sys-state-disabled-container-opacity, 0.12) * 100%), transparent);--_icon-color:color-mix(in srgb, var(--md-sys-color-on-surface) calc(var(--md-sys-state-disabled-content-opacity, 0.38) * 100%), transparent)}:host([soft-disabled]){cursor:default;pointer-events:auto}:host([soft-disabled]) .md-fab__state-layer{display:none}:host(.md-fab--disabled:hover) .md-fab__state-layer,:host(.md-fab--disabled:active) .md-fab__state-layer,:host(.md-fab--disabled:focus-visible) .md-fab__state-layer{opacity:0}.md-fab__icon{color:var(--md-fab-icon-color, inherit);font-size:var(--_icon-size, 24px);width:var(--_icon-size, 24px);height:var(--_icon-size, 24px);display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:opacity 120ms var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1)),     transform 120ms var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1))}:host([data-icon-morphing]) .md-fab__icon{opacity:0;transform:rotate(-90deg) scale(0.6)}slot[name="icon"]{display:contents}::slotted([slot="icon"]){color:var(--md-fab-icon-color, inherit);width:var(--_icon-size, 24px);height:var(--_icon-size, 24px);display:inline-flex;align-items:center;justify-content:center;line-height:1;flex-shrink:0;transition:opacity 120ms var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1)),     transform 120ms var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1))}:host([data-icon-morphing]) ::slotted([slot="icon"]){opacity:0;transform:rotate(-90deg) scale(0.6)}.md-fab__label{color:var(--md-fab-label-color, inherit);display:flex;align-items:center;white-space:nowrap;overflow:hidden;max-inline-size:var(--_fab-label-w, 240px);opacity:1;transition:max-inline-size var(--_morph-spatial-duration) var(--_morph-spatial-easing),     margin-inline-start var(--_morph-spatial-duration) var(--_morph-spatial-easing),     opacity var(--_morph-effects-duration) var(--_morph-effects-easing)}:host(.md-fab--with-icon) .md-fab__label{margin-inline-start:var(--md-sys-spacing-inset-md, 12px)}:host(.md-fab--collapsed) .md-fab__label{max-inline-size:0;margin-inline-start:0;opacity:0}.material-symbols-outlined{font-family:var(--md-sys-icon-font-family, 'Material Symbols Outlined', 'Material Icons');font-weight:normal;font-style:normal;font-size:var(--_icon-size, 24px);line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;overflow-wrap:normal;direction:ltr;font-feature-settings:'liga';-webkit-font-smoothing:antialiased}@media (prefers-reduced-motion: reduce){:host{transition:none}.md-fab__state-layer{transition:none}}@media (forced-colors: active){:host{border:1px solid ButtonText;background-color:ButtonFace;color:ButtonText;forced-color-adjust:none}:host(:focus-visible){outline-color:Highlight}:host(.md-fab--disabled){border-color:GrayText;color:GrayText;opacity:1}.md-fab__state-layer{display:none}.md-fab__icon,.md-fab__label{color:inherit}}:host([density='-1']){--md-sys-density-scale:-1}:host([density='-2']){--md-sys-density-scale:-2}:host([density='-3']){--md-sys-density-scale:-3}:host([density='-4']){--md-sys-density-scale:-4}`;const c=a(class a extends e{constructor(a){super();if(a!==false){this.__registerHost()}this.__attachShadow();this.mdClick=s(this,"mdClick",7);this.variant="primary-container";this.size="standard";this.disabled=false;this.softDisabled=false;this.lowered=false;this.ripple=true;this.icon="";this.label="";this.density=0;this.hasSlottedIcon=false;this.authoredAccessibleName=false;this.handleClick=a=>{if(this.isDisabled){a.preventDefault();return}this.mdClick.emit(a)};this.handleKeyDown=a=>{if(a.key==="Enter"||a.key===" "){a.preventDefault();if(!this.isDisabled){r(this.el);this.el.click()}}}}get isDisabled(){return this.disabled||this.softDisabled}componentWillLoad(){this.authoredAccessibleName=this.el.hasAttribute("aria-label")||this.el.hasAttribute("aria-labelledby");this.hasSlottedIcon=Array.from(this.el.children).some((a=>a.getAttribute("slot")==="icon"))}componentDidLoad(){const a=this.el.shadowRoot;if(!a)return;const e=a.querySelector('slot[name="icon"]');e?.addEventListener("slotchange",(()=>{this.hasSlottedIcon=e.assignedElements().length>0}));this.measureLabel();requestAnimationFrame((()=>{this.measureLabel();this.el.setAttribute("data-ready","")}));if(typeof document!=="undefined"&&"fonts"in document){document.fonts.ready.then((()=>this.measureLabel()))}if(typeof window!=="undefined"&&window.__STENCIL_DEV_MODE__!==false){this.warnMissingAccessibleName()}}componentDidRender(){this.measureLabel()}onLabelChange(){this.measureLabel()}measureLabel(){const a=this.el.shadowRoot?.querySelector(".md-fab__label");if(a&&a.scrollWidth>0){this.el.style.setProperty("--_fab-label-w",`${a.scrollWidth}px`)}}warnMissingAccessibleName(){if(!this.authoredAccessibleName&&!this.label){console.warn(`[md-fab] WCAG 1.1.1: Icon-only FAB is missing an accessible name. `+`Add aria-label or aria-labelledby to <${this.el.tagName.toLowerCase()}>.`,this.el)}}render(){const a=this.isDisabled;const e=!!this.label;const s=this.extended===undefined?e:this.extended;const t=!!this.icon;const r=this.authoredAccessibleName;return o(i,{key:"fbd2c3ad0b52387a0560e11b68482fe84468390a",class:{"md-fab":true,[`md-fab--${this.variant}`]:true,[`md-fab--${this.size}`]:!e,"md-fab--extended":e&&s,"md-fab--collapsed":e&&!s,"md-fab--with-icon":t||this.hasSlottedIcon,"md-fab--lowered":this.lowered,"md-fab--disabled":this.disabled||this.softDisabled},role:"button","aria-label":e&&!r?this.label:undefined,"aria-disabled":a?"true":"false",tabindex:this.disabled?"-1":"0",onClick:this.handleClick,onKeyDown:this.handleKeyDown},this.ripple&&o("md-ripple",{key:"cb9339ab1f4517d6f1a20e0ab85e8a776ff02d98",disabled:a}),o("span",{key:"7b75ba2f21d7081da580edd470a7ce8a15781532",class:"md-fab__state-layer",part:"state-layer","aria-hidden":"true"}),o("slot",{key:"b2918b686e306493fdb0364322a4667934428b03",name:"icon"},t&&o("span",{key:"7a3bc8d8edfc1a1df416e4fc9799a6d3a8c26217",class:"md-fab__icon material-symbols-outlined",part:"icon","aria-hidden":"true"},this.icon)),e&&o("span",{key:"2256df4b1377109e3f4edd843863c4bcaa3cccb4",class:"md-fab__label",part:"label","aria-hidden":!s?"true":undefined},this.label))}get el(){return this}static get watchers(){return{label:[{onLabelChange:0}]}}static get style(){return d()}},[257,"md-fab",{variant:[1],size:[1],disabled:[516],softDisabled:[516,"soft-disabled"],lowered:[516],ripple:[4],icon:[1],label:[1],extended:[1540],density:[514],hasSlottedIcon:[32]},undefined,{label:[{onLabelChange:0}]}]);function l(){if(typeof customElements==="undefined"){return}const a=["md-fab","md-ripple"];a.forEach((a=>{switch(a){case"md-fab":if(!customElements.get(t(a))){customElements.define(t(a),c)}break;case"md-ripple":if(!customElements.get(t(a))){n()}break}}))}l();const m=c;const h=l;export{m as MdFab,h as defineCustomElement};
+//# sourceMappingURL=md-fab.js.map

package/dist/components-csr/md-fab.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["mdFabCss","MdFab","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","variant","size","disabled","softDisabled","lowered","ripple","icon","label","density","hasSlottedIcon","authoredAccessibleName","handleClick","e","isDisabled","preventDefault","mdClick","emit","handleKeyDown","key","triggerRipple","el","click","componentWillLoad","hasAttribute","Array","from","children","some","c","getAttribute","componentDidLoad","shadow","shadowRoot","iconSlot","querySelector","addEventListener","assignedElements","length","measureLabel","requestAnimationFrame","setAttribute","document","fonts","ready","then","window","__STENCIL_DEV_MODE__","warnMissingAccessibleName","componentDidRender","onLabelChange","scrollWidth","style","setProperty","console","warn","tagName","toLowerCase","render","isEffectivelyDisabled","hasLabel","isExtended","extended","undefined","hasIcon","hasExplicitAriaLabel","h","Host","class","role","tabindex","onClick","onKeyDown","part","name"],"sources":["src/components/md-fab/md-fab.css?tag=md-fab&encapsulation=shadow","src/components/md-fab/md-fab.tsx"],"sourcesContent":["/* ==========================================================\n   md-fab — Material Design 3 Expressive Floating Action Button\n   Spec: https://m3.material.io/components/floating-action-button/specs\n   Extended: https://m3.material.io/components/extended-fab/specs\n\n   PUBLIC CSS CUSTOM PROPERTIES (override per-instance):\n     --md-fab-container-color          Container background\n     --md-fab-icon-color               Icon color\n     --md-fab-icon-size                Icon dimensions\n     --md-fab-container-shape          Border-radius override\n     --md-fab-label-color              Label text color (extended)\n\n   CSS PARTS:\n     state-layer  Hover/press overlay\n     icon         Icon element\n     label        Label text (extended only)\n\n   SLOTS:\n     icon  Custom icon (replaces icon prop)\n   ========================================================== */\n\n:host {\n  --_container-color: var(--md-fab-container-color, var(--md-sys-color-primary-container));\n  --_icon-color: var(--md-fab-icon-color, var(--md-sys-color-on-primary-container));\n  --_icon-size: var(--md-fab-icon-size, max(18px, calc(24px + var(--md-sys-density-scale, 0) * 1px)));\n  --_container-shape: var(--md-fab-container-shape, var(--md-sys-shape-corner-large, 16px));\n  --_container-elevation: var(--md-sys-elevation-3);\n  --_state-layer-color: var(--_icon-color);\n\n  /* M3 Expressive springs for the extended ↔ icon-only morph. Spatial (with\n     overshoot) drives the size/shape change; effects (no overshoot) drives the\n     label fade. */\n  --_morph-spatial-duration: var(--md-sys-motion-spring-spatial-default-duration, 500ms);\n  --_morph-spatial-easing: var(\n    --md-sys-motion-spring-spatial-default-easing,\n    cubic-bezier(0.38, 1.21, 0.22, 1)\n  );\n  --_morph-effects-duration: var(--md-sys-motion-spring-effects-default-duration, 200ms);\n  --_morph-effects-easing: var(\n    --md-sys-motion-spring-effects-default-easing,\n    cubic-bezier(0.34, 0.8, 0.34, 1)\n  );\n\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  position: relative;\n  overflow: hidden;\n  cursor: pointer;\n  user-select: none;\n  border: none;\n  outline: none;\n  box-sizing: border-box;\n  background-color: var(--_container-color);\n  color: var(--_icon-color);\n  border-radius: var(--_container-shape);\n  box-shadow: var(--_container-elevation);\n  transition:\n    box-shadow 280ms var(--md-sys-motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)),\n    background-color 280ms var(--md-sys-motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)),\n    border-radius var(--md-sys-motion-duration-short4, 200ms) var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1)),\n    color var(--md-sys-motion-duration-short4, 200ms) var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1)),\n    min-width var(--_morph-spatial-duration) var(--_morph-spatial-easing),\n    padding-inline-start var(--_morph-spatial-duration) var(--_morph-spatial-easing),\n    padding-inline-end var(--_morph-spatial-duration) var(--_morph-spatial-easing);\n  -webkit-tap-highlight-color: transparent;\n  vertical-align: middle;\n}\n\n/* Suppress transitions until the first paint so the initial extended/collapsed\n   state set by a parent (e.g. the navigation rail) applies without a morph. */\n:host(:not([data-ready])),\n:host(:not([data-ready])) .md-fab__label {\n  transition: none;\n}\n\n/* Shape morph to circle (controlled by md-fab-menu) */\n:host([data-shape=\"circle\"]) {\n  border-radius: 50%;\n}\n\n/* ==========================================================\n   1. SIZES (icon-only FAB)\n   Standard 56px · Medium 80px · Large 96px\n   ========================================================== */\n\n:host(.md-fab--standard) {\n  --_icon-size: var(--md-fab-icon-size, max(18px, calc(24px + var(--md-sys-density-scale, 0) * 1px)));\n  width: max(40px, calc(56px + var(--md-sys-density-scale, 0) * 4px));\n  height: max(40px, calc(56px + var(--md-sys-density-scale, 0) * 4px));\n}\n\n:host(.md-fab--medium) {\n  --_icon-size: var(--md-fab-icon-size, max(21px, calc(28px + var(--md-sys-density-scale, 0) * 1px)));\n  --_container-shape: var(--md-fab-container-shape, var(--md-sys-shape-corner-extra-large, 28px));\n  width: max(64px, calc(80px + var(--md-sys-density-scale, 0) * 4px));\n  height: max(64px, calc(80px + var(--md-sys-density-scale, 0) * 4px));\n}\n\n:host(.md-fab--large) {\n  --_icon-size: var(--md-fab-icon-size, max(27px, calc(36px + var(--md-sys-density-scale, 0) * 1px)));\n  --_container-shape: var(--md-fab-container-shape, var(--md-sys-shape-corner-extra-large, 28px));\n  width: max(80px, calc(96px + var(--md-sys-density-scale, 0) * 4px));\n  height: max(80px, calc(96px + var(--md-sys-density-scale, 0) * 4px));\n}\n\n/* ==========================================================\n   2. EXTENDED FAB (label is set)\n   56px height · auto width · 12px gap\n   With icon:    [16px] icon [12px] label [20px]\n   Without icon: [20px] label [20px]\n   ========================================================== */\n\n/* Shared container for any labelled FAB — both the extended pill and its\n   collapsed icon-only morph target. Width stays `auto` so the container tracks\n   the label as it springs open/closed; the 12px icon→label gap lives on the\n   label's margin (below) so it can collapse too. */\n:host(.md-fab--extended),\n:host(.md-fab--collapsed) {\n  --_icon-size: var(--md-fab-icon-size, max(18px, calc(24px + var(--md-sys-density-scale, 0) * 1px)));\n  height: max(40px, calc(56px + var(--md-sys-density-scale, 0) * 4px));\n  width: auto;\n  padding-inline: max(12px, calc(20px + var(--md-sys-density-scale, 0) * 2px));\n  font-family: var(--md-sys-typescale-label-large-font-family, Roboto, sans-serif);\n  font-size: max(11px, calc(14px + var(--md-sys-density-scale, 0) * 0.5px));\n  font-weight: var(--md-sys-typescale-label-large-font-weight, 500);\n  letter-spacing: var(--md-sys-typescale-label-large-letter-spacing, 0.1px);\n  line-height: var(--md-sys-typescale-label-large-line-height, 20px);\n}\n\n:host(.md-fab--extended) {\n  min-width: 80px;\n}\n\n:host(.md-fab--extended.md-fab--with-icon) {\n  padding-inline: var(--md-sys-spacing-inset-lg, 16px) 20px;\n}\n\n/* Collapsed: shrink to a 56px circle. With the label clipped to 0 (below),\n   symmetric 16px padding centres the 24px icon in 56px. */\n:host(.md-fab--collapsed) {\n  min-width: 56px;\n}\n\n:host(.md-fab--collapsed.md-fab--with-icon) {\n  padding-inline: var(--md-sys-spacing-inset-lg, 16px);\n}\n\n/* ==========================================================\n   3. COLOR VARIANTS\n   ========================================================== */\n\n/* M3's SURFACE FAB — the default in the spec, though this component keeps\n   primary-container as its default for backwards compatibility. Unlike the\n   other variants, surface changes its container colour when `lowered`:\n   surface-container-high at rest, surface-container-low lowered. The icon\n   takes the primary role rather than an `on-*` pairing, because the container\n   is a neutral surface. */\n:host(.md-fab--surface) {\n  --_container-color: var(--md-fab-container-color, var(--md-sys-color-surface-container-high));\n  --_icon-color: var(--md-fab-icon-color, var(--md-sys-color-primary));\n}\n\n:host(.md-fab--surface.md-fab--lowered) {\n  --_container-color: var(--md-fab-container-color, var(--md-sys-color-surface-container-low));\n}\n\n:host(.md-fab--primary-container) {\n  --_container-color: var(--md-fab-container-color, var(--md-sys-color-primary-container));\n  --_icon-color: var(--md-fab-icon-color, var(--md-sys-color-on-primary-container));\n}\n\n:host(.md-fab--secondary-container) {\n  --_container-color: var(--md-fab-container-color, var(--md-sys-color-secondary-container));\n  --_icon-color: var(--md-fab-icon-color, var(--md-sys-color-on-secondary-container));\n}\n\n:host(.md-fab--tertiary-container) {\n  --_container-color: var(--md-fab-container-color, var(--md-sys-color-tertiary-container));\n  --_icon-color: var(--md-fab-icon-color, var(--md-sys-color-on-tertiary-container));\n}\n\n:host(.md-fab--primary) {\n  --_container-color: var(--md-fab-container-color, var(--md-sys-color-primary));\n  --_icon-color: var(--md-fab-icon-color, var(--md-sys-color-on-primary));\n}\n\n:host(.md-fab--secondary) {\n  --_container-color: var(--md-fab-container-color, var(--md-sys-color-secondary));\n  --_icon-color: var(--md-fab-icon-color, var(--md-sys-color-on-secondary));\n}\n\n:host(.md-fab--tertiary) {\n  --_container-color: var(--md-fab-container-color, var(--md-sys-color-tertiary));\n  --_icon-color: var(--md-fab-icon-color, var(--md-sys-color-on-tertiary));\n}\n\n/* ==========================================================\n   4. LOWERED\n   ========================================================== */\n\n:host(.md-fab--lowered) {\n  --_container-elevation: var(--md-sys-elevation-1);\n}\n\n:host(.md-fab--lowered:hover) {\n  --_container-elevation: var(--md-sys-elevation-2);\n}\n\n:host(.md-fab--lowered:focus-visible) {\n  --_container-elevation: var(--md-sys-elevation-1);\n}\n\n:host(.md-fab--lowered:active) {\n  --_container-elevation: var(--md-sys-elevation-1);\n}\n\n/* ==========================================================\n   5. HOVER / FOCUS / PRESS ELEVATION (non-lowered)\n   ========================================================== */\n\n:host(:hover) {\n  --_container-elevation: var(--md-sys-elevation-4);\n}\n\n:host(:focus-visible) {\n  --_container-elevation: var(--md-sys-elevation-3);\n}\n\n:host(:active) {\n  --_container-elevation: var(--md-sys-elevation-3);\n}\n\n/* ==========================================================\n   6. STATE LAYER\n   ========================================================== */\n\n.md-fab__state-layer {\n  position: absolute;\n  inset: 0;\n  border-radius: inherit;\n  background-color: var(--_state-layer-color);\n  opacity: 0;\n  transition: opacity 280ms var(--md-sys-motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1));\n  pointer-events: none;\n}\n\n:host(:hover) .md-fab__state-layer {\n  opacity: var(--md-sys-state-hover-state-layer-opacity, 0.08);\n}\n\n:host(:focus-visible) .md-fab__state-layer {\n  opacity: var(--md-sys-state-focus-state-layer-opacity, 0.10);\n}\n\n:host(:active) .md-fab__state-layer {\n  opacity: var(--md-sys-state-pressed-state-layer-opacity, 0.10);\n}\n\n/* ==========================================================\n   7. FOCUS RING\n   ========================================================== */\n\n:host(:focus-visible) {\n  outline: 3px solid var(--md-sys-color-secondary);\n  outline-offset: 2px;\n}\n\n/* ==========================================================\n   8. DISABLED\n   ========================================================== */\n\n:host(.md-fab--disabled) {\n  cursor: default;\n  pointer-events: none;\n  --_container-elevation: var(--md-sys-elevation-0, none) !important;\n  --_container-color: color-mix(in srgb, var(--md-sys-color-on-surface) calc(var(--md-sys-state-disabled-container-opacity, 0.12) * 100%), transparent);\n  --_icon-color: color-mix(in srgb, var(--md-sys-color-on-surface) calc(var(--md-sys-state-disabled-content-opacity, 0.38) * 100%), transparent);\n}\n\n:host([soft-disabled]) {\n  cursor: default;\n  pointer-events: auto;\n}\n\n:host([soft-disabled]) .md-fab__state-layer { display: none; }\n\n:host(.md-fab--disabled:hover) .md-fab__state-layer,\n:host(.md-fab--disabled:active) .md-fab__state-layer,\n:host(.md-fab--disabled:focus-visible) .md-fab__state-layer {\n  opacity: 0;\n}\n\n/* ==========================================================\n   9. ICON (prop-based fallback inside slot)\n   ========================================================== */\n\n.md-fab__icon {\n  color: var(--md-fab-icon-color, inherit);\n  font-size: var(--_icon-size, 24px);\n  width: var(--_icon-size, 24px);\n  height: var(--_icon-size, 24px);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  flex-shrink: 0;\n  transition:\n    opacity 120ms var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1)),\n    transform 120ms var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1));\n}\n\n:host([data-icon-morphing]) .md-fab__icon {\n  opacity: 0;\n  transform: rotate(-90deg) scale(0.6);\n}\n\n/* ==========================================================\n   10. NAMED ICON SLOT\n   ========================================================== */\n\nslot[name=\"icon\"] {\n  display: contents;\n}\n\n::slotted([slot=\"icon\"]) {\n  color: var(--md-fab-icon-color, inherit);\n  width: var(--_icon-size, 24px);\n  height: var(--_icon-size, 24px);\n  /* Center the glyph inside the slot's sized box. Without these three\n     declarations, an inline-text glyph (emoji, icon-font character) sits at\n     the box's text baseline, producing a visible bottom-left offset on\n     larger sizes (medium / large). The prop-based `.md-fab__icon` already\n     centers via the same flex triple — keep them in lockstep so slotted\n     and prop-based icons render identically. */\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  line-height: 1;\n  flex-shrink: 0;\n  transition:\n    opacity 120ms var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1)),\n    transform 120ms var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1));\n}\n\n:host([data-icon-morphing]) ::slotted([slot=\"icon\"]) {\n  opacity: 0;\n  transform: rotate(-90deg) scale(0.6);\n}\n\n/* ==========================================================\n   11. LABEL (extended FAB)\n   ========================================================== */\n\n.md-fab__label {\n  color: var(--md-fab-label-color, inherit);\n  display: flex;\n  align-items: center;\n  white-space: nowrap;\n  overflow: hidden;\n  /* Natural width measured by the component (fallback covers the first paint\n     before measurement). The container's `auto` width tracks this, so the FAB\n     grows/shrinks with the label. */\n  max-inline-size: var(--_fab-label-w, 240px);\n  opacity: 1;\n  transition:\n    max-inline-size var(--_morph-spatial-duration) var(--_morph-spatial-easing),\n    margin-inline-start var(--_morph-spatial-duration) var(--_morph-spatial-easing),\n    opacity var(--_morph-effects-duration) var(--_morph-effects-easing);\n}\n\n/* The 12px icon→label gap as a margin so it collapses with the label. */\n:host(.md-fab--with-icon) .md-fab__label {\n  margin-inline-start: var(--md-sys-spacing-inset-md, 12px);\n}\n\n/* Collapsed (icon-only) — clip the label to nothing and fade it out. Ordered\n   after the with-icon rule so the margin also collapses. */\n:host(.md-fab--collapsed) .md-fab__label {\n  max-inline-size: 0;\n  margin-inline-start: 0;\n  opacity: 0;\n}\n\n/* ==========================================================\n   12. MATERIAL SYMBOLS (default icon font)\n   ========================================================== */\n\n.material-symbols-outlined {\n  font-family: var(--md-sys-icon-font-family, 'Material Symbols Outlined', 'Material Icons');\n  font-weight: normal;\n  font-style: normal;\n  font-size: var(--_icon-size, 24px);\n  line-height: 1;\n  letter-spacing: normal;\n  text-transform: none;\n  display: inline-block;\n  white-space: nowrap;\n  overflow-wrap: normal;\n  direction: ltr;\n  font-feature-settings: 'liga';\n  -webkit-font-smoothing: antialiased;\n}\n\n/* ==========================================================\n   13. REDUCED MOTION (WCAG 2.3.3 / best practice)\n   ========================================================== */\n\n@media (prefers-reduced-motion: reduce) {\n  :host {\n    transition: none;\n  }\n\n  .md-fab__state-layer {\n    transition: none;\n  }\n}\n\n/* ==========================================================\n   14. FORCED COLORS — Windows High Contrast (WCAG 1.4.11)\n   ========================================================== */\n\n@media (forced-colors: active) {\n  :host {\n    border: 1px solid ButtonText;\n    background-color: ButtonFace;\n    color: ButtonText;\n    forced-color-adjust: none;\n  }\n\n  :host(:focus-visible) {\n    outline-color: Highlight;\n  }\n\n  :host(.md-fab--disabled) {\n    border-color: GrayText;\n    color: GrayText;\n    opacity: 1;\n  }\n\n  .md-fab__state-layer {\n    display: none;\n  }\n\n  .md-fab__icon,\n  .md-fab__label {\n    color: inherit;\n  }\n}\n\n/* ==========================================================\n   DENSITY (local override)\n   Maps the local `density` prop onto the same --md-sys-density-scale signal a\n   global `data-density` ancestor sets. Declared on :host, so a local rung wins\n   over the inherited global one. Every density-sensitive value in this file\n   derives from that single signal by calc — never add a fixed per-rung ladder.\n   ========================================================== */\n:host([density='-1']) { --md-sys-density-scale: -1; }\n:host([density='-2']) { --md-sys-density-scale: -2; }\n:host([density='-3']) { --md-sys-density-scale: -3; }\n:host([density='-4']) { --md-sys-density-scale: -4; }\n","import { Component, Host, h, Prop, State, Watch, Event, EventEmitter, Element } from '@stencil/core';\nimport { triggerRipple } from '../../utils/ripple';\n\n@Component({ tag: 'md-fab', styleUrl: 'md-fab.css', shadow: true })\nexport class MdFab {\n  @Element() el!: HTMLElement;\n\n  @Prop() variant: 'surface' | 'primary-container' | 'secondary-container' | 'tertiary-container' | 'primary' | 'secondary' | 'tertiary' = 'primary-container';\n  @Prop() size: 'standard' | 'medium' | 'large' = 'standard';\n  @Prop({ reflect: true }) disabled: boolean = false;\n  @Prop({ reflect: true, attribute: 'soft-disabled' }) softDisabled: boolean = false;\n  @Prop({ reflect: true }) lowered: boolean = false;\n  @Prop() ripple: boolean = true;\n  @Prop() icon: string = '';\n  @Prop() label: string = '';\n\n  /**\n   * Whether the FAB shows its label (extended) or collapses to an icon-only\n   * circle. Leave unset for the default behaviour (extended whenever a `label`\n   * is provided). Set explicitly — e.g. by `<md-navigation-rail>` on\n   * collapse — to morph between extended and icon-only: the label width/opacity\n   * springs closed and the container shrinks to a 56px circle, while the label\n   * stays available as the accessible name.\n   */\n  @Prop({ reflect: true, mutable: true }) extended?: boolean;\n\n  /**\n   * Local density rung. Drives the same `--md-sys-density-scale` signal that a\n   * global `data-density` ancestor sets, so a local value simply overrides the\n   * inherited one. 0 = default, -4 = ultra-compact.\n   */\n  @Prop({ reflect: true }) density: 0 | -1 | -2 | -3 | -4 = 0;\n\n  /**\n   * Fires when the user activates the FAB (mouse click, touch, or\n   * `Enter`/`Space` while focused). Not emitted when `disabled` or\n   * `soft-disabled`. Bubbles and is composed so a delegated listener\n   * on a parent element works.\n   *\n   * ```ts\n   * document.querySelector('md-fab')!.addEventListener('mdClick', (e) => {\n   *   const mouseEvent = (e as CustomEvent<MouseEvent>).detail;\n   *   console.log('FAB clicked at', mouseEvent.clientX, mouseEvent.clientY);\n   * });\n   * ```\n   */\n  @Event({ bubbles: true, composed: true })\n  mdClick!: EventEmitter<MouseEvent>;\n\n  @State() private hasSlottedIcon = false;\n\n  private get isDisabled() {\n    return this.disabled || this.softDisabled;\n  }\n\n  /**\n   * Whether the CONSUMER supplied an accessible name, captured before the\n   * component ever writes one itself.\n   *\n   * render() used to read `this.el.hasAttribute('aria-label')` directly, but it\n   * also SETS that attribute — so the value was self-referential: the first\n   * render wrote aria-label from `label`, and every render after that saw the\n   * attribute present, concluded the consumer had supplied it, and removed it\n   * again. Any second render silently stripped the accessible name and the WCAG\n   * guard then warned about a name the component had just deleted.\n   */\n  private authoredAccessibleName = false;\n\n  componentWillLoad() {\n    this.authoredAccessibleName =\n      this.el.hasAttribute('aria-label') || this.el.hasAttribute('aria-labelledby');\n\n    // Seed from the authored light DOM. `slotchange` only fires on later\n    // mutations, so a FAB written with its icon in the markup never flipped\n    // `--with-icon` and laid out as if it carried no icon — only FABs whose icon\n    // arrived at runtime were correct.\n    //\n    // Done here rather than in componentDidLoad deliberately: setting @State\n    // after mount forces a SECOND render, and this component's render is not\n    // idempotent — it writes aria-label onto its own host — so an extra pass had\n    // side effects. Seeding before the first render sidesteps that entirely.\n    this.hasSlottedIcon = Array.from(this.el.children).some(\n      (c) => c.getAttribute('slot') === 'icon',\n    );\n  }\n\n  componentDidLoad() {\n    const shadow = this.el.shadowRoot;\n    if (!shadow) return;\n\n    const iconSlot = shadow.querySelector('slot[name=\"icon\"]') as HTMLSlotElement | null;\n    iconSlot?.addEventListener('slotchange', () => {\n      this.hasSlottedIcon = iconSlot.assignedElements().length > 0;\n    });\n\n    this.measureLabel();\n    // Enable transitions only after the first paint so the initial\n    // extended/collapsed state is applied without a mount-time morph, and\n    // re-measure once layout has flushed (componentDidLoad can run before the\n    // label's text has been laid out / fonts applied → scrollWidth 0).\n    requestAnimationFrame(() => {\n      this.measureLabel();\n      this.el.setAttribute('data-ready', '');\n    });\n    // Web fonts (Roboto) can load after first paint and change the label width.\n    if (typeof document !== 'undefined' && 'fonts' in document) {\n      document.fonts.ready.then(() => this.measureLabel());\n    }\n\n    if (\n      typeof window !== 'undefined' &&\n      window.__STENCIL_DEV_MODE__ !== false\n    ) {\n      this.warnMissingAccessibleName();\n    }\n  }\n\n  componentDidRender() {\n    this.measureLabel();\n  }\n\n  @Watch('label')\n  onLabelChange() {\n    this.measureLabel();\n  }\n\n  /**\n   * Record the label's natural width as `--_fab-label-w` so the extended ↔\n   * icon-only morph can spring `max-inline-size` between that exact width and\n   * `0` (a fixed over-large max-width would make the visible reveal finish far\n   * too early). `scrollWidth` reports the full content width even while the\n   * label is clipped to 0, so this stays correct in either state.\n   */\n  private measureLabel() {\n    const label = this.el.shadowRoot?.querySelector('.md-fab__label') as HTMLElement | null;\n    // Guard against 0 (text not yet laid out): never overwrite a good width\n    // with 0, which would collapse the label even while extended.\n    if (label && label.scrollWidth > 0) {\n      this.el.style.setProperty('--_fab-label-w', `${label.scrollWidth}px`);\n    }\n  }\n\n  private warnMissingAccessibleName() {\n    // Uses the AUTHORED flag, not the live attribute: by the time this runs the\n    // component may have written aria-label itself from `label`.\n    if (!this.authoredAccessibleName && !this.label) {\n      console.warn(\n        `[md-fab] WCAG 1.1.1: Icon-only FAB is missing an accessible name. ` +\n        `Add aria-label or aria-labelledby to <${this.el.tagName.toLowerCase()}>.`,\n        this.el,\n      );\n    }\n  }\n\n  private handleClick = (e: MouseEvent) => {\n    if (this.isDisabled) { e.preventDefault(); return; }\n    this.mdClick.emit(e);\n  };\n\n  private handleKeyDown = (e: KeyboardEvent) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      if (!this.isDisabled) {\n        triggerRipple(this.el);\n        this.el.click();\n      }\n    }\n  };\n\n  render() {\n    const isEffectivelyDisabled = this.isDisabled;\n    const hasLabel = !!this.label;\n    // Extended unless explicitly collapsed. Default (prop unset) = extended\n    // whenever a label is present, preserving the original behaviour.\n    const isExtended = this.extended === undefined ? hasLabel : this.extended;\n    const hasIcon = !!this.icon;\n    const hasExplicitAriaLabel = this.authoredAccessibleName;\n\n    return (\n      <Host\n        class={{\n          'md-fab': true,\n          [`md-fab--${this.variant}`]: true,\n          // Fixed circular sizes apply only to FABs that never carry a label.\n          [`md-fab--${this.size}`]: !hasLabel,\n          'md-fab--extended': hasLabel && isExtended,\n          'md-fab--collapsed': hasLabel && !isExtended,\n          'md-fab--with-icon': hasIcon || this.hasSlottedIcon,\n          'md-fab--lowered': this.lowered,\n          'md-fab--disabled': this.disabled || this.softDisabled,\n        }}\n        role=\"button\"\n        aria-label={hasLabel && !hasExplicitAriaLabel ? this.label : undefined}\n        aria-disabled={isEffectivelyDisabled ? 'true' : 'false'}\n        tabindex={this.disabled ? '-1' : '0'}\n        onClick={this.handleClick}\n        onKeyDown={this.handleKeyDown}\n      >\n        {this.ripple && <md-ripple disabled={isEffectivelyDisabled}></md-ripple>}\n        <span class=\"md-fab__state-layer\" part=\"state-layer\" aria-hidden=\"true\"></span>\n        <slot name=\"icon\">\n          {hasIcon && <span class=\"md-fab__icon material-symbols-outlined\" part=\"icon\" aria-hidden=\"true\">{this.icon}</span>}\n        </slot>\n        {hasLabel && <span class=\"md-fab__label\" part=\"label\" aria-hidden={!isExtended ? 'true' : undefined}>{this.label}</span>}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/components-csr/md-icon-button.js

@@ -0,0 +1,2 @@
+import{M as o,d as s}from"./p-R_guULjT.js";const t=o;const p=s;export{t as MdIconButton,p as defineCustomElement};
+//# sourceMappingURL=md-icon-button.js.map

package/dist/components-csr/md-icon-button.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":[],"mappings":"","ignoreList":[]}