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

package/dist/components/md-dialog.js

@@ -1,2 +1,2 @@
-import{p as e,H as i,c as a,h as s,d as t,t as o}from"./p-BR6gfOQH.js";import{d as n}from"./p-BADA63mI.js";import{d}from"./p-B-iHDK5h.js";import{d as l}from"./p-CTC8XAB6.js";const c={close:"Close",cancel:"Cancel",ok:"OK"};const r={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 m(e){const i=e.trim();if(!i)return"en";try{return new Intl.Locale(i).language}catch{return i.split("-")[0].toLowerCase()}}function h(e,i){const a=m(e||"en-US");return r[a]?.[i]??c[i]}const f=()=>`: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 p=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||h(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=b();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=[];u(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)}u(a,e.FOCUSABLE_SELECTOR,i)}))}));const s=new Set;const t=[];for(const e of i){if(t.some((i=>g(e,i))))continue;if(s.has(e))continue;s.add(e);t.push(e)}return t.filter(y)}render(){const e=!!this.icon||this.hasSlottedIcon;const i=!!this.headline||this.hasSlottedHeadline;return s(t,{key:"816d6b7b367160e92cfdc538ae9c27e926b34d37",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:"f9b87cd611013b2f035f1b998096bfe269bebd56",class:"md-dialog__scrim",part:"scrim","aria-hidden":"true",onClick:this.handleScrimClick}),s("div",{key:"75164bab79f10e7e12938a0e7ee47455da863a76",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:"b8c58ea9783e2f2103ed1c397c420e8cde34691e",class:"md-dialog__header",part:"header"},s("button",{key:"3616e77c7a2015676f543f51a50706adf78dd394",class:"md-dialog__close-btn",part:"close-button","aria-label":this.resolvedLabel(this.closeLabel,"close"),onClick:this.handleCloseClick},s("svg",{key:"31691834c13bd2d8f1ef5ad0802fc0c60b5cbe6a",viewBox:"0 0 24 24",width:"24",height:"24",fill:"currentColor","aria-hidden":"true"},s("path",{key:"1bfd05825fb3d3e08ff5a3a0aae5d98d8de691db",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:"cd7b7d8a1884ebd528caf9abda698a9200aff1cd",id:this.headlineId,class:"md-dialog__header-headline",part:"headline"},this.headline),s("slot",{key:"f209a51eafecab18cb634e814ad1f451770ff3df",name:"header-action"})),this.fullscreen&&this.headerDivider&&s("div",{key:"08f82162a0809fe09d9886dc4c51832e0574d818",class:"md-dialog__divider",part:"divider","aria-hidden":"true"}),!this.fullscreen&&s("div",{key:"f0a99ab0d57560889f6b89ecce4b10208dd82073",class:"md-dialog__basic-header",part:"header"},s("slot",{key:"3a8586bd79666137f1a7c0e9b86b5e348d39fdbd",name:"icon"},this.icon&&s("span",{key:"71b6db731e3a73da8bbe65cbc27c26005849df33",class:"md-dialog__icon material-symbols-outlined",part:"icon","aria-hidden":"true"},this.icon)),i&&s("div",{key:"85ac375f2115a8b61a42589ff2b1b9eab88ecbb2",id:this.headlineId,class:"md-dialog__headline",part:"headline"},s("slot",{key:"da1e42bd66df38cf8fe49f7acb83d69ff55b487c",name:"headline"},this.headline))),s("div",{key:"6934f1de19d2f15d2f4eba128f179ecc0ef07753",id:this.contentId,class:"md-dialog__content",part:"content"},s("slot",{key:"c9d669c128d4333081632e067acb5bb77856586e"})),this.divider&&s("div",{key:"a31c0afb54066ddef36841eba4c586cfb5123cb5",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 f()}},[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}]}]);p.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 u(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)u(s,i,a)}))}function b(){let e=document.activeElement;while(e){const i=e.shadowRoot;if(!i||!i.activeElement)break;e=i.activeElement}return e}function g(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 y(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 x(){if(typeof customElements==="undefined"){return}const e=["md-dialog","md-button","md-loading-indicator","md-ripple"];e.forEach((e=>{switch(e){case"md-dialog":if(!customElements.get(o(e))){customElements.define(o(e),p)}break;case"md-button":if(!customElements.get(o(e))){n()}break;case"md-loading-indicator":if(!customElements.get(o(e))){d()}break;case"md-ripple":if(!customElements.get(o(e))){l()}break}}))}x();const v=p;const _=x;export{v as MdDialog,_ as defineCustomElement};
+import{p as e,H as i,c as a,h as s,d as t,t as o}from"./p-BR6gfOQH.js";import{d as n}from"./p-B2fYoYe9.js";import{d as l}from"./p-De3E5Q8v.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/md-dialog.js.map

@@ -1 +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":[]}
+{"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/md-divider.js

@@ -1,2 +1,2 @@
-import{p as i,H as e,h as n,d as t,t as d}from"./p-BR6gfOQH.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 n(t,{key:"236e1e4509cb3cb5aa302b659d2394745595483e",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"},n("div",{key:"53484e39e2a192bd2db2b5140738cbd8be516420",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(d(i))){customElements.define(d(i),s)}break}}))}a();const l=s;const o=a;export{l as MdDivider,o as defineCustomElement};
+import{p as i,H as e,h as d,d as n,t}from"./p-BR6gfOQH.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/md-divider.js.map

@@ -1 +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":"gEAAA,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":[]}
+{"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/md-fab-menu-item.js

@@ -1,2 +1,2 @@
-import{p as e,H as t,c as s,h as a,d as i,t as o}from"./p-BR6gfOQH.js";import{t as n}from"./p-DYBUr7K_.js";import{d as r}from"./p-CTC8XAB6.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:"776acd92b0443f4617576ce6e628c9700daa1d1f",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:"0e1e1379829c42a0730605a6d14ccf082f74bfd7",disabled:t}),a("span",{key:"83d7dfdc10c6389f9819207f2613519bb0ca118b",class:"md-fab-menu-item__state-layer",part:"state-layer","aria-hidden":"true"}),a("slot",{key:"4f5a17c3fcf744501d82e7942d5b0940a9889247",name:"icon"},e&&a("span",{key:"a8e7e1d9025543e67bacfb5b7c8fd8ab4766a657",class:"md-fab-menu-item__icon material-symbols-outlined",part:"icon","aria-hidden":"true"},this.icon)),a("span",{key:"e5fc14ba00df55c92acc7ff3d3024ebe9491afd9",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};
+import{p as e,H as t,c as s,h as a,d as i,t as o}from"./p-BR6gfOQH.js";import{t as n}from"./p-DYBUr7K_.js";import{d as r}from"./p-De3E5Q8v.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/md-fab-menu.js

@@ -1,2 +1,2 @@
-import{p as t,H as s,c as i,h as e,d as n,t as o}from"./p-BR6gfOQH.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:"7d92976fb9210339e957720b632d35cfdff532fe",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:"cc2f3e1a224d69bab705793d8867b4797f342be9",class:"md-fab-menu__container"},e("div",{key:"d43cb6ca7a3668c12118b6ff830152528d876f28",class:"md-fab-menu__items"},e("slot",{key:"6bbc2be30016796f4498734417bf1b711c76d449"}))))}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};
+import{p as t,H as s,c as i,h as e,d as n,t as o}from"./p-BR6gfOQH.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/md-fab.js

@@ -1,2 +1,2 @@
-import{p as a,H as e,c as s,h as o,d as i,t}from"./p-BR6gfOQH.js";import{t as r}from"./p-DYBUr7K_.js";import{d as n}from"./p-CTC8XAB6.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:"9f38d5a63ee3ff8d86b361e83917091a3550a415",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:"5a0114263fe2817f3b7466fc4ec757403e31c203",disabled:a}),o("span",{key:"d4a45e41c4982d48212672e1ae87a3721edaf9b7",class:"md-fab__state-layer",part:"state-layer","aria-hidden":"true"}),o("slot",{key:"dddb0c1469a57e06af7fc9eea94f4acc5a9f5cf8",name:"icon"},t&&o("span",{key:"47d5415adbdfd8629f6efe67c799a59058496f7e",class:"md-fab__icon material-symbols-outlined",part:"icon","aria-hidden":"true"},this.icon)),e&&o("span",{key:"b2cf917ff3886b0adfb909ecde641fc1bd0ce1fd",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 f=l;export{m as MdFab,f as defineCustomElement};
+import{p as a,H as e,c as s,h as o,d as i,t}from"./p-BR6gfOQH.js";import{t as r}from"./p-DYBUr7K_.js";import{d as n}from"./p-De3E5Q8v.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 f=l;export{m as MdFab,f as defineCustomElement};
 //# sourceMappingURL=md-fab.js.map

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

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