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

package/dist/components-csr/md-bar-chart.js

@@ -0,0 +1,2 @@
+import{p as t,H as e,c as i,h as s,d as a,t as o}from"./p-bSpXNc5J.js";import{d as n}from"./p-DfcpeJAu.js";import{d as r}from"./p-uSMrgqAy.js";import{B as h}from"./p-Bx6--dQF.js";import{d as l,a as c,b as d,p as m}from"./p-DvOKnoqK.js";import{n as p,b,a as u}from"./p-C_ogF68H.js";const y=()=>`:host{--_block-size:var(--md-bar-chart-block-size, auto);--_min-block-size:var(--md-bar-chart-min-block-size, max(120px, calc(160px + var(--md-sys-density-scale, 0) * 8px)));--_aspect-ratio:var(--md-bar-chart-aspect-ratio, 16 / 9);--_background:var(--md-bar-chart-background, var(--md-sys-color-surface-container-low, #F7F2FA));--_padding:var(--md-bar-chart-padding, max(8px, calc(16px + var(--md-sys-density-scale, 0) * 2px)));--_shape:var(--md-bar-chart-shape, max(8px, calc(16px + var(--md-sys-density-scale, 0) * 2px)));--_empty-color:var(--md-bar-chart-empty-color, var(--md-sys-color-on-surface-variant, #49454F));--_empty-background:var(--md-bar-chart-empty-background, var(--_background));--_empty-font:var(--md-bar-chart-empty-font, var(--md-sys-typescale-body-medium-font-family, Roboto, sans-serif));--_empty-font-size:var(--md-bar-chart-empty-font-size, var(--md-sys-typescale-body-medium-font-size, 14px));--_empty-icon-size:var(--md-bar-chart-empty-icon-size, 40px);--_zoom-size:var(--md-bar-chart-zoom-size, 28px);--_zoom-track-color:var(--md-bar-chart-zoom-track-color, var(--md-sys-color-surface-container-highest, #E6E0E9));--_zoom-window-color:var(--md-bar-chart-zoom-window-color, var(--md-sys-color-secondary-container, #E8DEF8));--_zoom-handle-color:var(--md-bar-chart-zoom-handle-color, var(--md-sys-color-primary, #6750A4));--_zoom-band-color:var(--md-bar-chart-zoom-band-color, color-mix(in srgb, var(--md-sys-color-primary, #6750A4) 16%, transparent));--_zoom-pan-inset:10px;display:block;position:relative;inline-size:100%;block-size:var(--_block-size);min-block-size:var(--_min-block-size);background:var(--_background);padding:var(--_padding);border-radius:var(--_shape);box-sizing:border-box;aspect-ratio:var(--_aspect-ratio)}.md-bar-chart__header,.md-bar-chart__footer{display:contents}.md-bar-chart__header>slot[name='header']::slotted(*),.md-bar-chart__footer>slot[name='footer']::slotted(*){display:block;margin-block:8px}.md-bar-chart__canvas{position:absolute;inset:var(--_padding);min-block-size:0;min-inline-size:0}:host(.md-bar-chart--zoom-slider) .md-bar-chart__canvas{bottom:calc(var(--_padding) + var(--_zoom-size))}:host(.md-bar-chart--zoom-drag) .md-bar-chart__canvas{cursor:ew-resize}.md-bar-chart__zoom{position:absolute;inset-inline:var(--_padding);bottom:var(--_padding);block-size:var(--_zoom-size);display:flex;align-items:center}.md-bar-chart__zoom-slider{--md-slider-active-color:var(--_zoom-window-color);--md-slider-inactive-color:var(--_zoom-track-color);--md-slider-thumb-color:var(--_zoom-handle-color);--md-slider-thumb-height:var(--_zoom-size);--md-slider-track-height:12px}.md-bar-chart__zoom-pan{position:absolute;inset-block:0;z-index:1;cursor:grab;touch-action:none}.md-bar-chart__zoom-pan:active{cursor:grabbing}.md-bar-chart__zoom-band{position:absolute;background:var(--_zoom-band-color);border-inline:1px solid var(--_zoom-handle-color);pointer-events:none}.md-bar-chart__empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;box-sizing:border-box;padding:24px;background:var(--_empty-background);border-radius:var(--_shape);color:var(--_empty-color);font-family:var(--_empty-font);font-size:var(--_empty-font-size);line-height:var(--md-sys-typescale-body-medium-line-height, 20px);pointer-events:none;text-align:center}.md-bar-chart__loading{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;box-sizing:border-box;padding:24px;background:var(--_empty-background);border-radius:var(--_shape);color:var(--_empty-color);font-family:var(--_empty-font);font-size:var(--_empty-font-size);text-align:center}.md-bar-chart__spinner{inline-size:var(--_empty-icon-size);block-size:var(--_empty-icon-size)}.md-bar-chart__empty ::slotted(.material-symbols-outlined),.md-bar-chart__empty ::slotted(.material-symbols-rounded),.md-bar-chart__empty ::slotted(.material-symbols-sharp),.md-bar-chart__empty ::slotted(.material-icons){font-size:var(--_empty-icon-size) !important;line-height:1;opacity:0.55}.md-bar-chart__a11y-table{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}@media (forced-colors: active){:host{forced-color-adjust:auto}}.md-bar-chart__live{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}[part='legend'] button:focus-visible{outline:3px solid var(--md-sys-color-secondary, #625B71);outline-offset:2px;border-radius:6px}.md-bar-chart__canvas:focus-visible{outline:3px solid var(--md-sys-color-secondary, #625B71);outline-offset:-3px;border-radius:4px}: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 g=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.mdBarClick=i(this,"mdBarClick",7);this.mdLegendClick=i(this,"mdLegendClick",7);this.mdHover=i(this,"mdHover",7);this.mdReady=i(this,"mdReady",7);this.mdZoom=i(this,"mdZoom",7);this.label="";this.titleAlign="start";this.series=[];this.layout="vertical";this.stack="none";this.categoryGap="30%";this.barGap="20%";this.cornerRadius=6;this.legend="top-end";this.tooltip="axis";this.zoom="none";this.locale="";this.noAnimation=false;this.animation="expressive";this.showLabels=false;this.showTotals=false;this.chevron=false;this.polar=false;this.axisTicks=false;this.clickable=false;this.labelZoomStart="Zoom range start";this.labelZoomEnd="Zoom range end";this.labelPlot="Chart data. Use the arrow keys to move between points, Home and End for the first and last, Escape to leave.";this.labelPoint="%x%: %values%";this.loading=false;this.loadingLabel="Loading chart…";this.density=0;this.mounted=false;this.kbIndex=-1;this.announcement="";this.zoomWin=null;this.dragBand=null;this.grab=null;this.engine=null;this.applyQueued=false;this.ro=null;this.legendHidden=new Map;this.bindChartHost=t=>{this.chartHost=t};this.bindA11yTableHost=t=>{this.a11yTableHost=t};this.onPlotPointerDown=t=>{if(!this.zoomInside||t.button!==0||this.grab)return;if(!this.insidePlot(t))return;const e=this.hostX(t);this.grab={id:t.pointerId,kind:"band",x:e,win:this.win()};this.dragBand={x1:e,x2:e};const i=t.composedPath?.()[0]??t.target;i.setPointerCapture?.(t.pointerId)};this.onPointerMove=t=>{const e=this.grab;if(!e||e.id!==t.pointerId)return;if(e.kind==="band"){const i=this.plotRect();if(!i)return;this.dragBand={x1:e.x,x2:Math.min(Math.max(this.hostX(t),i.x),i.x+i.width)};return}const i=this.trackFrac(t.clientX);const s=this.trackFrac(e.x);if(i==null||s==null)return;const a=Math.max(1,this.dataLength()-1);const o=e.win.end-e.win.start;const n=Math.round((i-s)*a);const r=Math.min(Math.max(0,e.win.start+n),a-o);this.applyZoom(r,r+o)};this.onPointerUp=t=>{const e=this.grab;if(!e||e.id!==t.pointerId)return;this.grab=null;const i=this.dragBand;this.dragBand=null;if(e.kind!=="band"||!i)return;if(Math.abs(i.x2-i.x1)<8)return;const[s,a]=[this.indexAtX(i.x1),this.indexAtX(i.x2)].sort(((t,e)=>t-e));if(a-s>=1)this.applyZoom(s,a)};this.onPlotDblClick=t=>{if(this.zoomInside&&this.zoomWin&&this.insidePlot(t))this.resetZoom()};this.onZoomPanDown=t=>{if(t.button!==0)return;t.stopPropagation();t.preventDefault();this.grab={id:t.pointerId,kind:"pan",x:t.clientX,win:this.win()};t.target.setPointerCapture?.(t.pointerId)};this.onZoomSliderInput=t=>{t.stopPropagation();const{valueStart:e,valueEnd:i}=t.detail??{};if(e==null||i==null)return;this.applyZoom(e,i)};this.onZoomSliderEvent=t=>t.stopPropagation();this.onPlotKeyDown=t=>{const e=this.engine?.getScene();const i=Math.max(0,(e?.xPositions.length??0)-1);if(!e||i<0)return;const s=typeof getComputedStyle==="function"&&getComputedStyle(this.el).direction==="rtl";const a=s?"ArrowLeft":"ArrowRight";const o=s?"ArrowRight":"ArrowLeft";let n=this.kbIndex;switch(t.key){case a:n=this.kbIndex<0?0:Math.min(i,this.kbIndex+1);break;case o:n=this.kbIndex<0?i:Math.max(0,this.kbIndex-1);break;case"Home":n=0;break;case"End":n=i;break;case"Escape":if(this.kbIndex<0)return;n=-1;break;case"Enter":case" ":case"Spacebar":if(this.kbIndex<0)return;t.preventDefault();this.emitBarClickForCategory(this.kbIndex,t);return;default:return}t.preventDefault();this.moveKeyboardCursor(n)};this.onPlotBlur=()=>{if(this.kbIndex>=0)this.moveKeyboardCursor(-1)}}seriesKeys(){const t=new Map;return this.series.map(((e,i)=>{const s=e.id!=null?`id:${e.id}`:e.label!=null?`label:${e.label}`:`pos:${i}`;const a=t.get(s)??0;t.set(s,a+1);return a===0?s:`${s}#${a}`}))}rememberLegendToggle(t,e){const i=this.seriesKeys()[t];if(i==null)return;this.legendHidden.set(i,e);if(this.legendHidden.size>256){const t=this.legendHidden.keys().next().value;this.legendHidden.delete(t)}}componentDidLoad(){this.initChart();if(typeof window!=="undefined"&&window.matchMedia){this.themeMql=window.matchMedia("(prefers-color-scheme: dark)");this.themeListener=()=>this.applyEngine();this.themeMql.addEventListener?.("change",this.themeListener)}}disconnectedCallback(){this.ro?.disconnect();this.ro=null;this.engine?.dispose();this.engine=null;if(this.themeMql&&this.themeListener){this.themeMql.removeEventListener?.("change",this.themeListener);this.themeListener=undefined;this.themeMql=undefined}}onAnyPropChange(){if(this.applyQueued)return;this.applyQueued=true;queueMicrotask((()=>{this.applyQueued=false;this.applyEngine();this.rebuildA11yTable()}))}async resize(){this.engine?.resize()}onLoadingChange(t,e){if(e&&!t)this.engine?.replay()}async replay(){this.engine?.replay()}async drill(t,e="down"){this.engine?.drill(t,e)}async toDataURL(){return this.engine?.toDataURL("image/png")??""}async getInstance(){return this.engine}initChart(){this.makeEngine();this.applyEngine();this.rebuildA11yTable();this.mounted=true;this.mdReady.emit()}makeEngine(){if(!this.chartHost)return;this.ro?.disconnect();this.ro=null;this.engine?.dispose();try{this.engine=new h(this.chartHost)}catch{this.engine=null}if(this.engine&&typeof ResizeObserver!=="undefined"){this.ro=new ResizeObserver((()=>this.engine?.resize()));this.ro.observe(this.chartHost)}}parseRatio(t,e){if(typeof t==="number")return Number.isFinite(t)?t>1?t/100:t:e;const i=parseFloat(t);if(!Number.isFinite(i))return e;return t.trim().endsWith("%")||i>1?i/100:i}buildEngineTheme(t){return{background:t.background,textColor:t.textColor,textColorMuted:t.textColorMuted,axisLineColor:t.axisLineColor,gridLineColor:t.gridColor,surface:t.surface,fontFamily:t.fontFamily,labelSize:t.labelSize,titleSize:t.titleSize}}get zoomInside(){return!this.polar&&(this.zoom==="inside"||this.zoom==="both")}get zoomSliderOn(){return!this.polar&&(this.zoom==="slider"||this.zoom==="both")}dataLength(){const t=(this.series??[]).reduce(((t,e)=>Math.max(t,e?.data?.length??0)),0);return Math.max(t,this.xAxis?.data?.length??0)}winStart(){return this.zoomWin&&!this.polar?this.win().start:0}win(){const t=Math.max(0,this.dataLength()-1);const e=this.zoomWin;if(!e)return{start:0,end:t};const i=Math.min(Math.max(0,e.start),Math.max(0,t-1));return{start:i,end:Math.min(Math.max(i+1,e.end),t)}}applyZoom(t,e,i=false){const s=Math.max(0,this.dataLength()-1);const a=Math.min(Math.max(0,Math.round(t)),Math.max(0,s-1));const o=Math.min(Math.max(a+1,Math.round(e)),s);this.zoomWin=i?null:{start:a,end:o};this.applyEngine(true);this.rebuildA11yTable();this.mdZoom.emit({startIndex:i?0:a,endIndex:i?s:o,reset:i})}async setZoom(t,e){this.applyZoom(t,e)}async resetZoom(){this.applyZoom(0,0,true)}plotRect(){const t=this.engine?.getScene()?.plot;return t?{x:t.x,y:t.y,width:t.width,height:t.height}:null}canvasOffset(){const t=this.chartHost;if(!t)return{x:0,y:0};const e=this.el.getBoundingClientRect();const i=t.getBoundingClientRect();return{x:i.left-e.left,y:i.top-e.top}}zoomBandStyle(){const t=this.plotRect();if(!this.dragBand||!t)return undefined;const e=this.canvasOffset();const{x1:i,x2:s}=this.dragBand;return{left:`${e.x+Math.min(i,s)}px`,width:`${Math.abs(s-i)}px`,top:`${e.y+t.y}px`,height:`${t.height}px`}}hostX(t){return t.clientX-(this.chartHost??this.el).getBoundingClientRect().left}indexAtX(t){const e=this.engine?.getScene();const i=this.win();const s=e?.xPositions;if(!s?.length)return i.start;let a=0;let o=Infinity;s.forEach(((e,i)=>{const s=Math.abs(e-t);if(s<o){o=s;a=i}}));return i.start+a}insidePlot(t){const e=this.plotRect();if(!e)return false;const i=(this.chartHost??this.el).getBoundingClientRect();const s=t.clientX-i.left;const a=t.clientY-i.top;return s>=e.x&&s<=e.x+e.width&&a>=e.y&&a<=e.y+e.height}sliderTrackRect(){const t=this.el.shadowRoot?.querySelector(".md-bar-chart__zoom-slider");if(!t)return null;const e=t.getBoundingClientRect();if(!e.width)return null;return{left:e.left,width:e.width,rtl:getComputedStyle(this.el).direction==="rtl"}}trackFrac(t){const e=this.sliderTrackRect();if(!e)return null;const i=(t-e.left)/e.width;return Math.min(Math.max(e.rtl?1-i:i,0),1)}renderZoomSlider(){const t=Math.max(1,this.dataLength()-1);const e=this.win();const i=e=>e/t*100;const a=t=>String(this.xAxis?.data?.[t]??t);return s("div",{class:"md-bar-chart__zoom",part:"zoom"},s("md-slider",{class:"md-bar-chart__zoom-slider",part:"zoom-slider",exportparts:"track: zoom-track, track-active: zoom-window, thumb-knob: zoom-handle",range:true,controlled:true,min:0,max:t,step:1,valueStart:e.start,valueEnd:e.end,ariaLabelStart:this.labelZoomStart,ariaLabelEnd:this.labelZoomEnd,valueStartText:a(e.start),valueEndText:a(e.end),onMdInput:this.onZoomSliderInput,onMdChange:this.onZoomSliderEvent,onMdDragStart:this.onZoomSliderEvent,onMdDragEnd:this.onZoomSliderEvent,onMdFocus:this.onZoomSliderEvent,onMdBlur:this.onZoomSliderEvent}),s("div",{class:"md-bar-chart__zoom-pan",part:"zoom-pan",style:{insetInlineStart:`calc(${i(e.start)}% + var(--_zoom-pan-inset))`,inlineSize:`max(0px, calc(${i(e.end)-i(e.start)}% - 2 * var(--_zoom-pan-inset)))`},onPointerDown:this.onZoomPanDown}))}buildSpec(t){const e=this.stack==="percentage";const i=t=>this.valueFormatter?this.valueFormatter(t):t.toLocaleString(this.locale||undefined);const s=this.seriesKeys();const a=this.zoomWin&&!this.polar?this.win():null;const o=t=>t?a?t.slice(a.start,a.end+1):t.slice():undefined;const n=t=>{if(!t||!a)return t;const e={};for(const[i,s]of Object.entries(t)){const t=Number(i)-a.start;if(t>=0&&t<=a.end-a.start)e[t]=s}return e};return{series:this.series.map(((e,i)=>{let a;if(e.pointColors){const s={};for(const[a,o]of Object.entries(e.pointColors))s[Number(a)]=c(this.el,o,m(t.palette,i));a=n(s)}return{label:e.label??`Series ${i+1}`,color:c(this.el,e.color,m(t.palette,i)),data:o(e.data)??[],hidden:e.hidden??this.legendHidden.get(s[i])??false,stack:e.stack,axisIndex:e.yAxisIndex,overlay:e.overlay,widthRatio:e.widthRatio,pointWidths:n(e.pointWidths),range:o(e.range)?.map(p),pointColors:a}})),title:this.label||undefined,subtitle:this.subtitle||undefined,titleAlign:this.titleAlign,categories:o(this.xAxis?.data)??[],categoryFormatter:this.xAxis?.valueFormatter??l,categoryLabelRotation:this.xAxis?.labelRotation,categoryLabelsMirrored:this.xAxis?.mirrorLabels,valueAxis2:this.yAxis2?{min:this.yAxis2.min,max:this.yAxis2.max,label:this.yAxis2.label,formatter:this.yAxis2.valueFormatter?t=>String(this.yAxis2.valueFormatter(t)):undefined,hidden:this.yAxis2.hidden}:undefined,valueTickFormatter:this.yAxis?.valueFormatter?t=>String(this.yAxis.valueFormatter(t)):undefined,categoryLabel:this.xAxis?.label,categoryHidden:this.xAxis?.hidden,categoryHideTicks:this.xAxis?.hideTicks,categoryAxisLine:this.xAxis?.axisLine,categoryDash:this.xAxis?.dash,valueScale:this.yAxis?.scale??"value",valueBreaks:(this.layout==="horizontal"?this.xAxis:this.yAxis)?.breaks,valueMin:e?0:this.yAxis?.min,valueMax:e?100:this.yAxis?.max,valueFormatter:e?t=>`${Math.round(t)}%`:i,valueLabel:this.yAxis?.label,valueHidden:this.yAxis?.hidden,valueHideTicks:this.yAxis?.hideTicks,valueAxisLine:this.yAxis?.axisLine,valueDash:this.yAxis?.dash,valueGridDash:this.yAxis?.gridDash,stack:this.stack,horizontal:this.layout==="horizontal",categoryGapRatio:this.parseRatio(this.categoryGap,.3),barGapRatio:this.parseRatio(this.barGap,.2),barWidth:this.barWidth,cornerRadius:this.cornerRadius,showLabels:this.showLabels,showTotals:this.showTotals,chevron:this.chevron,polar:this.polar,polarHole:this.polarHole,polarSweep:this.polarSweep,legend:this.legend,axisTicks:this.axisTicks,animation:this.noAnimation?"none":this.animation,animationDuration:this.animationDuration}}applyEngine(t=false){if(!this.engine)return;const e=d(this.el);this.engine.setSpec(this.buildSpec(e),this.buildEngineTheme(e),{onHover:t=>{if(t<0)return;const e=t+this.winStart();this.mdHover.emit({dataIndex:e,axisValue:this.xAxis?.data?.[e],seriesIndices:this.visibleSeriesIndices()})},onLegendClick:t=>{this.rememberLegendToggle(t.seriesIndex,!!t.hidden);this.mdLegendClick.emit({seriesIndex:t.seriesIndex,seriesId:this.series[t.seriesIndex]?.id,selected:!t.hidden})},onPointClick:(t,e,i)=>{const s=this.series[t];if(!s)return;const a=e+this.winStart();this.mdBarClick.emit({seriesIndex:t,seriesId:s.id,dataIndex:a,value:s.data?.[a]??null,axisValue:this.xAxis?.data?.[a],nativeEvent:i,series:s})}},{animate:!t});this.engine.setHoverEnabled(this.tooltip!=="none");this.engine.setClickable(this.clickable);this.engine.setTooltip({render:this.tooltipRenderer,missingFormatter:this.valueFormatter})}visibleSeriesIndices(){const t=this.engine?.getScene()?.hoverPoints;if(t)return t.map((t=>t.seriesIndex));return this.series.map(((t,e)=>e)).filter((t=>!this.series[t].hidden))}rebuildA11yTable(){if(!this.a11yTableHost)return;this.a11yTableHost.innerHTML=b({title:this.label,xAxisLabel:this.xAxis?.label,xAxisData:this.xAxis?.data,xValueFormatter:this.xAxis?.valueFormatter??(t=>l(t,this.locale)),locale:this.locale,series:this.series,valueFormatter:this.valueFormatter})}emitBarClickForCategory(t,e){const i=this.visibleSeriesIndices()[0]??0;const s=this.series[i];if(!s)return;const a=t+this.winStart();this.mdBarClick.emit({seriesIndex:i,seriesId:s.id,dataIndex:a,value:s.data?.[a]??null,axisValue:this.xAxis?.data?.[a],nativeEvent:e,series:s})}moveKeyboardCursor(t){this.kbIndex=t;this.engine?.focusIndex(t);if(t<0){this.announcement="";return}const e=this.engine?.getScene();const i=e?.xLabels?.[t]??String(t+1);const s=t=>this.valueFormatter?this.valueFormatter(t):t.toLocaleString(this.locale||undefined);const a=(e?.hoverPoints??[]).map((e=>{const i=e.byIndex[t];return i?`${e.label} ${s(i.value)}`:null})).filter(Boolean).join(", ");this.announcement=this.labelPoint.replace("%x%",i).replace("%values%",a)}render(){const t=this.xAxis?.data??[];const e=u({title:this.label,chartType:"bar",seriesCount:this.series.length,xMin:t[0],xMax:t[t.length-1]});const i=this.series.length===0&&!this.loading;return s(a,{key:"f535a5ceb5ac843c5415093faf58c129f4b55d24",class:{"md-bar-chart":true,"md-bar-chart--empty":i,"md-bar-chart--loading":this.loading,"md-bar-chart--mounted":this.mounted,"md-bar-chart--zoom-slider":this.zoomSliderOn,"md-bar-chart--zoom-drag":this.zoomInside,[`md-bar-chart--${this.layout}`]:true},role:"figure","aria-label":e,"aria-busy":this.loading?"true":null,style:this.heightProp?{blockSize:this.heightProp}:undefined,onPointerDown:this.onPlotPointerDown,onPointerMove:this.onPointerMove,onPointerUp:this.onPointerUp,onPointerCancel:this.onPointerUp,onDblClick:this.onPlotDblClick},s("header",{key:"a56de64118eacdcce86a58d61b3e08ce1ffe5858",class:"md-bar-chart__header",part:"header"},s("slot",{key:"f6ca05ffbdb07279d103adc3e79395cebf2fcc62",name:"header"})),s("div",{key:"16d38bd35ddef6f48c6748bdbe9285681a9a5091",class:"md-bar-chart__canvas",part:"canvas",ref:t=>this.bindChartHost(t),tabindex:i?undefined:"0",role:i?undefined:"application","aria-label":i?undefined:this.labelPlot,onKeyDown:this.onPlotKeyDown,onBlur:this.onPlotBlur}),i&&s("div",{key:"d63918dfde5234203ebe21be413011bd77787b15",class:"md-bar-chart__empty",part:"empty"},s("slot",{key:"8fd2db209115817c725c2461b29e9ec2c6509f92",name:"empty"},"No data to display")),this.loading&&s("div",{key:"44f3f2347bde451c61025a8c050d2e263a3f6e3e",class:"md-bar-chart__loading",part:"loading",role:"status"},s("slot",{key:"7137288cd3456cb926569963238ab481b1a981ce",name:"loader"},s("slot",{key:"d2fea29b0fb087763fda403882c982115bba460d",name:"loading"},s("md-progress-indicator",{key:"4ecd5e96bc396b49574ac81539983880d2690f27",class:"md-bar-chart__spinner",variant:"circular",indeterminate:true,label:this.loadingLabel}),s("span",{key:"5922c3146b595840b452ed479d9590eb323a2118",class:"md-bar-chart__loading-text"},this.loadingLabel)))),this.dragBand&&Math.abs(this.dragBand.x2-this.dragBand.x1)>1&&s("div",{key:"1c1d3b22ce4c53fe0273525a35806b105ee798c1",class:"md-bar-chart__zoom-band",part:"zoom-band",style:this.zoomBandStyle()}),this.zoomSliderOn&&this.renderZoomSlider(),s("footer",{key:"c6ef361aaff6269136da37ec7c5d26d27410b52c",class:"md-bar-chart__footer",part:"footer"},s("slot",{key:"3ad5106449977ae89b7e3be3f3eb7ac7e300a65b",name:"footer"})),s("div",{key:"c05f67cd4b89a188d6e3decc2689c0f8b3698264",class:"md-bar-chart__a11y-table",ref:t=>this.bindA11yTableHost(t)}),s("div",{key:"869b2143b2cc1c9dc27f63cfcb5ac41eae575242",class:"md-bar-chart__live",role:"status","aria-live":"polite","aria-atomic":"true"},this.announcement))}get el(){return this}static get watchers(){return{series:[{onAnyPropChange:0}],xAxis:[{onAnyPropChange:0}],yAxis:[{onAnyPropChange:0}],yAxis2:[{onAnyPropChange:0}],layout:[{onAnyPropChange:0}],stack:[{onAnyPropChange:0}],categoryGap:[{onAnyPropChange:0}],barGap:[{onAnyPropChange:0}],barWidth:[{onAnyPropChange:0}],cornerRadius:[{onAnyPropChange:0}],legend:[{onAnyPropChange:0}],tooltip:[{onAnyPropChange:0}],zoom:[{onAnyPropChange:0}],label:[{onAnyPropChange:0}],subtitle:[{onAnyPropChange:0}],titleAlign:[{onAnyPropChange:0}],showLabels:[{onAnyPropChange:0}],showTotals:[{onAnyPropChange:0}],chevron:[{onAnyPropChange:0}],polar:[{onAnyPropChange:0}],polarHole:[{onAnyPropChange:0}],polarSweep:[{onAnyPropChange:0}],axisTicks:[{onAnyPropChange:0}],animation:[{onAnyPropChange:0}],animationDuration:[{onAnyPropChange:0}],tooltipRenderer:[{onAnyPropChange:0}],valueFormatter:[{onAnyPropChange:0}],locale:[{onAnyPropChange:0}],noAnimation:[{onAnyPropChange:0}],clickable:[{onAnyPropChange:0}],loading:[{onLoadingChange:0}]}}static get style(){return y()}},[257,"md-bar-chart",{label:[1],subtitle:[1],titleAlign:[1,"title-align"],series:[16],xAxis:[16],yAxis:[16],yAxis2:[16],layout:[513],stack:[1],categoryGap:[8,"category-gap"],barGap:[8,"bar-gap"],barWidth:[2,"bar-width"],cornerRadius:[2,"corner-radius"],legend:[513],tooltip:[1],zoom:[1],locale:[1],valueFormatter:[16],tooltipRenderer:[16],heightProp:[1,"height"],noAnimation:[4,"no-animation"],animation:[1],animationDuration:[2,"animation-duration"],showLabels:[4,"show-labels"],showTotals:[4,"show-totals"],chevron:[4],polar:[516],polarHole:[2,"polar-hole"],polarSweep:[2,"polar-sweep"],axisTicks:[4,"axis-ticks"],clickable:[4],labelZoomStart:[1,"label-zoom-start"],labelZoomEnd:[1,"label-zoom-end"],labelPlot:[1,"label-plot"],labelPoint:[1,"label-point"],loading:[516],loadingLabel:[1,"loading-label"],density:[514],mounted:[32],kbIndex:[32],announcement:[32],zoomWin:[32],dragBand:[32],resize:[64],replay:[64],drill:[64],toDataURL:[64],getInstance:[64],setZoom:[64],resetZoom:[64]},undefined,{series:[{onAnyPropChange:0}],xAxis:[{onAnyPropChange:0}],yAxis:[{onAnyPropChange:0}],yAxis2:[{onAnyPropChange:0}],layout:[{onAnyPropChange:0}],stack:[{onAnyPropChange:0}],categoryGap:[{onAnyPropChange:0}],barGap:[{onAnyPropChange:0}],barWidth:[{onAnyPropChange:0}],cornerRadius:[{onAnyPropChange:0}],legend:[{onAnyPropChange:0}],tooltip:[{onAnyPropChange:0}],zoom:[{onAnyPropChange:0}],label:[{onAnyPropChange:0}],subtitle:[{onAnyPropChange:0}],titleAlign:[{onAnyPropChange:0}],showLabels:[{onAnyPropChange:0}],showTotals:[{onAnyPropChange:0}],chevron:[{onAnyPropChange:0}],polar:[{onAnyPropChange:0}],polarHole:[{onAnyPropChange:0}],polarSweep:[{onAnyPropChange:0}],axisTicks:[{onAnyPropChange:0}],animation:[{onAnyPropChange:0}],animationDuration:[{onAnyPropChange:0}],tooltipRenderer:[{onAnyPropChange:0}],valueFormatter:[{onAnyPropChange:0}],locale:[{onAnyPropChange:0}],noAnimation:[{onAnyPropChange:0}],clickable:[{onAnyPropChange:0}],loading:[{onLoadingChange:0}]}]);function f(){if(typeof customElements==="undefined"){return}const t=["md-bar-chart","md-progress-indicator","md-slider"];t.forEach((t=>{switch(t){case"md-bar-chart":if(!customElements.get(o(t))){customElements.define(o(t),g)}break;case"md-progress-indicator":if(!customElements.get(o(t))){n()}break;case"md-slider":if(!customElements.get(o(t))){r()}break}}))}f();const v=g;const x=f;export{v as MdBarChart,x as defineCustomElement};
+//# sourceMappingURL=md-bar-chart.js.map

package/dist/components-csr/md-bar-chart.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["mdBarChartCss","MdBarChart","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","label","titleAlign","series","layout","stack","categoryGap","barGap","cornerRadius","legend","tooltip","zoom","locale","noAnimation","animation","showLabels","showTotals","chevron","polar","axisTicks","clickable","labelZoomStart","labelZoomEnd","labelPlot","labelPoint","loading","loadingLabel","density","mounted","kbIndex","announcement","zoomWin","dragBand","grab","engine","applyQueued","ro","legendHidden","Map","bindChartHost","el","chartHost","bindA11yTableHost","a11yTableHost","onPlotPointerDown","e","zoomInside","button","insidePlot","x","hostX","id","pointerId","kind","win","x1","x2","target","composedPath","setPointerCapture","onPointerMove","g","plot","plotRect","Math","min","max","width","frac","trackFrac","clientX","originFrac","last","dataLength","span","end","start","delta","round","s","applyZoom","onPointerUp","band","abs","a","b","indexAtX","sort","m","n","onPlotDblClick","resetZoom","onZoomPanDown","stopPropagation","preventDefault","onZoomSliderInput","valueStart","valueEnd","detail","onZoomSliderEvent","onPlotKeyDown","scene","getScene","xPositions","length","rtl","getComputedStyle","direction","forward","back","next","key","emitBarClickForCategory","moveKeyboardCursor","onPlotBlur","seriesKeys","seen","map","i","base","get","set","rememberLegendToggle","seriesIndex","hidden","size","oldest","keys","value","delete","componentDidLoad","initChart","window","matchMedia","themeMql","themeListener","applyEngine","addEventListener","disconnectedCallback","disconnect","dispose","removeEventListener","undefined","onAnyPropChange","queueMicrotask","rebuildA11yTable","resize","onLoadingChange","now","before","replay","drill","index","toDataURL","getInstance","makeEngine","mdReady","emit","BarChartEngine","ResizeObserver","observe","parseRatio","v","fallback","Number","isFinite","parseFloat","trim","endsWith","buildEngineTheme","t","background","textColor","textColorMuted","axisLineColor","gridLineColor","gridColor","surface","fontFamily","labelSize","titleSize","zoomSliderOn","reduce","acc","d","data","xAxis","winStart","w","reset","mdZoom","startIndex","endIndex","setZoom","p","y","height","canvasOffset","canvas","host","getBoundingClientRect","box","left","top","zoomBandStyle","off","xs","best","bestD","Infinity","forEach","px","clientY","sliderTrackRect","slider","shadowRoot","querySelector","r","track","raw","renderZoomSlider","pct","fmt","String","h","class","part","exportparts","range","controlled","step","ariaLabelStart","ariaLabelEnd","valueStartText","valueEndText","onMdInput","onMdChange","onMdDragStart","onMdDragEnd","onMdFocus","onMdBlur","style","insetInlineStart","inlineSize","onPointerDown","buildSpec","percentage","vFmt","valueFormatter","toLocaleString","zw","cut","arr","slice","rebaseMap","rec","out","k","Object","entries","pointColors","resolved","c","resolveSeriesColor","pickPaletteColor","palette","color","axisIndex","yAxisIndex","overlay","widthRatio","pointWidths","normalizeRange","title","subtitle","categories","categoryFormatter","defaultValueFormatter","categoryLabelRotation","labelRotation","categoryLabelsMirrored","mirrorLabels","valueAxis2","yAxis2","formatter","valueTickFormatter","yAxis","categoryLabel","categoryHidden","categoryHideTicks","hideTicks","categoryAxisLine","axisLine","categoryDash","dash","valueScale","scale","valueBreaks","breaks","valueMin","valueMax","valueLabel","valueHidden","valueHideTicks","valueAxisLine","valueDash","valueGridDash","gridDash","horizontal","categoryGapRatio","barGapRatio","barWidth","polarHole","polarSweep","animationDuration","snap","readMdChartTheme","setSpec","onHover","idx","mdHover","dataIndex","axisValue","seriesIndices","visibleSeriesIndices","onLegendClick","item","mdLegendClick","seriesId","selected","onPointClick","si","di","mdBarClick","nativeEvent","animate","setHoverEnabled","setClickable","setTooltip","render","tooltipRenderer","missingFormatter","hp","hoverPoints","_","filter","innerHTML","buildDataTableHtml","xAxisLabel","xAxisData","xValueFormatter","focusIndex","xText","xLabels","yFmt","values","pt","byIndex","Boolean","join","replace","xValues","summary","buildChartSummary","chartType","seriesCount","xMin","xMax","empty","Host","role","heightProp","blockSize","onPointerCancel","onDblClick","name","ref","tabindex","onKeyDown","onBlur","variant","indeterminate"],"sources":["src/components/md-bar-chart/md-bar-chart.css?tag=md-bar-chart&encapsulation=shadow","src/components/md-bar-chart/md-bar-chart.tsx"],"sourcesContent":["/* ==========================================================\n   md-bar-chart — Material Design 3 Expressive bar chart\n\n   PUBLIC CSS CUSTOM PROPERTIES:\n     --md-bar-chart-block-size           Explicit chart height, overriding the aspect ratio (default: auto)\n     --md-bar-chart-min-block-size       Floor the chart height never drops below (density-aware)\n     --md-bar-chart-aspect-ratio         Width:height ratio used when no block-size is set (default: 16 / 9)\n     --md-bar-chart-background           Chart surface fill (default: surface-container-low)\n     --md-bar-chart-padding              Inset between the host edge and the plot canvas (density-aware)\n     --md-bar-chart-shape                Corner radius of the chart surface (density-aware)\n     --md-bar-chart-empty-color          Empty-state text colour (default: on-surface-variant)\n     --md-bar-chart-empty-background     Empty-state overlay fill (defaults to the chart background)\n     --md-bar-chart-empty-font           Empty-state font family (default: body-medium)\n     --md-bar-chart-empty-font-size      Empty-state font size (default: body-medium, 14px)\n     --md-bar-chart-empty-icon-size      Size of an icon slotted into the empty state (default: 40px)\n     --md-bar-chart-zoom-size            Height reserved for the zoom slider (default: 28px)\n     --md-bar-chart-zoom-track-color     Zoom slider track colour\n     --md-bar-chart-zoom-window-color    Zoom slider selected-window colour\n     --md-bar-chart-zoom-handle-color    Zoom slider thumb + drag-band edge colour\n     --md-bar-chart-zoom-band-color      Drag-to-zoom selection fill\n     (the zoom slider is an md-slider — its own --md-slider-* variables also\n      apply, scoped to .md-bar-chart__zoom-slider)\n\n   CSS PARTS:\n     header          Header row above the plot (hosts the `header` slot)\n     canvas          The plot surface the chart draws into\n     empty           Empty-state overlay, shown when there is no data\n     footer          Footer row below the plot (hosts the `footer` slot)\n     zoom            Wrapper around the zoom slider\n     zoom-slider     The zoom range slider itself\n     zoom-track      Zoom slider's inactive track (forwarded from md-slider)\n     zoom-window     Zoom slider's selected window (forwarded from md-slider)\n     zoom-handle     Zoom slider's thumbs (forwarded from md-slider)\n     zoom-pan        Grip that drags the whole zoom window along the track\n     zoom-band       Live selection band drawn while dragging across the plot\n     tooltip         The hover card, including one built by `tooltipRenderer`\n\n   SLOTS:\n     header          Content for the header row, replacing the default title block\n     empty           Replaces the empty-state message when there is no data\n     footer          Content for the footer row below the plot\n   ========================================================== */\n\n:host {\n  --_block-size: var(--md-bar-chart-block-size, auto);\n  --_min-block-size: var(--md-bar-chart-min-block-size, max(120px, calc(160px + var(--md-sys-density-scale, 0) * 8px)));\n  --_aspect-ratio: var(--md-bar-chart-aspect-ratio, 16 / 9);\n  --_background: var(--md-bar-chart-background, var(--md-sys-color-surface-container-low, #F7F2FA));\n  --_padding: var(--md-bar-chart-padding, max(8px, calc(16px + var(--md-sys-density-scale, 0) * 2px)));\n  --_shape: var(--md-bar-chart-shape, max(8px, calc(16px + var(--md-sys-density-scale, 0) * 2px)));\n  --_empty-color: var(--md-bar-chart-empty-color, var(--md-sys-color-on-surface-variant, #49454F));\n  --_empty-background: var(--md-bar-chart-empty-background, var(--_background));\n  --_empty-font: var(--md-bar-chart-empty-font, var(--md-sys-typescale-body-medium-font-family, Roboto, sans-serif));\n  --_empty-font-size: var(--md-bar-chart-empty-font-size, var(--md-sys-typescale-body-medium-font-size, 14px));\n  --_empty-icon-size: var(--md-bar-chart-empty-icon-size, 40px);\n  --_zoom-size: var(--md-bar-chart-zoom-size, 28px);\n  --_zoom-track-color: var(--md-bar-chart-zoom-track-color, var(--md-sys-color-surface-container-highest, #E6E0E9));\n  --_zoom-window-color: var(--md-bar-chart-zoom-window-color, var(--md-sys-color-secondary-container, #E8DEF8));\n  --_zoom-handle-color: var(--md-bar-chart-zoom-handle-color, var(--md-sys-color-primary, #6750A4));\n  --_zoom-band-color: var(--md-bar-chart-zoom-band-color, color-mix(in srgb, var(--md-sys-color-primary, #6750A4) 16%, transparent));\n  /* Clearance kept at each end of the pan grip so the thumbs stay grabbable. */\n  --_zoom-pan-inset: 10px;\n\n  display: block;\n  position: relative;\n  inline-size: 100%;\n  block-size: var(--_block-size);\n  min-block-size: var(--_min-block-size);\n  background: var(--_background);\n  padding: var(--_padding);\n  border-radius: var(--_shape);\n  box-sizing: border-box;\n  aspect-ratio: var(--_aspect-ratio);\n}\n\n.md-bar-chart__header,\n.md-bar-chart__footer { display: contents; }\n\n.md-bar-chart__header > slot[name='header']::slotted(*),\n.md-bar-chart__footer > slot[name='footer']::slotted(*) {\n  display: block;\n  margin-block: 8px;\n}\n\n.md-bar-chart__canvas {\n  position: absolute;\n  inset: var(--_padding);\n  min-block-size: 0;\n  min-inline-size: 0;\n}\n\n/* Reserve the slider band under the plot: lift the canvas bottom by exactly the\n   slider's height so the two never overlap. */\n:host(.md-bar-chart--zoom-slider) .md-bar-chart__canvas {\n  bottom: calc(var(--_padding) + var(--_zoom-size));\n}\n\n:host(.md-bar-chart--zoom-drag) .md-bar-chart__canvas {\n  /* Signals the plot is draggable; the band itself is pointer-transparent. */\n  cursor: ew-resize;\n}\n\n.md-bar-chart__zoom {\n  position: absolute;\n  inset-inline: var(--_padding);\n  bottom: var(--_padding);\n  block-size: var(--_zoom-size);\n  display: flex;\n  align-items: center;\n}\n\n/* The house slider draws the track and thumbs; the chart only maps its own\n   public zoom tokens onto the slider's and sizes it to the reserved band. */\n.md-bar-chart__zoom-slider {\n  --md-slider-active-color: var(--_zoom-window-color);\n  --md-slider-inactive-color: var(--_zoom-track-color);\n  --md-slider-thumb-color: var(--_zoom-handle-color);\n  /* Full-height thumbs in a band shorter than the MD3 default (44px), so the\n     slider never overflows into the plot. */\n  --md-slider-thumb-height: var(--_zoom-size);\n  --md-slider-track-height: 12px;\n}\n\n/* Pan grip over the selected window: drag it to move the window without\n   resizing. Inset at both ends (see renderZoomSlider) so a press near a thumb\n   still reaches the slider's rail and resizes. */\n.md-bar-chart__zoom-pan {\n  position: absolute;\n  inset-block: 0;\n  z-index: 1;\n  cursor: grab;\n  touch-action: none;\n}\n\n.md-bar-chart__zoom-pan:active {\n  cursor: grabbing;\n}\n\n/* Live drag selection over the plot. */\n.md-bar-chart__zoom-band {\n  position: absolute;\n  background: var(--_zoom-band-color);\n  border-inline: 1px solid var(--_zoom-handle-color);\n  pointer-events: none;\n}\n\n.md-bar-chart__empty {\n  position: absolute;\n  inset: 0;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 12px;\n  box-sizing: border-box;\n  padding: 24px;\n  /* Mirrors the chart's own container — same surface and corner radius. The\n     engine still draws a phantom 0-1 axis for an empty series, so an OPAQUE\n     surface here masks that ghost grid instead of letting it show through\n     behind the message. Column layout stacks a slotted icon above the text. */\n  background: var(--_empty-background);\n  border-radius: var(--_shape);\n  color: var(--_empty-color);\n  font-family: var(--_empty-font);\n  font-size: var(--_empty-font-size);\n  line-height: var(--md-sys-typescale-body-medium-line-height, 20px);\n  pointer-events: none;\n  text-align: center;\n}\n\n/* Same opaque surface as the empty state — the engine keeps drawing a phantom\n   0-1 axis while data is absent, and a translucent loader would let that ghost\n   grid read as real. z-index keeps it over the canvas and the zoom band. */\n.md-bar-chart__loading {\n  position: absolute;\n  inset: 0;\n  z-index: 1;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  gap: 12px;\n  box-sizing: border-box;\n  padding: 24px;\n  background: var(--_empty-background);\n  border-radius: var(--_shape);\n  color: var(--_empty-color);\n  font-family: var(--_empty-font);\n  font-size: var(--_empty-font-size);\n  text-align: center;\n}\n\n.md-bar-chart__spinner {\n  /* Sized against the empty-state icon so a loading chart and an empty one\n     read as the same family. */\n  inline-size: var(--_empty-icon-size);\n  block-size: var(--_empty-icon-size);\n}\n\n/* A slotted icon (e.g. a Material Symbols span) gets a sensible size and the\n   muted empty-state colour without the consumer restyling it. */\n.md-bar-chart__empty ::slotted(.material-symbols-outlined),\n.md-bar-chart__empty ::slotted(.material-symbols-rounded),\n.md-bar-chart__empty ::slotted(.material-symbols-sharp),\n.md-bar-chart__empty ::slotted(.material-icons) {\n  /* Document-level .material-symbols rules outrank ::slotted() in the cascade,\n     so the size needs !important to win (same reason md-icon-button does it). */\n  font-size: var(--_empty-icon-size) !important;\n  line-height: 1;\n  opacity: 0.55;\n}\n\n.md-bar-chart__a11y-table {\n  position: absolute;\n  inline-size: 1px;\n  block-size: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip-path: inset(50%);\n  white-space: nowrap;\n  border: 0;\n}\n\n@media (forced-colors: active) { :host { forced-color-adjust: auto; } }\n\n.md-bar-chart__live {\n  position: absolute;\n  inline-size: 1px;\n  block-size: 1px;\n  padding: 0;\n  margin: -1px;\n  overflow: hidden;\n  clip-path: inset(50%);\n  white-space: nowrap;\n  border: 0;\n}\n\n/* Focus ring for keyboard navigation — neutral outline, inset so the canvas\n   box doesn't clip it. */\n/* The legend chips are engine-created buttons styled inline, and inline styles\n   can't express :focus-visible — so their focus ring comes from here. Same\n   neutral outline as the plot's, rather than the browser's blue default. */\n[part='legend'] button:focus-visible {\n  /* Same ring md-button uses, so focus looks the same wherever it lands. */\n  outline: 3px solid var(--md-sys-color-secondary, #625B71);\n  outline-offset: 2px;\n  border-radius: 6px;\n}\n\n.md-bar-chart__canvas:focus-visible {\n  outline: 3px solid var(--md-sys-color-secondary, #625B71);\n  outline-offset: -3px;\n  border-radius: 4px;\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 {\n  Component,\n  Host,\n  h,\n  Prop,\n  State,\n  Event,\n  EventEmitter,\n  Element,\n  Method,\n  Watch,\n} from '@stencil/core';\nimport {\n  buildChartSummary,\n  buildDataTableHtml,\n  defaultValueFormatter,\n  normalizeRange,\n  pickPaletteColor,\n  readMdChartTheme,\n  resolveSeriesColor,\n  BarChartEngine,\n  type BarChartSpec,\n  type EngineTheme,\n  type MdChartAnimation,\n  type MdChartAxis,\n  type MdChartAxisValue,\n  type MdChartBarLayout,\n  type MdChartClickDetail,\n  type MdChartHoverDetail,\n  type MdChartLegendPosition,\n  type MdChartSeries,\n  type MdChartStackMode,\n  type MdChartTitleAlign,\n  type MdChartTooltipRenderer,\n  type MdChartTooltipTrigger,\n} from '../../utils/charts';\n\n/**\n * md-bar-chart — Material Design 3 Expressive bar chart, rendered\n * by the in-house engine (Canvas2D + a DOM text overlay). No\n * ECharts.\n *\n *   • vertical (default) and horizontal layouts\n *   • grouped / stacked / percentage modes\n *   • category + bar gap configuration\n *   • rounded outer corners (top for vertical, end for horizontal)\n *   • legend toggle, hover tooltip, click events\n *   • role=\"figure\" + screen-reader-only data table\n */\n@Component({\n  tag: 'md-bar-chart',\n  styleUrl: 'md-bar-chart.css',\n  shadow: true,\n})\nexport class MdBarChart {\n  @Element() el!: HTMLElement;\n\n  @Prop() label: string = '';\n  /**\n   * A quieter line under the title — a source, a unit, the caveat a title\n   * should not have to carry.\n   */\n  @Prop() subtitle: string | undefined;\n  /** Title alignment over the plot: `start` (left), `center`, or `end` (right). */\n  @Prop({ attribute: 'title-align' }) titleAlign: MdChartTitleAlign = 'start';\n  @Prop() series: MdChartSeries[] = [];\n\n  /** Category axis configuration. */\n  @Prop() xAxis: MdChartAxis | undefined;\n  /** Value axis configuration. */\n  @Prop() yAxis: MdChartAxis | undefined;\n  /**\n   * A SECOND value axis, drawn in the opposite gutter and used by any series\n   * whose `yAxisIndex` is 1 — two quantities on one category axis that share no\n   * scale, like a count and a rate. Vertical charts.\n   *\n   * It draws no gridlines of its own: two sets at two spacings turn the plot\n   * into a mesh nobody can read a value off.\n   */\n  @Prop() yAxis2: MdChartAxis | undefined;\n\n  /** Bar layout — `'horizontal'` swaps categories onto the y axis. */\n  @Prop({ reflect: true }) layout: MdChartBarLayout = 'vertical';\n\n  /** Stacking strategy: none (grouped) / normal / percentage. */\n  @Prop() stack: MdChartStackMode = 'none';\n\n  /** Category gap as a percentage of the band width (`\"30%\"` or `30`). */\n  @Prop({ attribute: 'category-gap' }) categoryGap: string | number = '30%';\n\n  /** Bar gap between sibling grouped bars (`\"20%\"` or `20`). */\n  @Prop({ attribute: 'bar-gap' }) barGap: string | number = '20%';\n\n  /** Fixed bar WIDTH in px, centred in each slot. Default: auto — the bar fills\n   *  its slot (the band minus the category/bar gaps). Clamped to the slot so it\n   *  can't overrun a neighbour. */\n  @Prop({ attribute: 'bar-width' }) barWidth?: number;\n\n  /** Bar corner radius in pixels. */\n  @Prop({ attribute: 'corner-radius' }) cornerRadius: number = 6;\n\n  @Prop({ reflect: true }) legend: MdChartLegendPosition | 'none' = 'top-end';\n  @Prop() tooltip: MdChartTooltipTrigger = 'axis';\n  /**\n   * Interactive zoom over the CATEGORY range — the same \"zoom is a view\" model\n   * as `md-line-chart`:\n   *   • `inside` — drag horizontally across the plot to zoom into that span of\n   *     bars; double-click the plot to reset.\n   *   • `slider` — a range slider under the plot; drag its thumbs to resize the\n   *     window, or the grip between them to pan it.\n   *   • `both` — both gestures.\n   *\n   * `series` / `xAxis` are never mutated: the engine is simply fed the sliced\n   * window, and hover / click / keyboard indices are rebased so consumers still\n   * see ABSOLUTE data indices. Ignored on a `polar` chart (a ring has no span to\n   * zoom). For a *value*-range zoom, set `yAxis.min` / `yAxis.max`.\n   */\n  @Prop() zoom: 'none' | 'inside' | 'slider' | 'both' = 'none';\n  /**\n   * Format raw values for tooltips / a11y table. The tooltip also asks it about\n   * series with NO value at the hovered category — `null` for a null datum,\n   * `undefined` for no datum at all — and shows a row for one when it returns a\n   * non-empty string.\n   */\n  /**\n   * BCP-47 locale for the DEFAULT number / date formatting (axis ticks,\n   * tooltip values, screen-reader table). Empty follows the browser; an\n   * explicit `valueFormatter` always wins.\n   */\n  @Prop() locale: string = '';\n\n  @Prop() valueFormatter?: (value: number | null | undefined) => string;\n\n  /** Replace the tooltip's content. See `md-line-chart`'s `tooltipRenderer`. */\n  @Prop() tooltipRenderer?: MdChartTooltipRenderer;\n  @Prop({ attribute: 'height' }) heightProp?: string;\n  /** Disable all animation (shorthand for `animation=\"none\"`). */\n  @Prop({ attribute: 'no-animation' }) noAnimation: boolean = false;\n  /** Entry-animation variant: `expressive` (default), `grow`, `fade`, `draw`, or `none`. */\n  @Prop() animation: MdChartAnimation = 'expressive';\n  /** Entry-animation duration override in ms (≤ 0 disables). */\n  @Prop({ attribute: 'animation-duration' }) animationDuration?: number;\n\n  /** Show numeric data labels on each bar. */\n  @Prop({ attribute: 'show-labels' }) showLabels: boolean = false;\n  /**\n   * Print each stack's TOTAL past the end of the column, alongside the\n   * per-segment values `show-labels` prints inside it. Stacked charts only —\n   * an unstacked bar already IS its total.\n   */\n  @Prop({ attribute: 'show-totals' }) showTotals: boolean = false;\n  /**\n   * Draw the bars as CHEVRONS pointing away from the baseline instead of as\n   * rectangles. Along a stack they interlock, each segment's point sitting in\n   * the next one's notch — a force diagram, where the contributions are handed\n   * along in a direction rather than merely piled up.\n   */\n  @Prop({ attribute: 'chevron' }) chevron: boolean = false;\n  /**\n   * Wrap the bars around a circle: one concentric RING per category, with the\n   * value axis running as an ANGLE instead of a length. A radial (polar) bar\n   * chart.\n   *\n   * Stacking, legend hiding and percentage normalisation all work unchanged —\n   * only the step from a value to geometry differs, and the value axis\n   * deliberately spans less than the full circle, since a ring that closes on\n   * itself has no readable start or end. The quarter it gives up is where the\n   * category names go; `polar-sweep` changes how much that is.\n   */\n  @Prop({ reflect: true }) polar: boolean = false;\n  /** Radius of the hole at the centre of a polar chart, 0..0.9. Default 0.22. */\n  @Prop({ attribute: 'polar-hole' }) polarHole?: number;\n  /** Fraction of the circle the value axis spans on a polar chart. Default 0.75. */\n  @Prop({ attribute: 'polar-sweep' }) polarSweep?: number;\n\n  /** Draw small perpendicular tick marks on the axes. */\n  @Prop({ attribute: 'axis-ticks' }) axisTicks: boolean = false;\n\n  /**\n   * Show a hand (`pointer`) cursor over the bars, signalling they're actionable —\n   * e.g. clickable to drill into. The chart can't know an interaction is wired,\n   * so set this when a `mdBarClick` handler does something (like `drill`). The\n   * cursor tracks the bar itself (hit-tested like a click), not the empty column\n   * above a short bar.\n   */\n  @Prop({ attribute: 'clickable' }) clickable: boolean = false;\n\n  @Event() mdBarClick!: EventEmitter<MdChartClickDetail<MdChartSeries>>;\n  @Event() mdLegendClick!: EventEmitter<{ seriesIndex: number; seriesId?: string; selected: boolean }>;\n  @Event() mdHover!: EventEmitter<MdChartHoverDetail>;\n  @Event() mdReady!: EventEmitter<void>;\n  /** Fires when the zoom window changes (drag, slider, or `setZoom`/`resetZoom`). */\n  @Event() mdZoom!: EventEmitter<{ startIndex: number; endIndex: number; reset: boolean }>;\n\n  /** Accessible label for the zoom slider's start thumb. */\n  @Prop({ attribute: 'label-zoom-start' }) labelZoomStart: string = 'Zoom range start';\n  /** Accessible label for the zoom slider's end thumb. */\n  @Prop({ attribute: 'label-zoom-end' }) labelZoomEnd: string = 'Zoom range end';\n\n  /**\n   * Instructions announced when the plot receives keyboard focus. The plot is\n   * focusable so a keyboard user can walk the data with the arrow keys; this\n   * is what tells them so.\n   */\n  @Prop({ attribute: 'label-plot' }) labelPlot: string =\n    'Chart data. Use the arrow keys to move between points, Home and End for the first and last, Escape to leave.';\n\n  /** Template for the live announcement as keyboard focus moves. `%x%` is the\n   *  axis value, `%values%` the series readings at it. */\n  @Prop({ attribute: 'label-point' }) labelPoint: string = '%x%: %values%';\n\n  /**\n   * Data is still on its way — the chart covers the plot with a loader instead\n   * of drawing an empty (or stale) axis, and marks itself `aria-busy`.\n   *\n   * Set it while the fetch is in flight and clear it when `series` arrives; the\n   * entry animation replays on the way out, so the bars draw themselves in\n   * rather than appearing fully formed. Slot `loading` to replace the default\n   * indicator with your own skeleton.\n   */\n  @Prop({ reflect: true }) loading: boolean = false;\n\n  /** Accessible + visible text under the loader. */\n  @Prop({ attribute: 'loading-label' }) loadingLabel: string = 'Loading chart…';\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  @State() private mounted = false;\n  /** Index the keyboard cursor sits on, or -1 when the plot isn't focused. */\n  @State() private kbIndex = -1;\n  /** Text for the aria-live region — what a screen reader speaks on move. */\n  @State() private announcement = '';\n\n  /** Visible category window, or null for the full range. */\n  @State() private zoomWin: { start: number; end: number } | null = null;\n\n  /** Live drag rectangle (host-relative px) while selecting a range to zoom. */\n  @State() private dragBand: { x1: number; x2: number } | null = null;\n\n  /**\n   * Pointer id + origin of an in-progress gesture: `band` is a drag across the\n   * plot, `pan` is a drag of the zoom window. (Resizing the window is the\n   * slider's own gesture — see `renderZoomSlider`.)\n   */\n  private grab: { id: number; kind: 'band' | 'pan'; x: number; win: { start: number; end: number } } | null = null;\n\n  private engine: BarChartEngine | null = null;\n  /** True while a prop-change rebuild is queued for the next microtask (batches\n   *  a burst of prop assignments into one render — see onAnyPropChange). */\n  private applyQueued = false;\n  private ro: ResizeObserver | null = null;\n  private chartHost?: HTMLDivElement;\n  private a11yTableHost?: HTMLDivElement;\n  private themeMql?: MediaQueryList;\n  private themeListener?: () => void;\n\n  /**\n   * Legend toggles the USER made, kept across data updates.\n   *\n   * The engine self-toggles a series on legend click, but that lives on the\n   * spec — and the next `series` assignment rebuilds the spec from the prop and\n   * takes the toggle with it. A chart re-fed live (a race, a poll) would\n   * un-hide whatever the reader had just hidden. Remembered here and re-applied\n   * in `buildSpec`, keyed by series identity, so the toggle survives the refeed\n   * while an explicit `series[i].hidden` still wins.\n   */\n  private legendHidden = new Map<string, boolean>();\n\n  /** A stable key per series — id, else label, else position. Suffixed on\n   *  collision so two series sharing a label do not share a toggle. */\n  private seriesKeys(): string[] {\n    const seen = new Map<string, number>();\n    return this.series.map((s, i) => {\n      const base = s.id != null ? `id:${s.id}` : s.label != null ? `label:${s.label}` : `pos:${i}`;\n      const n = seen.get(base) ?? 0;\n      seen.set(base, n + 1);\n      return n === 0 ? base : `${base}#${n}`;\n    });\n  }\n\n  /** Record a legend toggle so `buildSpec` re-applies it across series re-feeds. */\n  private rememberLegendToggle(seriesIndex: number, hidden: boolean): void {\n    const key = this.seriesKeys()[seriesIndex];\n    if (key == null) return;\n    this.legendHidden.set(key, hidden);\n    // Backstop against unbounded growth (only legend clicks add entries, so this\n    // realistically never trips): evict the oldest toggle.\n    if (this.legendHidden.size > 256) {\n      const oldest = this.legendHidden.keys().next().value as string;\n      this.legendHidden.delete(oldest);\n    }\n  }\n\n  componentDidLoad() {\n    this.initChart();\n    if (typeof window !== 'undefined' && window.matchMedia) {\n      this.themeMql = window.matchMedia('(prefers-color-scheme: dark)');\n      this.themeListener = () => this.applyEngine();\n      this.themeMql.addEventListener?.('change', this.themeListener);\n    }\n  }\n  disconnectedCallback() {\n    this.ro?.disconnect();\n    this.ro = null;\n    this.engine?.dispose();\n    this.engine = null;\n    if (this.themeMql && this.themeListener) {\n      this.themeMql.removeEventListener?.('change', this.themeListener);\n      this.themeListener = undefined;\n      this.themeMql = undefined;\n    }\n  }\n\n  @Watch('series') @Watch('xAxis') @Watch('yAxis') @Watch('yAxis2') @Watch('layout')\n  @Watch('stack') @Watch('categoryGap') @Watch('barGap') @Watch('barWidth') @Watch('cornerRadius')\n  @Watch('legend') @Watch('tooltip') @Watch('zoom') @Watch('label') @Watch('subtitle') @Watch('titleAlign') @Watch('showLabels') @Watch('showTotals') @Watch('chevron') @Watch('polar') @Watch('polarHole') @Watch('polarSweep') @Watch('axisTicks')\n  @Watch('animation') @Watch('animationDuration') @Watch('tooltipRenderer') @Watch('valueFormatter') @Watch('locale') @Watch('noAnimation') @Watch('clickable')\n  onAnyPropChange() {\n    // Coalesce a burst of prop assignments (a data swap sets series + xAxis +\n    // yAxis, a race re-feeds several per frame) into ONE rebuild + render per\n    // microtask, instead of a full computeBarLayout + canvas clear + repaint per\n    // property.\n    if (this.applyQueued) return;\n    this.applyQueued = true;\n    queueMicrotask(() => {\n      this.applyQueued = false;\n      this.applyEngine();\n      this.rebuildA11yTable();\n    });\n  }\n\n  @Method()\n  async resize(): Promise<void> {\n    this.engine?.resize();\n  }\n\n  /**\n   * Coming OUT of the loading state, replay the entry motion so the data that\n   * just arrived draws itself in instead of appearing fully formed behind the\n   * fading loader. (Going in needs nothing — the loader covers the plot.)\n   */\n  @Watch('loading')\n  onLoadingChange(now: boolean, before: boolean) {\n    if (before && !now) this.engine?.replay();\n  }\n\n  /** Replay the entry animation from the start (uses the current `animation`). */\n  @Method()\n  async replay(): Promise<void> {\n    this.engine?.replay();\n  }\n\n  /**\n   * Animate the next data change as a drill through one column, so the levels\n   * of a hierarchy read as connected rather than as unrelated charts.\n   *\n   * AWAIT it, then assign the new `series` / `xAxis`. Like every Stencil\n   * `@Method` this one resolves through a microtask, so a bare call lands AFTER\n   * an assignment on the next line — the swap renders un-animated and the drill\n   * arms itself for whatever change comes after.\n   *\n   * ```ts\n   * await chart.drill(e.detail.dataIndex);   // descend into the clicked column\n   * chart.series = childrenOf(clicked);\n   *\n   * await chart.drill(0, 'up');              // …and back out\n   * chart.series = parentLevel;\n   * ```\n   *\n   * Descending, the incoming columns unfold out of the band the named column\n   * occupies right now. `'up'` pivots on the whole plot instead, which is the\n   * same motion run inside out — the level being returned to opens out of\n   * everything the level being left was filling. Falls back to a plain swap\n   * when the index doesn't resolve, or under `prefers-reduced-motion`.\n   */\n  @Method()\n  async drill(index: number, direction: 'down' | 'up' = 'down'): Promise<void> {\n    this.engine?.drill(index, direction);\n  }\n\n  @Method()\n  async toDataURL(): Promise<string> {\n    return this.engine?.toDataURL('image/png') ?? '';\n  }\n\n  @Method()\n  async getInstance(): Promise<BarChartEngine | null> {\n    return this.engine;\n  }\n\n  private bindChartHost = (el?: HTMLDivElement) => { this.chartHost = el; };\n  private bindA11yTableHost = (el?: HTMLDivElement) => { this.a11yTableHost = el; };\n\n  private initChart() {\n    this.makeEngine();\n    this.applyEngine();\n    this.rebuildA11yTable();\n    this.mounted = true;\n    this.mdReady.emit();\n  }\n\n  /** (Re)create the engine on the selected backend + wire its ResizeObserver. */\n  private makeEngine() {\n    if (!this.chartHost) return;\n    this.ro?.disconnect();\n    this.ro = null;\n    this.engine?.dispose();\n    try {\n      this.engine = new BarChartEngine(this.chartHost);\n    } catch {\n      this.engine = null;\n    }\n    if (this.engine && typeof ResizeObserver !== 'undefined') {\n      this.ro = new ResizeObserver(() => this.engine?.resize());\n      this.ro.observe(this.chartHost);\n    }\n  }\n\n\n  /** `\"30%\"` / `30` / `0.3` → `0.3`. */\n  private parseRatio(v: string | number, fallback: number): number {\n    if (typeof v === 'number') return Number.isFinite(v) ? (v > 1 ? v / 100 : v) : fallback;\n    const n = parseFloat(v);\n    if (!Number.isFinite(n)) return fallback;\n    return v.trim().endsWith('%') || n > 1 ? n / 100 : n;\n  }\n\n  private buildEngineTheme(t: ReturnType<typeof readMdChartTheme>): EngineTheme {\n    return {\n      background: t.background,\n      textColor: t.textColor,\n      textColorMuted: t.textColorMuted,\n      axisLineColor: t.axisLineColor,\n      gridLineColor: t.gridColor,\n      surface: t.surface,\n      fontFamily: t.fontFamily,\n      labelSize: t.labelSize,\n      titleSize: t.titleSize,\n    };\n  }\n\n  // ─────────────────── zoom ───────────────────\n  // Zoom is a *view* over the categories: the engine is fed a sliced window,\n  // `series`/`xAxis` are untouched, and every index the engine reports (hover,\n  // click, keyboard) is rebased by `winStart()` so consumers see absolute\n  // indices. A polar chart has no linear span, so gestures are disabled on it.\n\n  private get zoomInside(): boolean {\n    return !this.polar && (this.zoom === 'inside' || this.zoom === 'both');\n  }\n\n  private get zoomSliderOn(): boolean {\n    return !this.polar && (this.zoom === 'slider' || this.zoom === 'both');\n  }\n\n  /** Number of categories — the longest series, or the category axis if longer. */\n  private dataLength(): number {\n    const s = (this.series ?? []).reduce((acc, d) => Math.max(acc, d?.data?.length ?? 0), 0);\n    return Math.max(s, this.xAxis?.data?.length ?? 0);\n  }\n\n  /** Absolute index of the window's first visible category (0 when unzoomed). */\n  private winStart(): number {\n    return this.zoomWin && !this.polar ? this.win().start : 0;\n  }\n\n  /** Current window, defaulted to the full range and clamped to the data. */\n  private win(): { start: number; end: number } {\n    const last = Math.max(0, this.dataLength() - 1);\n    const w = this.zoomWin;\n    if (!w) return { start: 0, end: last };\n    // Keep at least two categories visible, else the slider range collapses.\n    const start = Math.min(Math.max(0, w.start), Math.max(0, last - 1));\n    return { start, end: Math.min(Math.max(start + 1, w.end), last) };\n  }\n\n  private applyZoom(start: number, end: number, reset = false): void {\n    const last = Math.max(0, this.dataLength() - 1);\n    const s = Math.min(Math.max(0, Math.round(start)), Math.max(0, last - 1));\n    const e = Math.min(Math.max(s + 1, Math.round(end)), last);\n    this.zoomWin = reset ? null : { start: s, end: e };\n    // Snap to the new window: a zoom is direct manipulation, so easing the bars\n    // across the changed layout (the follow loop) would read as them sliding\n    // together instead of tracking the gesture.\n    this.applyEngine(true);\n    this.rebuildA11yTable();\n    this.mdZoom.emit({ startIndex: reset ? 0 : s, endIndex: reset ? last : e, reset });\n  }\n\n  /** Zoom to an absolute category range. */\n  @Method()\n  async setZoom(startIndex: number, endIndex: number): Promise<void> {\n    this.applyZoom(startIndex, endIndex);\n  }\n\n  /** Drop the zoom window and show the full range. */\n  @Method()\n  async resetZoom(): Promise<void> {\n    this.applyZoom(0, 0, true);\n  }\n\n  /**\n   * Plot rect in CANVAS coordinates, from the live scene.\n   *\n   * The engine lays the scene out relative to the canvas box, which the host's\n   * padding insets from the host box — so canvas and host space differ by that\n   * padding. Everything that compares against the scene (`indexAtX` reads\n   * `scene.xPositions`, which is canvas-space too) converts the pointer INTO\n   * this space via `hostX`; only the drag band, positioned against the host,\n   * converts back out.\n   */\n  private plotRect(): { x: number; y: number; width: number; height: number } | null {\n    const p = this.engine?.getScene()?.plot;\n    return p ? { x: p.x, y: p.y, width: p.width, height: p.height } : null;\n  }\n\n  /** Offset of the canvas box inside the host box — canvas space → host space. */\n  private canvasOffset(): { x: number; y: number } {\n    const canvas = this.chartHost;\n    if (!canvas) return { x: 0, y: 0 };\n    const host = this.el.getBoundingClientRect();\n    const box = canvas.getBoundingClientRect();\n    return { x: box.left - host.left, y: box.top - host.top };\n  }\n\n  /** Drag-band geometry, converted from canvas space back out to host space. */\n  private zoomBandStyle(): { [key: string]: string } | undefined {\n    const plot = this.plotRect();\n    if (!this.dragBand || !plot) return undefined;\n    const off = this.canvasOffset();\n    const { x1, x2 } = this.dragBand;\n    return {\n      left: `${off.x + Math.min(x1, x2)}px`,\n      width: `${Math.abs(x2 - x1)}px`,\n      top: `${off.y + plot.y}px`,\n      height: `${plot.height}px`,\n    };\n  }\n\n  /** Pointer x in CANVAS coordinates — the space `plotRect`/`xPositions` use. */\n  private hostX(e: MouseEvent): number {\n    return e.clientX - (this.chartHost ?? this.el).getBoundingClientRect().left;\n  }\n\n  /** Map a canvas-relative x to the nearest ABSOLUTE category index. */\n  private indexAtX(hostX: number): number {\n    const scene = this.engine?.getScene();\n    const w = this.win();\n    const xs = scene?.xPositions;\n    if (!xs?.length) return w.start;\n    let best = 0;\n    let bestD = Infinity;\n    xs.forEach((px, i) => {\n      const d = Math.abs(px - hostX);\n      if (d < bestD) {\n        bestD = d;\n        best = i;\n      }\n    });\n    return w.start + best;\n  }\n\n  /** Is the event over the plot itself (not the header, zoom slider, footer)? */\n  private insidePlot(e: MouseEvent): boolean {\n    const plot = this.plotRect();\n    if (!plot) return false;\n    const box = (this.chartHost ?? this.el).getBoundingClientRect();\n    const x = e.clientX - box.left;\n    const y = e.clientY - box.top;\n    return x >= plot.x && x <= plot.x + plot.width && y >= plot.y && y <= plot.y + plot.height;\n  }\n\n  private onPlotPointerDown = (e: PointerEvent) => {\n    if (!this.zoomInside || e.button !== 0 || this.grab) return;\n    if (!this.insidePlot(e)) return;\n    const x = this.hostX(e);\n    this.grab = { id: e.pointerId, kind: 'band', x, win: this.win() };\n    this.dragBand = { x1: x, x2: x };\n    // Capture on the element really under the pointer (the shadow canvas), NOT\n    // `e.target` — a host-level listener retargets to the host, and capturing\n    // there would route the closing `click` to the host where the engine's\n    // canvas never sees it, silently killing every bar click while zoom is on.\n    const target = (e.composedPath?.()[0] as HTMLElement | undefined) ?? (e.target as HTMLElement);\n    target.setPointerCapture?.(e.pointerId);\n  };\n\n  private onPointerMove = (e: PointerEvent) => {\n    const g = this.grab;\n    if (!g || g.id !== e.pointerId) return;\n    if (g.kind === 'band') {\n      const plot = this.plotRect();\n      if (!plot) return;\n      this.dragBand = { x1: g.x, x2: Math.min(Math.max(this.hostX(e), plot.x), plot.x + plot.width) };\n      return;\n    }\n    // Pan: shift the window by the pointer's travel along the slider track,\n    // keeping its span (fractions of the full range, so it tracks the thumbs).\n    const frac = this.trackFrac(e.clientX);\n    const originFrac = this.trackFrac(g.x);\n    if (frac == null || originFrac == null) return;\n    const last = Math.max(1, this.dataLength() - 1);\n    const span = g.win.end - g.win.start;\n    const delta = Math.round((frac - originFrac) * last);\n    const s = Math.min(Math.max(0, g.win.start + delta), last - span);\n    this.applyZoom(s, s + span);\n  };\n\n  private onPointerUp = (e: PointerEvent) => {\n    const g = this.grab;\n    if (!g || g.id !== e.pointerId) return;\n    this.grab = null;\n    const band = this.dragBand;\n    this.dragBand = null;\n    if (g.kind !== 'band' || !band) return;\n    // A tiny drag is a click, not a zoom — leave the view alone so bar clicks\n    // and tooltips keep working.\n    if (Math.abs(band.x2 - band.x1) < 8) return;\n    // In RTL the plot is mirrored, so order by index, not by pixel, or the\n    // window comes out reversed.\n    const [a, b] = [this.indexAtX(band.x1), this.indexAtX(band.x2)].sort((m, n) => m - n);\n    if (b - a >= 1) this.applyZoom(a, b);\n  };\n\n  private onPlotDblClick = (e: MouseEvent) => {\n    // Plot only: a double-click on the zoom slider is two track clicks, not a\n    // request to throw the window away.\n    if (this.zoomInside && this.zoomWin && this.insidePlot(e)) this.resetZoom();\n  };\n\n  /**\n   * The zoom slider's track box. `md-slider` maps 0→100% across its own host\n   * box, so the host rect *is* the track — measuring it keeps the pan gesture\n   * in step with the thumbs.\n   */\n  private sliderTrackRect(): { left: number; width: number; rtl: boolean } | null {\n    const slider = this.el.shadowRoot?.querySelector('.md-bar-chart__zoom-slider');\n    if (!slider) return null;\n    const r = slider.getBoundingClientRect();\n    if (!r.width) return null;\n    return { left: r.left, width: r.width, rtl: getComputedStyle(this.el).direction === 'rtl' };\n  }\n\n  /** Client x → fraction along the zoom track (RTL-aware, as md-slider is). */\n  private trackFrac(clientX: number): number | null {\n    const track = this.sliderTrackRect();\n    if (!track) return null;\n    const raw = (clientX - track.left) / track.width;\n    return Math.min(Math.max(track.rtl ? 1 - raw : raw, 0), 1);\n  }\n\n  private onZoomPanDown = (e: PointerEvent) => {\n    if (e.button !== 0) return;\n    // Keep it away from the plot-drag handler on the host, and from the\n    // slider's own rail (which would resize instead of pan).\n    e.stopPropagation();\n    e.preventDefault();\n    this.grab = { id: e.pointerId, kind: 'pan', x: e.clientX, win: this.win() };\n    (e.target as HTMLElement).setPointerCapture?.(e.pointerId);\n  };\n\n  /** md-slider drives the window while a thumb moves (continuous). */\n  private onZoomSliderInput = (e: CustomEvent<{ valueStart?: number; valueEnd?: number }>) => {\n    // md-slider's events are composed, so they would surface on the chart's own\n    // host and look like chart events to a consumer. Stop them here.\n    e.stopPropagation();\n    const { valueStart, valueEnd } = e.detail ?? {};\n    if (valueStart == null || valueEnd == null) return;\n    this.applyZoom(valueStart, valueEnd);\n  };\n\n  /** Swallow the slider's remaining composed events (see above). mdInput has\n   *  already applied the window, so the commit needs no second applyZoom. */\n  private onZoomSliderEvent = (e: Event) => e.stopPropagation();\n\n  private renderZoomSlider() {\n    const last = Math.max(1, this.dataLength() - 1);\n    const w = this.win();\n    const pct = (i: number) => (i / last) * 100;\n    const fmt = (i: number) => String(this.xAxis?.data?.[i] ?? i);\n    return (\n      <div class=\"md-bar-chart__zoom\" part=\"zoom\">\n        <md-slider\n          class=\"md-bar-chart__zoom-slider\"\n          part=\"zoom-slider\"\n          exportparts=\"track: zoom-track, track-active: zoom-window, thumb-knob: zoom-handle\"\n          range\n          controlled\n          min={0}\n          max={last}\n          step={1}\n          valueStart={w.start}\n          valueEnd={w.end}\n          ariaLabelStart={this.labelZoomStart}\n          ariaLabelEnd={this.labelZoomEnd}\n          valueStartText={fmt(w.start)}\n          valueEndText={fmt(w.end)}\n          onMdInput={this.onZoomSliderInput}\n          onMdChange={this.onZoomSliderEvent}\n          onMdDragStart={this.onZoomSliderEvent}\n          onMdDragEnd={this.onZoomSliderEvent}\n          onMdFocus={this.onZoomSliderEvent}\n          onMdBlur={this.onZoomSliderEvent}\n        ></md-slider>\n\n        {/* Pan grip over the selected window. Inset at both ends so the thumbs\n            stay grabbable, and it collapses to nothing on a narrow window. */}\n        <div\n          class=\"md-bar-chart__zoom-pan\"\n          part=\"zoom-pan\"\n          style={{\n            insetInlineStart: `calc(${pct(w.start)}% + var(--_zoom-pan-inset))`,\n            inlineSize: `max(0px, calc(${pct(w.end) - pct(w.start)}% - 2 * var(--_zoom-pan-inset)))`,\n          }}\n          onPointerDown={this.onZoomPanDown}\n        ></div>\n      </div>\n    );\n  }\n\n  private buildSpec(t: ReturnType<typeof readMdChartTheme>): BarChartSpec {\n    const percentage = this.stack === 'percentage';\n    const vFmt = (v: number) => (this.valueFormatter ? this.valueFormatter(v) : v.toLocaleString(this.locale || undefined));\n    const keys = this.seriesKeys();\n    // Zoom is a view: slice what the engine draws, leave `this.series` alone.\n    // Per-category options (`data`, `range`) are sliced; index-keyed maps\n    // (`pointWidths`, `pointColors`) are rebased into window coordinates and\n    // anything outside the window is dropped.\n    const zw = this.zoomWin && !this.polar ? this.win() : null;\n    const cut = <T,>(arr: readonly T[] | undefined): T[] | undefined =>\n      arr ? (zw ? arr.slice(zw.start, zw.end + 1) : arr.slice()) : undefined;\n    const rebaseMap = <T,>(rec: Record<number, T> | undefined): Record<number, T> | undefined => {\n      if (!rec || !zw) return rec;\n      const out: Record<number, T> = {};\n      for (const [k, v] of Object.entries(rec)) {\n        const i = Number(k) - zw.start;\n        if (i >= 0 && i <= zw.end - zw.start) out[i] = v;\n      }\n      return out;\n    };\n    return {\n      series: this.series.map((s, i) => {\n        let pointColors: Record<number, string> | undefined;\n        if (s.pointColors) {\n          const resolved: Record<number, string> = {};\n          for (const [k, c] of Object.entries(s.pointColors)) resolved[Number(k)] = resolveSeriesColor(this.el, c, pickPaletteColor(t.palette, i));\n          pointColors = rebaseMap(resolved);\n        }\n        return {\n          label: s.label ?? `Series ${i + 1}`,\n          color: resolveSeriesColor(this.el, s.color, pickPaletteColor(t.palette, i)),\n          data: cut(s.data) ?? [],\n          hidden: s.hidden ?? this.legendHidden.get(keys[i]) ?? false,\n          stack: s.stack,\n          axisIndex: s.yAxisIndex,\n          overlay: s.overlay,\n          widthRatio: s.widthRatio,\n          pointWidths: rebaseMap(s.pointWidths),\n          range: cut(s.range)?.map(normalizeRange),\n          pointColors,\n        };\n      }),\n      title: this.label || undefined,\n      subtitle: this.subtitle || undefined,\n      titleAlign: this.titleAlign,\n      categories: cut(this.xAxis?.data) ?? [],\n      categoryFormatter: this.xAxis?.valueFormatter ?? defaultValueFormatter,\n      categoryLabelRotation: this.xAxis?.labelRotation,\n      categoryLabelsMirrored: this.xAxis?.mirrorLabels,\n      // `yAxis` IS the value axis whichever way the bars run, so its formatter\n      // is the one that shapes the value ticks. It was declared on the type and\n      // read for the category axis but never for this one, so a chart asking\n      // for `300k` on the axis silently got `300,000`.\n      valueAxis2: this.yAxis2\n        ? {\n            min: this.yAxis2.min,\n            max: this.yAxis2.max,\n            label: this.yAxis2.label,\n            formatter: this.yAxis2.valueFormatter ? (v: number) => String(this.yAxis2!.valueFormatter!(v)) : undefined,\n            hidden: this.yAxis2.hidden,\n          }\n        : undefined,\n      valueTickFormatter: this.yAxis?.valueFormatter\n        ? (v: number) => String(this.yAxis!.valueFormatter!(v))\n        : undefined,\n      categoryLabel: this.xAxis?.label,\n      categoryHidden: this.xAxis?.hidden,\n      categoryHideTicks: this.xAxis?.hideTicks,\n      categoryAxisLine: this.xAxis?.axisLine,\n      categoryDash: this.xAxis?.dash,\n      valueScale: this.yAxis?.scale ?? 'value',\n      // The value axis is y for vertical bars and x for horizontal ones, so\n      // read breaks from whichever axis config carries the values.\n      valueBreaks: (this.layout === 'horizontal' ? this.xAxis : this.yAxis)?.breaks,\n      valueMin: percentage ? 0 : this.yAxis?.min,\n      valueMax: percentage ? 100 : this.yAxis?.max,\n      valueFormatter: percentage ? (v: number) => `${Math.round(v)}%` : vFmt,\n      valueLabel: this.yAxis?.label,\n      valueHidden: this.yAxis?.hidden,\n      valueHideTicks: this.yAxis?.hideTicks,\n      valueAxisLine: this.yAxis?.axisLine,\n      valueDash: this.yAxis?.dash,\n      valueGridDash: this.yAxis?.gridDash,\n      stack: this.stack,\n      horizontal: this.layout === 'horizontal',\n      categoryGapRatio: this.parseRatio(this.categoryGap, 0.3),\n      barGapRatio: this.parseRatio(this.barGap, 0.2),\n      barWidth: this.barWidth,\n      cornerRadius: this.cornerRadius,\n      showLabels: this.showLabels,\n      showTotals: this.showTotals,\n      chevron: this.chevron,\n      polar: this.polar,\n      polarHole: this.polarHole,\n      polarSweep: this.polarSweep,\n      legend: this.legend,\n      axisTicks: this.axisTicks,\n      animation: this.noAnimation ? 'none' : this.animation,\n      animationDuration: this.animationDuration,\n    };\n  }\n\n  private applyEngine(snap = false) {\n    if (!this.engine) return;\n    const t = readMdChartTheme(this.el);\n    this.engine.setSpec(this.buildSpec(t), this.buildEngineTheme(t), {\n      onHover: (idx) => {\n        if (idx < 0) return;\n        // The engine reports indices into what it DREW (the zoom window), so\n        // rebase to an absolute index before reporting / indexing full arrays.\n        const abs = idx + this.winStart();\n        this.mdHover.emit({\n          dataIndex: abs,\n          axisValue: this.xAxis?.data?.[abs],\n          seriesIndices: this.visibleSeriesIndices(),\n        });\n      },\n      onLegendClick: (item) => {\n        this.rememberLegendToggle(item.seriesIndex, !!item.hidden);\n        this.mdLegendClick.emit({\n          seriesIndex: item.seriesIndex,\n          seriesId: this.series[item.seriesIndex]?.id,\n          selected: !item.hidden,\n        });\n      },\n      onPointClick: (si, di, e) => {\n        const s = this.series[si];\n        if (!s) return;\n        const abs = di + this.winStart(); // windowed → absolute (see onHover)\n        this.mdBarClick.emit({\n          seriesIndex: si,\n          seriesId: s.id,\n          dataIndex: abs,\n          value: s.data?.[abs] ?? null,\n          axisValue: this.xAxis?.data?.[abs],\n          nativeEvent: e,\n          series: s,\n        });\n      },\n    }, { animate: !snap });\n    this.engine.setHoverEnabled(this.tooltip !== 'none');\n    this.engine.setClickable(this.clickable);\n    this.engine.setTooltip({ render: this.tooltipRenderer, missingFormatter: this.valueFormatter });\n  }\n\n  private visibleSeriesIndices(): number[] {\n    const hp = this.engine?.getScene()?.hoverPoints;\n    if (hp) return hp.map((h) => h.seriesIndex);\n    return this.series.map((_, i) => i).filter((i) => !this.series[i].hidden);\n  }\n\n  private rebuildA11yTable() {\n    if (!this.a11yTableHost) return;\n    this.a11yTableHost.innerHTML = buildDataTableHtml({\n      title: this.label,\n      xAxisLabel: this.xAxis?.label,\n      xAxisData: this.xAxis?.data,\n      xValueFormatter: this.xAxis?.valueFormatter ?? ((v: MdChartAxisValue) => defaultValueFormatter(v, this.locale)),\n      locale: this.locale,\n      series: this.series,\n      valueFormatter: this.valueFormatter,\n    });\n  }\n\n\n  /**\n   * Walk the data with the keyboard. Without this the readings are reachable\n   * only by hovering, which no keyboard or screen-reader user can do.\n   * Arrows follow the READING direction, so in RTL, Left advances.\n   */\n  private onPlotKeyDown = (e: KeyboardEvent) => {\n    const scene = this.engine?.getScene();\n    const last = Math.max(0, (scene?.xPositions.length ?? 0) - 1);\n    if (!scene || last < 0) return;\n    const rtl = typeof getComputedStyle === 'function' && getComputedStyle(this.el).direction === 'rtl';\n    const forward = rtl ? 'ArrowLeft' : 'ArrowRight';\n    const back = rtl ? 'ArrowRight' : 'ArrowLeft';\n    let next = this.kbIndex;\n    switch (e.key) {\n      case forward:\n        next = this.kbIndex < 0 ? 0 : Math.min(last, this.kbIndex + 1);\n        break;\n      case back:\n        next = this.kbIndex < 0 ? last : Math.max(0, this.kbIndex - 1);\n        break;\n      case 'Home':\n        next = 0;\n        break;\n      case 'End':\n        next = last;\n        break;\n      case 'Escape':\n        if (this.kbIndex < 0) return;\n        next = -1;\n        break;\n      case 'Enter':\n      case ' ':\n      case 'Spacebar': // legacy key name\n        if (this.kbIndex < 0) return;\n        e.preventDefault();\n        this.emitBarClickForCategory(this.kbIndex, e);\n        return;\n      default:\n        return;\n    }\n    e.preventDefault();\n    this.moveKeyboardCursor(next);\n  };\n\n  /** Fire `mdBarClick` for the focused category so a keyboard user can activate a\n   *  bar (e.g. to drill), matching the pointer click. Picks the first visible\n   *  series present at that category. */\n  private emitBarClickForCategory(dataIndex: number, nativeEvent: KeyboardEvent): void {\n    const si = this.visibleSeriesIndices()[0] ?? 0;\n    const s = this.series[si];\n    if (!s) return;\n    // `dataIndex` is the keyboard cursor, which walks the windowed scene —\n    // rebase to absolute before reporting / indexing the full series.\n    const abs = dataIndex + this.winStart();\n    this.mdBarClick.emit({\n      seriesIndex: si,\n      seriesId: s.id,\n      dataIndex: abs,\n      value: s.data?.[abs] ?? null,\n      axisValue: this.xAxis?.data?.[abs],\n      nativeEvent,\n      series: s,\n    });\n  }\n\n  private onPlotBlur = () => {\n    if (this.kbIndex >= 0) this.moveKeyboardCursor(-1);\n  };\n\n  /** Move the keyboard cursor, mirroring it into the hover UI and live region. */\n  private moveKeyboardCursor(next: number) {\n    this.kbIndex = next;\n    this.engine?.focusIndex(next);\n    if (next < 0) {\n      this.announcement = '';\n      return;\n    }\n    const scene = this.engine?.getScene();\n    const xText = scene?.xLabels?.[next] ?? String(next + 1);\n    const yFmt = (v: number) =>\n      this.valueFormatter ? this.valueFormatter(v) : v.toLocaleString(this.locale || undefined);\n    const values = (scene?.hoverPoints ?? [])\n      .map((hp) => {\n        const pt = hp.byIndex[next];\n        return pt ? `${hp.label} ${yFmt(pt.value)}` : null;\n      })\n      .filter(Boolean)\n      .join(', ');\n    this.announcement = this.labelPoint.replace('%x%', xText).replace('%values%', values);\n  }\n\n  render() {\n    const xValues = this.xAxis?.data ?? [];\n    const summary = buildChartSummary({\n      title: this.label, chartType: 'bar', seriesCount: this.series.length,\n      xMin: xValues[0] as MdChartAxisValue | undefined,\n      xMax: xValues[xValues.length - 1] as MdChartAxisValue | undefined,\n    });\n    // While loading, the loader owns the box — an empty-state message under it\n    // answers \"no data\" to a question nobody asked yet.\n    const empty = this.series.length === 0 && !this.loading;\n    return (\n      <Host\n        class={{\n          'md-bar-chart': true,\n          'md-bar-chart--empty': empty,\n          'md-bar-chart--loading': this.loading,\n          'md-bar-chart--mounted': this.mounted,\n          'md-bar-chart--zoom-slider': this.zoomSliderOn,\n          'md-bar-chart--zoom-drag': this.zoomInside,\n          [`md-bar-chart--${this.layout}`]: true,\n        }}\n        role=\"figure\"\n        aria-label={summary}\n        aria-busy={this.loading ? 'true' : null}\n        style={this.heightProp ? { blockSize: this.heightProp } : undefined}\n        onPointerDown={this.onPlotPointerDown}\n        onPointerMove={this.onPointerMove}\n        onPointerUp={this.onPointerUp}\n        onPointerCancel={this.onPointerUp}\n        onDblClick={this.onPlotDblClick}\n      >\n        <header class=\"md-bar-chart__header\" part=\"header\"><slot name=\"header\"></slot></header>\n        <div\n          class=\"md-bar-chart__canvas\"\n          part=\"canvas\"\n          ref={el => this.bindChartHost(el as HTMLDivElement)}\n          tabindex={empty ? undefined : '0'}\n          role={empty ? undefined : 'application'}\n          aria-label={empty ? undefined : this.labelPlot}\n          onKeyDown={this.onPlotKeyDown}\n          onBlur={this.onPlotBlur}\n        ></div>\n        {empty && (\n          <div class=\"md-bar-chart__empty\" part=\"empty\">\n            <slot name=\"empty\">No data to display</slot>\n          </div>\n        )}\n\n        {this.loading && (\n          <div class=\"md-bar-chart__loading\" part=\"loading\" role=\"status\">\n            {/* `loader` is the library-wide name for \"swap the loading affordance\";\n                `loading` is kept as the older alias. Nesting them means either\n                works — the outer slot falls back to the inner one, which falls\n                back to the default below — and `loader` wins if both are given. */}\n            <slot name=\"loader\">\n              <slot name=\"loading\">\n              <md-progress-indicator\n                class=\"md-bar-chart__spinner\"\n                variant=\"circular\"\n                indeterminate\n                label={this.loadingLabel}\n              ></md-progress-indicator>\n              <span class=\"md-bar-chart__loading-text\">{this.loadingLabel}</span>\n            </slot>\n            </slot>\n          </div>\n        )}\n\n        {/* Drag-to-zoom band — purely visual, so it never eats pointer events. */}\n        {this.dragBand && Math.abs(this.dragBand.x2 - this.dragBand.x1) > 1 && (\n          <div\n            class=\"md-bar-chart__zoom-band\"\n            part=\"zoom-band\"\n            style={this.zoomBandStyle()}\n          ></div>\n        )}\n\n        {this.zoomSliderOn && this.renderZoomSlider()}\n\n        <footer class=\"md-bar-chart__footer\" part=\"footer\"><slot name=\"footer\"></slot></footer>\n        <div class=\"md-bar-chart__a11y-table\" ref={el => this.bindA11yTableHost(el as HTMLDivElement)}></div>\n\n        {/* Narrates the keyboard cursor, politely. */}\n        <div class=\"md-bar-chart__live\" role=\"status\" aria-live=\"polite\" aria-atomic=\"true\">\n          {this.announcement}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/components-csr/md-bottom-sheet.js

@@ -0,0 +1,2 @@
+import{p as t,H as e,c as s,h as i,d as o,t as a}from"./p-bSpXNc5J.js";import{d as n}from"./p-R_guULjT.js";import{d}from"./p-C3vB0Hd9.js";const r=()=>`:host{--_container-color:var(--md-bottom-sheet-container-color, var(--md-sys-color-surface-container-low, #F7F2FA));--_container-shape:var(--md-bottom-sheet-container-shape, max(16px, calc(28px + var(--md-sys-density-scale, 0) * 2px)));--_content-color:var(--md-bottom-sheet-content-color, var(--md-sys-color-on-surface, #1C1B1F));--_headline-color:var(--md-bottom-sheet-headline-color, var(--md-sys-color-on-surface, #1C1B1F));--_scrim-color:var(--md-bottom-sheet-scrim-color, rgba(0, 0, 0, 0.32));--_drag-handle-color:var(--md-bottom-sheet-drag-handle-color, var(--md-sys-color-on-surface-variant, #49454F));--_divider-color:var(--md-bottom-sheet-divider-color, var(--md-sys-color-outline-variant, #CAC4D0));--_icon-color:var(--md-bottom-sheet-icon-color, var(--md-sys-color-on-surface-variant, #49454F));--_min-width:var(--md-bottom-sheet-min-width, 0);--_max-width:var(--md-bottom-sheet-max-width, 100%);--_width:var(--md-bottom-sheet-width, 100%);--_min-height:var(--md-bottom-sheet-min-height, 0);--_max-height:var(--md-bottom-sheet-max-height, 80vh);--_height:var(--md-bottom-sheet-height, auto);--_detached-margin:var(--md-bottom-sheet-detached-margin, 16px);--_content-padding-inline:var(--md-bottom-sheet-content-padding-inline, max(12px, calc(24px + var(--md-sys-density-scale, 0) * 2px)));display:contents;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)}:host(:not(.md-bottom-sheet--open)){pointer-events:none}.md-bottom-sheet__scrim{position:fixed;inset:0;background-color:var(--_scrim-color);z-index:var(--md-sys-z-index-popup, 1000);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-bottom-sheet--open) .md-bottom-sheet__scrim{opacity:1;pointer-events:auto}.md-bottom-sheet__container{position:fixed;inset-inline:0;inset-block-end:0;margin-inline:auto;z-index:var(--md-sys-z-index-dialog-scrim, 1001);inline-size:var(--_width);min-inline-size:var(--_min-width);max-inline-size:var(--_max-width);block-size:var(--_height);min-block-size:var(--_min-height);max-block-size:var(--_max-height);background-color:var(--_container-color);color:var(--_content-color);display:flex;flex-direction:column;overflow:hidden;pointer-events:none;opacity:0;transform:translateY(100%);transition:transform var(--md-sys-motion-duration-medium4, 400ms) var(--md-sys-motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)),     opacity var(--md-sys-motion-duration-medium2, 300ms) var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1));padding-block-end:env(safe-area-inset-bottom, 0px);box-sizing:border-box;outline:none}:host(.md-bottom-sheet--open) .md-bottom-sheet__container{pointer-events:auto;opacity:1;transform:translateY(0)}:host(.md-bottom-sheet--standard) .md-bottom-sheet__container{border-start-start-radius:var(--_container-shape);border-start-end-radius:var(--_container-shape);border-end-start-radius:0;border-end-end-radius:0}:host(.md-bottom-sheet--detached) .md-bottom-sheet__container{inset-inline:var(--_detached-margin);inset-block-end:var(--_detached-margin);margin-inline:auto;border-radius:var(--_container-shape);box-shadow:var(--md-sys-elevation-3);max-inline-size:min(var(--_max-width), calc(100% - calc(var(--_detached-margin) * 2)))}@media (max-width: 639.98px){:host{--_width:var(--md-bottom-sheet-width, 100%);--_max-width:var(--md-bottom-sheet-max-width, 100%)}}@media (min-width: 640px){:host{--_width:var(--md-bottom-sheet-width, 640px);--_max-width:var(--md-bottom-sheet-max-width, calc(100% - 112px))}}.md-bottom-sheet__drag-handle{display:flex;justify-content:center;align-items:center;padding-block:max(12px, calc(22px + var(--md-sys-density-scale, 0) * 2px));flex-shrink:0;cursor:grab;touch-action:none;user-select:none}.md-bottom-sheet__drag-handle--dragging{cursor:grabbing}.md-bottom-sheet__drag-handle-indicator{inline-size:max(24px, calc(32px + var(--md-sys-density-scale, 0) * 2px));block-size:max(3px, calc(4px + var(--md-sys-density-scale, 0) * 0.25px));border-radius:2px;background-color:var(--_drag-handle-color);opacity:0.4;transition:opacity var(--md-sys-motion-duration-short2, 100ms) var(--md-sys-motion-easing-standard, ease)}.md-bottom-sheet__drag-handle:hover .md-bottom-sheet__drag-handle-indicator{opacity:0.6}.md-bottom-sheet__drag-handle--dragging .md-bottom-sheet__drag-handle-indicator{opacity:0.8}:host(.md-bottom-sheet--no-drag-handle) .md-bottom-sheet__container{padding-block-start:max(12px, calc(24px + var(--md-sys-density-scale, 0) * 2px))}.md-bottom-sheet__header{display:flex;align-items:center;gap:max(4px, calc(12px + var(--md-sys-density-scale, 0) * 2px));padding-inline:max(12px, calc(24px + var(--md-sys-density-scale, 0) * 2px));padding-block:0 max(4px, calc(8px + var(--md-sys-density-scale, 0) * 1px));flex-shrink:0}.md-bottom-sheet__headline{flex:1;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, 0);color:var(--_headline-color);overflow:hidden;text-overflow:ellipsis;text-align:start}:host([headline-align='center']) .md-bottom-sheet__headline{text-align:center}:host([headline-align='end']) .md-bottom-sheet__headline{text-align:end}.md-bottom-sheet__close{flex-shrink:0;margin-inline-start:auto;margin-inline-end:calc(-12px - var(--md-sys-density-scale, 0) * 1px)}.md-bottom-sheet__close md-icon-button{--md-icon-button-icon-color:var(--_icon-color);--md-icon-button-container-width:max(32px, calc(40px + var(--md-sys-density-scale, 0) * 4px));--md-icon-button-container-height:max(32px, calc(40px + var(--md-sys-density-scale, 0) * 4px));--md-icon-button-icon-size:max(18px, calc(24px + var(--md-sys-density-scale, 0) * 1px))}.md-bottom-sheet__divider{block-size:1px;background-color:var(--_divider-color);flex-shrink:0}.md-bottom-sheet__divider--bottom{margin-block-start:auto}.md-bottom-sheet__content{flex:1 1 auto;min-block-size:0;display:flex;flex-direction:column;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:inherit;letter-spacing:inherit;color:var(--_content-color);text-align:start}:host([content-align='center']) .md-bottom-sheet__content{text-align:center}:host([content-align='end']) .md-bottom-sheet__content{text-align:end}.md-bottom-sheet__content{overflow-y:auto;padding-inline:var(--_content-padding-inline);padding-block:var(--md-sys-spacing-inset-sm, 8px) var(--md-sys-spacing-inset-lg, 16px);scrollbar-width:thin;scrollbar-color:var(--md-sys-color-outline-variant, #CAC4D0) transparent}.md-bottom-sheet__content::-webkit-scrollbar{inline-size:4px}.md-bottom-sheet__content::-webkit-scrollbar-thumb{background-color:var(--md-sys-color-outline-variant, #CAC4D0);border-radius:2px}.md-bottom-sheet__content::-webkit-scrollbar-track{background-color:transparent}.md-bottom-sheet__actions{display:flex;align-items:center;gap:var(--md-sys-spacing-gap-sm, 8px);padding-inline:var(--md-sys-spacing-inset-xl, 24px);padding-block:var(--md-sys-spacing-inset-lg, 16px) var(--md-sys-spacing-inset-xl, 24px);flex-shrink:0;box-sizing:border-box}::slotted([slot="actions"]){flex-shrink:0}.md-bottom-sheet__focus-guard{position:fixed;overflow:hidden;clip-path:inset(50%);inline-size:1px;block-size:1px;padding:0;border:0;margin:-1px;white-space:nowrap}.md-bottom-sheet__container:focus-visible{outline:3px solid var(--md-sys-color-secondary, #625B71);outline-offset:-3px}@media (prefers-reduced-motion: reduce){.md-bottom-sheet__container,.md-bottom-sheet__scrim{transition:none}}@media (forced-colors: active){.md-bottom-sheet__container{border:1px solid CanvasText}.md-bottom-sheet__divider{background-color:CanvasText}.md-bottom-sheet__drag-handle-indicator{background-color:CanvasText;opacity:1}}: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=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.mdOpen=s(this,"mdOpen",7);this.mdClose=s(this,"mdClose",7);this.mdCancel=s(this,"mdCancel",7);this.open=false;this.variant="standard";this.headline="";this.showDragHandle=true;this.closeable=false;this.scrimDismissible=true;this.topDivider=false;this.bottomDivider=false;this.sheetAriaLabel="";this.scrollShadow=true;this.headlineAlign="start";this.contentAlign="start";this.density=0;this.hasSlottedClose=false;this.hasActions=false;this.dragging=false;this.previousFocus=null;this.headlineId=`md-bottom-sheet-headline-${Math.random().toString(36).slice(2)}`;this.dragStartY=0;this.dragCurrentY=0;this.DISMISS_THRESHOLD=100;this.handleDocKeyDown=t=>{if(!this.open)return;if(t.key==="Escape"){t.preventDefault();t.stopPropagation();this.mdCancel.emit();this.open=false}};this.handleDocFocusIn=()=>{if(!this.open)return;const t=document.activeElement;if(!t)return;if(t===this.el||this.el.contains(t))return;const e=this.containerEl?.contains(t);if(e)return;this.focusFirst()};this.handleStartGuardFocus=()=>{const t=this.getFocusableElements();if(t.length>0){t[t.length-1].focus()}else{this.containerEl?.focus()}};this.handleEndGuardFocus=()=>{const t=this.getFocusableElements();if(t.length>0){t[0].focus()}else{this.containerEl?.focus()}};this.handleScrimClick=()=>{if(!this.scrimDismissible)return;this.mdCancel.emit();this.open=false};this.handleCloseClick=()=>{this.mdCancel.emit();this.open=false};this.handleDragStart=t=>{if(!this.open||!this.showDragHandle)return;this.dragging=true;this.dragStartY=t.clientY;this.dragCurrentY=0;if(this.containerEl){this.containerEl.style.transition="none"}t.target.setPointerCapture(t.pointerId)};this.handleDragMove=t=>{if(!this.dragging)return;const e=t.clientY-this.dragStartY;this.dragCurrentY=Math.max(0,e);if(this.containerEl){this.containerEl.style.transform=`translateY(${this.dragCurrentY}px)`}};this.handleDragEnd=()=>{if(!this.dragging)return;this.dragging=false;if(this.containerEl){this.containerEl.style.transition=""}if(this.dragCurrentY>this.DISMISS_THRESHOLD){this.mdCancel.emit();this.open=false}else if(this.containerEl){this.containerEl.style.transform=""}this.dragCurrentY=0}}connectedCallback(){this.hasActions=!!this.el.querySelector('[slot="actions"]')}componentWillLoad(){this.hasSlottedClose=Array.from(this.el.children).some((t=>t.getAttribute("slot")==="close"))}componentDidLoad(){const t=this.el.shadowRoot;if(!t)return;const e=t.querySelector('slot[name="close"]');const s=t.querySelector('slot[name="actions"]');e?.addEventListener("slotchange",(()=>{this.hasSlottedClose=e.assignedElements().length>0}));s?.addEventListener("slotchange",(()=>{this.hasActions=s.assignedElements().length>0}));if(this.open){this.onOpenChange(true)}}disconnectedCallback(){this.removeGlobalListeners();document.body.style.overflow=""}onOpenChange(t){if(t){this.previousFocus=document.activeElement;document.body.style.overflow="hidden";this.addGlobalListeners();requestAnimationFrame((()=>{this.containerEl?.removeAttribute("inert");this.focusFirst()}));this.mdOpen.emit()}else{this.removeGlobalListeners();document.body.style.overflow="";this.previousFocus?.focus?.({preventScroll:true});this.previousFocus=null;if(this.containerEl){this.containerEl.style.transform=""}this.mdClose.emit()}}async show(){this.open=true}async close(){this.open=false}addGlobalListeners(){document.addEventListener("keydown",this.handleDocKeyDown,true);document.addEventListener("focusin",this.handleDocFocusIn)}removeGlobalListeners(){document.removeEventListener("keydown",this.handleDocKeyDown,true);document.removeEventListener("focusin",this.handleDocFocusIn)}focusFirst(){if(!this.containerEl)return;const t=this.getFocusableElements();if(t.length>0){t[0].focus()}else{this.containerEl.focus()}}getFocusableElements(){const t='a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex="-1"]), md-icon-button:not([disabled]), md-button:not([disabled]), md-text-field:not([disabled]), md-checkbox:not([disabled]), md-switch:not([disabled]), md-radio:not([disabled]), md-slider:not([disabled])';const e=Array.from(this.containerEl?.querySelectorAll(t)??[]).filter((t=>!t.classList.contains("md-bottom-sheet__focus-guard")));const s=this.containerEl?.querySelectorAll("slot")??[];const i=[];s.forEach((e=>{const s=e.assignedElements({flatten:true});s.forEach((e=>{if(e.matches?.(t)){i.push(e)}const s=e.querySelectorAll?.(t);if(s)i.push(...Array.from(s))}))}));return[...e,...i]}render(){const t=!!this.headline;const e=t||this.closeable||this.hasSlottedClose;return i(o,{key:"ee9aaf1a07d8eb9cb2f41803bf34a50a3732910a",class:{"md-bottom-sheet":true,[`md-bottom-sheet--${this.variant}`]:true,"md-bottom-sheet--open":this.open,"md-bottom-sheet--no-drag-handle":!this.showDragHandle}},i("div",{key:"396b506ca18251d2791d1445b3476602a00f344f",class:"md-bottom-sheet__scrim",part:"scrim","aria-hidden":"true",onClick:this.handleScrimClick}),i("div",{key:"3d86789a8f297772f6f951a23d0f61bb66ba585d",class:"md-bottom-sheet__container",part:"container",role:"dialog","aria-modal":"true","aria-labelledby":t?this.headlineId:undefined,"aria-label":this.sheetAriaLabel||(!t?"Bottom sheet":undefined),"aria-hidden":!this.open?"true":undefined,inert:!this.open,tabindex:-1,ref:t=>this.containerEl=t},i("span",{key:"33f1833c6e37ad867411ab883a8b4413fc2737e8",class:"md-bottom-sheet__focus-guard",tabindex:0,"aria-hidden":"true",onFocus:this.handleEndGuardFocus}),this.showDragHandle&&i("div",{key:"4f855aec9da649004422efa2dfa869792f2fa554",class:{"md-bottom-sheet__drag-handle":true,"md-bottom-sheet__drag-handle--dragging":this.dragging},part:"drag-handle","aria-hidden":"true",onPointerDown:this.handleDragStart,onPointerMove:this.handleDragMove,onPointerUp:this.handleDragEnd,onPointerCancel:this.handleDragEnd},i("div",{key:"76da30ada36ef53052130ead104bc15427cab05f",class:"md-bottom-sheet__drag-handle-indicator",part:"drag-handle-indicator"})),e&&i("div",{key:"1e56e5fe59cb5e6a1a164da5b8ce2a87ea2adc3d",class:"md-bottom-sheet__header",part:"header"},t&&i("span",{key:"8fe97bc3cf784111ff82410a0238f7c7c0897b71",id:this.headlineId,class:"md-bottom-sheet__headline",part:"headline"},i("slot",{key:"30b6da3d283ca5c99265950465d61405051d4983",name:"headline"},this.headline)),(this.closeable||this.hasSlottedClose)&&i("div",{key:"b485c3896dd50733e432b7bed194e7130f4c5612",class:"md-bottom-sheet__close",part:"close"},i("slot",{key:"cfd23b597ec9bb2748c8f02055b0bee69ecdfec8",name:"close"},i("md-icon-button",{key:"a7f597d5fc4e76b2ea063e9db2e1cf7407819302",variant:"standard",icon:"close","aria-label":"Close bottom sheet",onClick:this.handleCloseClick})))),this.topDivider&&i("div",{key:"7394a9ce1c36c9ce16a3485ebf3dcf7bb5f71059",class:"md-bottom-sheet__divider",part:"divider-top","aria-hidden":"true"}),i("div",{key:"7b5de96c437a159bfc7fdcfad2f2296b62efd419",class:"md-bottom-sheet__content",part:"content"},i("slot",{key:"fefde953467f1f08960b46af3dd56da67fccc88e"})),this.hasActions&&this.bottomDivider&&i("div",{key:"df44b71b94ce36c04e9a2a8f3bcbbaee263a095f",class:"md-bottom-sheet__divider md-bottom-sheet__divider--bottom",part:"divider-bottom","aria-hidden":"true"}),this.hasActions&&i("div",{key:"64e0cb7fd2eee8c39b7681784a78bfb18cd6b1c1",class:"md-bottom-sheet__actions",part:"actions"},i("slot",{key:"68cdbde2476e1d9b16ea0c3272796220d3ab23fd",name:"actions"})),i("span",{key:"84bbb8c92ccc5f681c8096223b1727135e0b189f",class:"md-bottom-sheet__focus-guard",tabindex:0,"aria-hidden":"true",onFocus:this.handleStartGuardFocus})))}get el(){return this}static get watchers(){return{open:[{onOpenChange:0}]}}static get style(){return r()}},[257,"md-bottom-sheet",{open:[1540],variant:[513],headline:[1],showDragHandle:[516,"show-drag-handle"],closeable:[516],scrimDismissible:[4,"scrim-dismissible"],topDivider:[516,"top-divider"],bottomDivider:[516,"bottom-divider"],sheetAriaLabel:[1,"aria-label"],scrollShadow:[516,"scroll-shadow"],headlineAlign:[513,"headline-align"],contentAlign:[513,"content-align"],density:[514],hasSlottedClose:[32],hasActions:[32],dragging:[32],show:[64],close:[64]},undefined,{open:[{onOpenChange:0}]}]);function m(){if(typeof customElements==="undefined"){return}const t=["md-bottom-sheet","md-icon-button","md-ripple"];t.forEach((t=>{switch(t){case"md-bottom-sheet":if(!customElements.get(a(t))){customElements.define(a(t),c)}break;case"md-icon-button":if(!customElements.get(a(t))){n()}break;case"md-ripple":if(!customElements.get(a(t))){d()}break}}))}m();const h=c;const l=m;export{h as MdBottomSheet,l as defineCustomElement};
+//# sourceMappingURL=md-bottom-sheet.js.map

package/dist/components-csr/md-bottom-sheet.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["mdBottomSheetCss","MdBottomSheet","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","open","variant","headline","showDragHandle","closeable","scrimDismissible","topDivider","bottomDivider","sheetAriaLabel","scrollShadow","headlineAlign","contentAlign","density","hasSlottedClose","hasActions","dragging","previousFocus","headlineId","Math","random","toString","slice","dragStartY","dragCurrentY","DISMISS_THRESHOLD","handleDocKeyDown","e","key","preventDefault","stopPropagation","mdCancel","emit","handleDocFocusIn","active","document","activeElement","el","contains","isShadowEl","containerEl","focusFirst","handleStartGuardFocus","focusable","getFocusableElements","length","focus","handleEndGuardFocus","handleScrimClick","handleCloseClick","handleDragStart","clientY","style","transition","target","setPointerCapture","pointerId","handleDragMove","deltaY","max","transform","handleDragEnd","connectedCallback","querySelector","componentWillLoad","Array","from","children","some","c","getAttribute","componentDidLoad","shadow","shadowRoot","closeSlot","actionsSlot","addEventListener","assignedElements","onOpenChange","disconnectedCallback","removeGlobalListeners","body","overflow","newVal","addGlobalListeners","requestAnimationFrame","removeAttribute","mdOpen","preventScroll","mdClose","show","close","removeEventListener","selector","shadowEls","querySelectorAll","filter","classList","slots","slottedEls","forEach","slot","assigned","flatten","matches","push","nested","render","hasHeadline","showHeader","h","Host","class","part","onClick","role","undefined","inert","tabindex","ref","onFocus","onPointerDown","onPointerMove","onPointerUp","onPointerCancel","id","name","icon"],"sources":["src/components/md-bottom-sheet/md-bottom-sheet.css?tag=md-bottom-sheet&encapsulation=shadow","src/components/md-bottom-sheet/md-bottom-sheet.tsx"],"sourcesContent":["/* ==========================================================\n   md-bottom-sheet — Material Design 3 Bottom Sheet\n   Spec: https://m3.material.io/components/bottom-sheets/overview\n\n   Both variants are modal dialogs (scrim + focus trap + Escape +\n   body scroll lock + drag-to-dismiss). The variant only changes the\n   chrome:\n     - `standard` (default): anchored to the bottom edge, top corners\n       rounded only.\n     - `detached`: floats with margin on every side, all corners\n       rounded.\n\n   PUBLIC CSS CUSTOM PROPERTIES (override per-instance):\n     --md-bottom-sheet-container-color       Container background\n     --md-bottom-sheet-container-shape       Corner radius (top corners\n                                             on standard, all corners\n                                             on detached)\n     --md-bottom-sheet-content-color         Content text color\n     --md-bottom-sheet-headline-color        Headline text color\n     --md-bottom-sheet-scrim-color           Scrim overlay color\n     --md-bottom-sheet-drag-handle-color     Drag handle indicator color\n     --md-bottom-sheet-divider-color         Top / bottom divider color\n     --md-bottom-sheet-icon-color            Close icon color\n\n     --md-bottom-sheet-width                 Inline size (default 100%\n                                             on mobile, 640px ≥ 640px\n                                             viewport)\n     --md-bottom-sheet-min-width             Minimum inline size\n     --md-bottom-sheet-max-width             Maximum inline size\n\n     --md-bottom-sheet-height                Block size (default `auto`)\n     --md-bottom-sheet-min-height            Minimum block size\n     --md-bottom-sheet-max-height            Maximum block size\n                                             (default 80vh)\n\n     --md-bottom-sheet-detached-margin       Margin around the container\n                                             on the detached variant\n\n     --md-bottom-sheet-content-padding-inline\n                                             Inline padding inside the\n                                             scrollable area. Default 24 px\n                                             matches the MD3 spec gutter for\n                                             prose. Set to `0` for\n                                             edge-to-edge content (lists,\n                                             carousels, tables) — the\n                                             scrollbar will then sit flush\n                                             with the container edge.\n\n   CSS PARTS:\n     scrim                       Scrim overlay\n     container                   Sheet surface\n     drag-handle                 Drag handle hit area\n     drag-handle-indicator       Drag handle visible bar\n     header                      Header row\n     headline                    Headline text\n     close                       Close button wrapper\n     divider-top                 Divider between header and content\n     divider-bottom              Divider between content and actions\n     content                     Content area wrapper (inline padding)\n     content-viewport            Inner scroll viewport (block padding)\n     content-shadow-block-start  Top scroll shadow gradient\n     content-shadow-block-end    Bottom scroll shadow gradient\n     actions                     Bottom action bar\n\n   ATTRIBUTES (drive layout / variants):\n     headline-align    start (default) | center | end — inline-axis\n                       text-align of the headline. Logical: flips with\n                       dir=\"rtl\".\n     content-align     start (default) | center | end — inline-axis\n                       text-align of the slotted body content.\n                       Inherits to all default-slot children unless\n                       they override it.\n\n   SLOTS:\n     (default)   Main content\n     headline    Custom headline content\n     actions     Bottom action buttons\n     close       Custom close element\n   ========================================================== */\n\n/* ==========================================================\n   1. HOST\n   ========================================================== */\n\n:host {\n  --_container-color: var(--md-bottom-sheet-container-color, var(--md-sys-color-surface-container-low, #F7F2FA));\n  --_container-shape: var(--md-bottom-sheet-container-shape, max(16px, calc(28px + var(--md-sys-density-scale, 0) * 2px)));\n  --_content-color: var(--md-bottom-sheet-content-color, var(--md-sys-color-on-surface, #1C1B1F));\n  --_headline-color: var(--md-bottom-sheet-headline-color, var(--md-sys-color-on-surface, #1C1B1F));\n  --_scrim-color: var(--md-bottom-sheet-scrim-color, rgba(0, 0, 0, 0.32));\n  --_drag-handle-color: var(--md-bottom-sheet-drag-handle-color, var(--md-sys-color-on-surface-variant, #49454F));\n  --_divider-color: var(--md-bottom-sheet-divider-color, var(--md-sys-color-outline-variant, #CAC4D0));\n  --_icon-color: var(--md-bottom-sheet-icon-color, var(--md-sys-color-on-surface-variant, #49454F));\n\n  --_min-width: var(--md-bottom-sheet-min-width, 0);\n  --_max-width: var(--md-bottom-sheet-max-width, 100%);\n  --_width: var(--md-bottom-sheet-width, 100%);\n\n  --_min-height: var(--md-bottom-sheet-min-height, 0);\n  --_max-height: var(--md-bottom-sheet-max-height, 80vh);\n  --_height: var(--md-bottom-sheet-height, auto);\n\n  --_detached-margin: var(--md-bottom-sheet-detached-margin, 16px);\n\n  /* Inline padding for the scroll area. Lives on the host so it\n     resolves once and is referenced from both the scroll-shadow ON\n     path (applied to the inner viewport) and the scroll-shadow OFF\n     fallback (applied to .content directly). */\n  --_content-padding-inline: var(--md-bottom-sheet-content-padding-inline, max(12px, calc(24px + var(--md-sys-density-scale, 0) * 2px)));\n\n  display: contents;\n\n  /* MD3 body-medium typescale — set on :host so it inherits through to\n     slotted content (which lives in light DOM and only inherits from the\n     host element, not from shadow-DOM rules). Components inside (md-list,\n     md-button, etc.) override these with their own typescales.\n     NOTE: never use `--md-sys-typescale-*-font` for `font-family` — that\n     token is the `font` shorthand (e.g. `400 14px/20px Roboto, sans-serif`)\n     and is invalid for `font-family`, which silently kills the rule. */\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:host(:not(.md-bottom-sheet--open)) {\n  pointer-events: none;\n}\n\n/* ==========================================================\n   2. SCRIM\n   ========================================================== */\n\n.md-bottom-sheet__scrim {\n  position: fixed;\n  inset: 0;\n  background-color: var(--_scrim-color);\n  z-index: var(--md-sys-z-index-popup, 1000);\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-bottom-sheet--open) .md-bottom-sheet__scrim {\n  opacity: 1;\n  pointer-events: auto;\n}\n\n/* ==========================================================\n   3. CONTAINER (shared by both variants)\n   ========================================================== */\n\n.md-bottom-sheet__container {\n  position: fixed;\n  inset-inline: 0;\n  inset-block-end: 0;\n  margin-inline: auto;\n  z-index: var(--md-sys-z-index-dialog-scrim, 1001);\n\n  inline-size: var(--_width);\n  min-inline-size: var(--_min-width);\n  max-inline-size: var(--_max-width);\n  block-size: var(--_height);\n  min-block-size: var(--_min-height);\n  max-block-size: var(--_max-height);\n\n  background-color: var(--_container-color);\n  color: var(--_content-color);\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  pointer-events: none;\n  opacity: 0;\n  transform: translateY(100%);\n  transition:\n    transform var(--md-sys-motion-duration-medium4, 400ms) var(--md-sys-motion-easing-emphasized, cubic-bezier(0.2, 0, 0, 1)),\n    opacity var(--md-sys-motion-duration-medium2, 300ms) var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1));\n  padding-block-end: env(safe-area-inset-bottom, 0px);\n  box-sizing: border-box;\n  outline: none;\n}\n\n:host(.md-bottom-sheet--open) .md-bottom-sheet__container {\n  pointer-events: auto;\n  opacity: 1;\n  transform: translateY(0);\n}\n\n/* ==========================================================\n   4. STANDARD VARIANT — anchored to bottom edge\n   ========================================================== */\n\n:host(.md-bottom-sheet--standard) .md-bottom-sheet__container {\n  border-start-start-radius: var(--_container-shape);\n  border-start-end-radius: var(--_container-shape);\n  border-end-start-radius: 0;\n  border-end-end-radius: 0;\n}\n\n/* ==========================================================\n   5. DETACHED VARIANT — floats with margin on every side\n   ========================================================== */\n\n:host(.md-bottom-sheet--detached) .md-bottom-sheet__container {\n  inset-inline: var(--_detached-margin);\n  inset-block-end: var(--_detached-margin);\n  margin-inline: auto;\n  border-radius: var(--_container-shape);\n  box-shadow: var(--md-sys-elevation-3);\n  /* Reserve the margin on either side so a 100% width cap works visually. */\n  max-inline-size: min(var(--_max-width), calc(100% - calc(var(--_detached-margin) * 2)));\n}\n\n/* ==========================================================\n   6. RESPONSIVE — modal width breakpoint at 640px\n   ========================================================== */\n\n/* Mobile: full-width edge-to-edge — the rounded top corners give it\n   visual separation from the viewport. */\n@media (max-width: 639.98px) {\n  :host {\n    --_width: var(--md-bottom-sheet-width, 100%);\n    --_max-width: var(--md-bottom-sheet-max-width, 100%);\n  }\n}\n\n/* Desktop: centred 640px panel per spec. */\n@media (min-width: 640px) {\n  :host {\n    --_width: var(--md-bottom-sheet-width, 640px);\n    --_max-width: var(--md-bottom-sheet-max-width, calc(100% - 112px));\n  }\n}\n\n/* ==========================================================\n   7. DRAG HANDLE\n   ========================================================== */\n\n.md-bottom-sheet__drag-handle {\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  padding-block: max(12px, calc(22px + var(--md-sys-density-scale, 0) * 2px));\n  flex-shrink: 0;\n  cursor: grab;\n  touch-action: none;\n  user-select: none;\n}\n\n.md-bottom-sheet__drag-handle--dragging {\n  cursor: grabbing;\n}\n\n.md-bottom-sheet__drag-handle-indicator {\n  inline-size: max(24px, calc(32px + var(--md-sys-density-scale, 0) * 2px));\n  block-size: max(3px, calc(4px + var(--md-sys-density-scale, 0) * 0.25px));\n  border-radius: 2px;\n  background-color: var(--_drag-handle-color);\n  opacity: 0.4;\n  transition: opacity var(--md-sys-motion-duration-short2, 100ms) var(--md-sys-motion-easing-standard, ease);\n}\n\n.md-bottom-sheet__drag-handle:hover .md-bottom-sheet__drag-handle-indicator {\n  opacity: 0.6;\n}\n\n.md-bottom-sheet__drag-handle--dragging .md-bottom-sheet__drag-handle-indicator {\n  opacity: 0.8;\n}\n\n/* When no drag handle, restore the spec's 24px top padding inside the\n   container so the headline isn't flush with the top edge. */\n:host(.md-bottom-sheet--no-drag-handle) .md-bottom-sheet__container {\n  padding-block-start: max(12px, calc(24px + var(--md-sys-density-scale, 0) * 2px));\n}\n\n/* ==========================================================\n   8. HEADER — headline + close\n   ========================================================== */\n\n.md-bottom-sheet__header {\n  display: flex;\n  align-items: center;\n  gap: max(4px, calc(12px + var(--md-sys-density-scale, 0) * 2px));\n  padding-inline: max(12px, calc(24px + var(--md-sys-density-scale, 0) * 2px));\n  padding-block: 0 max(4px, calc(8px + var(--md-sys-density-scale, 0) * 1px));\n  flex-shrink: 0;\n}\n\n.md-bottom-sheet__headline {\n  flex: 1;\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, 0);\n  color: var(--_headline-color);\n  overflow: hidden;\n  text-overflow: ellipsis;\n  /* Reset to logical start so the host's parent text-align (e.g. the\n     Storybook decorator's `text-align: center`) does not bleed in.\n     The alignment is then driven exclusively by the\n     `headline-align` attribute below. */\n  text-align: start;\n}\n\n/* Headline alignment variants — controlled by the `headline-align`\n   attribute on the host. We match the host instead of the .headline\n   element so consumers can drive both prop-supplied and slotted\n   headlines with a single attribute. */\n:host([headline-align='center']) .md-bottom-sheet__headline {\n  text-align: center;\n}\n\n:host([headline-align='end']) .md-bottom-sheet__headline {\n  text-align: end;\n}\n\n.md-bottom-sheet__close {\n  flex-shrink: 0;\n  /* Anchor the close button to the trailing edge whether or not the\n     headline is rendered. The negative end margin pulls it back so\n     the icon-button's invisible hit area doesn't push the close past\n     the header's gutter. Scales with density to stay aligned. */\n  margin-inline-start: auto;\n  margin-inline-end: calc(-12px - var(--md-sys-density-scale, 0) * 1px);\n}\n\n.md-bottom-sheet__close md-icon-button {\n  --md-icon-button-icon-color: var(--_icon-color);\n  --md-icon-button-container-width: max(32px, calc(40px + var(--md-sys-density-scale, 0) * 4px));\n  --md-icon-button-container-height: max(32px, calc(40px + var(--md-sys-density-scale, 0) * 4px));\n  --md-icon-button-icon-size: max(18px, calc(24px + var(--md-sys-density-scale, 0) * 1px));\n}\n\n/* No `::slotted([slot=\"close\"]) { color }` rule. ::slotted() from the\n   outer tree wins over the slotted component's own `:host { color }`\n   regardless of specificity (Shadow DOM cascade), so blanket-setting\n   color here would clobber the slotted component's intended label /\n   icon colour — e.g. an `md-button slot=\"close\" variant=\"text\"` would\n   lose its primary tint and render as muted on-surface-variant text.\n   Slotted components style themselves; bare icons (svg, span, etc.)\n   still inherit the bottom-sheet host's content color via the normal\n   cascade, so they remain legible by default. */\n\n/* ==========================================================\n   9. DIVIDERS\n   ========================================================== */\n\n.md-bottom-sheet__divider {\n  block-size: 1px;\n  background-color: var(--_divider-color);\n  flex-shrink: 0;\n}\n\n.md-bottom-sheet__divider--bottom {\n  margin-block-start: auto;\n}\n\n/* ==========================================================\n   10. CONTENT — scrollable body\n   ========================================================== */\n\n.md-bottom-sheet__content {\n  /* Make this a flex column container so its single child (either the\n     <md-scroll-shadow> or the bare <slot> in the opt-out mode) gets a\n     definite, flex-resolved block-size to scroll inside. We use\n     `flex: 1 1 auto` (basis = max-content) rather than `flex: 1`\n     (basis = 0) so the projected content's intrinsic block-size\n     propagates up to the container's `block-size: auto` calculation —\n     otherwise the container collapses to its chrome-only intrinsic\n     size and the sheet renders far shorter than `max-block-size: 80vh`\n     when the content would actually fill that space. `min-block-size:\n     0` then lets the content shrink below its intrinsic size so the\n     inner viewport (also flexing) can be the real scroll surface. */\n  flex: 1 1 auto;\n  min-block-size: 0;\n  display: flex;\n  flex-direction: column;\n  /* No inline padding here. The gutter lives inside the scroll\n     viewport (or, when scroll-shadow is opted out, on .content\n     directly via the rule below) so the scrollbar sits flush with\n     the container's inline edge instead of inset by the gutter.\n     Override the gutter via `--md-bottom-sheet-content-padding-inline`\n     (set to `0` for edge-to-edge content). */\n  /* Inherit body-medium typescale from :host so any shadow-DOM-only text\n     here renders consistently. Slotted content already inherits these\n     via the host element. */\n  font-family: inherit;\n  font-size: inherit;\n  font-weight: inherit;\n  line-height: inherit;\n  letter-spacing: inherit;\n  color: var(--_content-color);\n  /* Reset to logical start so the host's parent text-align does not\n     bleed into slotted content. Slotted children inherit text-align\n     through the flattened tree from this element (the slot's parent),\n     so this is what controls their default alignment. The\n     `content-align` attribute below overrides for `center` / `end`. */\n  text-align: start;\n}\n\n/* Content alignment variants — drive every text-align inside the body\n   from the host attribute. Slotted children inherit text-align through\n   the flattened tree, so setting it here propagates into prose, lists,\n   forms, and any other default-slot content unless they set their own\n   text-align explicitly. */\n:host([content-align='center']) .md-bottom-sheet__content {\n  text-align: center;\n}\n\n:host([content-align='end']) .md-bottom-sheet__content {\n  text-align: end;\n}\n\n/* The content area is the scroll surface. All padding lives inside it so the\n   scrollbar sits flush with the container's inline edge instead of inset by the\n   gutter. Override the inline gutter via\n   `--md-bottom-sheet-content-padding-inline` (default 24px, or 0 for\n   edge-to-edge content). */\n.md-bottom-sheet__content {\n  overflow-y: auto;\n  padding-inline: var(--_content-padding-inline);\n  padding-block: var(--md-sys-spacing-inset-sm, 8px) var(--md-sys-spacing-inset-lg, 16px);\n  scrollbar-width: thin;\n  scrollbar-color: var(--md-sys-color-outline-variant, #CAC4D0) transparent;\n}\n\n.md-bottom-sheet__content::-webkit-scrollbar {\n  inline-size: 4px;\n}\n\n.md-bottom-sheet__content::-webkit-scrollbar-thumb {\n  background-color: var(--md-sys-color-outline-variant, #CAC4D0);\n  border-radius: 2px;\n}\n\n.md-bottom-sheet__content::-webkit-scrollbar-track {\n  background-color: transparent;\n}\n\n/* ==========================================================\n   11. ACTIONS — bottom button bar\n   ========================================================== */\n\n.md-bottom-sheet__actions {\n  display: flex;\n  align-items: center;\n  gap: var(--md-sys-spacing-gap-sm, 8px);\n  padding-inline: var(--md-sys-spacing-inset-xl, 24px);\n  padding-block: var(--md-sys-spacing-inset-lg, 16px) var(--md-sys-spacing-inset-xl, 24px);\n  flex-shrink: 0;\n  box-sizing: border-box;\n}\n\n::slotted([slot=\"actions\"]) {\n  flex-shrink: 0;\n}\n\n/* ==========================================================\n   12. FOCUS GUARDS (sentinel elements for focus trap)\n   ========================================================== */\n\n.md-bottom-sheet__focus-guard {\n  position: fixed;\n  overflow: hidden;\n  clip-path: inset(50%);\n  inline-size: 1px;\n  block-size: 1px;\n  padding: 0;\n  border: 0;\n  margin: -1px;\n  white-space: nowrap;\n}\n\n/* ==========================================================\n   13. FOCUS RING\n   ========================================================== */\n\n.md-bottom-sheet__container:focus-visible {\n  outline: 3px solid var(--md-sys-color-secondary, #625B71);\n  outline-offset: -3px;\n}\n\n/* ==========================================================\n   14. REDUCED MOTION\n   ========================================================== */\n\n@media (prefers-reduced-motion: reduce) {\n  .md-bottom-sheet__container,\n  .md-bottom-sheet__scrim {\n    transition: none;\n  }\n}\n\n/* ==========================================================\n   15. FORCED COLORS (Windows High Contrast)\n   ========================================================== */\n\n@media (forced-colors: active) {\n  .md-bottom-sheet__container {\n    border: 1px solid CanvasText;\n  }\n\n  .md-bottom-sheet__divider {\n    background-color: CanvasText;\n  }\n\n  .md-bottom-sheet__drag-handle-indicator {\n    background-color: CanvasText;\n    opacity: 1;\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 {\n  Component,\n  Host,\n  h,\n  Prop,\n  Event,\n  EventEmitter,\n  Method,\n  Watch,\n  State,\n  Element,\n} from '@stencil/core';\n\n/**\n * MD3 Bottom sheet — secondary content anchored to the bottom of the screen.\n *\n * Two variants per the M3 spec\n * (https://m3.material.io/components/bottom-sheets/overview). Both are\n * modal dialogs — they always render a scrim, trap focus, lock body\n * scroll, close on Escape, and support drag-to-dismiss.\n *\n * - `standard` (default) — anchored to the bottom edge of the viewport.\n *   Full-width up to a responsive max, with rounded top corners only.\n * - `detached` — floats with a margin on every side and rounded corners\n *   on every side. Best for compact, dialog-like sheets on larger\n *   screens.\n *\n * Width and height are entirely token-driven, so the only thing you\n * change to switch from anchored to floating chrome is the `variant`\n * attribute. The default media query reflows the sheet between\n * full-width on mobile and a centred 640px panel on desktop; consumers\n * can opt out via `--md-bottom-sheet-width` / `--md-bottom-sheet-max-width`.\n *\n * @slot - Main content\n * @slot headline - Custom headline content\n * @slot actions - Bottom action buttons (optional)\n * @slot close - Custom close element (replaces default close icon button)\n *\n * @part scrim - Scrim overlay\n * @part container - Sheet surface\n * @part drag-handle - Drag handle hit area\n * @part drag-handle-indicator - Drag handle visible bar\n * @part header - Header row (headline + close)\n * @part headline - Headline text\n * @part close - Close button wrapper\n * @part divider-top - Top divider (between header and content)\n * @part divider-bottom - Bottom divider (between content and actions)\n * @part content - Content area wrapper (inline padding, edge-to-edge frame); the content scrolls directly here\n * @part actions - Bottom action bar\n */\n@Component({\n  tag: 'md-bottom-sheet',\n  styleUrl: 'md-bottom-sheet.css',\n  shadow: true,\n})\nexport class MdBottomSheet {\n  @Element() el!: HTMLElement;\n\n  /** Whether the sheet is visible */\n  @Prop({ mutable: true, reflect: true }) open: boolean = false;\n\n  /**\n   * `standard` (default) anchors the sheet to the bottom edge.\n   * `detached` floats it with margin on every side.\n   * Both variants always render a scrim and trap focus.\n   */\n  @Prop({ reflect: true }) variant: 'standard' | 'detached' = 'standard';\n\n  /** Headline text (or use the `headline` slot) */\n  @Prop() headline: string = '';\n\n  /** Show the drag handle indicator */\n  @Prop({ reflect: true, attribute: 'show-drag-handle' })\n  showDragHandle: boolean = true;\n\n  /** Show a close icon-button in the top-end corner of the header */\n  @Prop({ reflect: true }) closeable: boolean = false;\n\n  /** Whether clicking the scrim closes the sheet */\n  @Prop({ attribute: 'scrim-dismissible' }) scrimDismissible: boolean = true;\n\n  /** Show divider between header and content */\n  @Prop({ reflect: true, attribute: 'top-divider' }) topDivider: boolean =\n    false;\n\n  /** Show divider between content and actions */\n  @Prop({ reflect: true, attribute: 'bottom-divider' }) bottomDivider: boolean =\n    false;\n\n  /** Custom aria-label for the container */\n  @Prop({ attribute: 'aria-label' }) sheetAriaLabel: string = '';\n\n  /**\n   * Retained for API compatibility, but now a no-op: the content area\n   * always plain-scrolls when it overflows (no scroll shadow / edge fades).\n   * Setting this has no visual effect.\n   */\n  @Prop({ reflect: true, attribute: 'scroll-shadow' })\n  scrollShadow: boolean = true;\n\n  /**\n   * Inline-axis alignment of the headline text. `start` (default) reads\n   * left in LTR / right in RTL, `end` reads right in LTR / left in RTL,\n   * `center` is direction-agnostic. Use the matching `::part(headline)`\n   * selector for finer control (e.g. `text-align: justify`).\n   */\n  @Prop({ reflect: true, attribute: 'headline-align' })\n  headlineAlign: 'start' | 'center' | 'end' = 'start';\n\n  /**\n   * Inline-axis alignment of the slotted content. Inherits to all\n   * default-slot children, so prose, lists, and forms all pick it up.\n   * `start` (default) reads left in LTR / right in RTL, `end` reads\n   * right in LTR / left in RTL, `center` is direction-agnostic.\n   * Slotted children that explicitly set their own `text-align` win.\n   */\n  @Prop({ reflect: true, attribute: 'content-align' })\n  contentAlign: 'start' | 'center' | 'end' = 'start';\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  // ── Events ──────────────────────────────────────────────\n\n  /** Emits when the sheet opens */\n  @Event() mdOpen: EventEmitter<void>;\n\n  /** Emits when the sheet closes */\n  @Event() mdClose: EventEmitter<void>;\n\n  /** Emits when dismissed via scrim click, Escape, drag, or close button */\n  @Event() mdCancel: EventEmitter<void>;\n\n  // ── Internal state ──────────────────────────────────────\n\n  @State() private hasSlottedClose = false;\n  @State() private hasActions = false;\n  @State() private dragging = false;\n\n  private containerEl!: HTMLElement;\n  private previousFocus: HTMLElement | null = null;\n  private headlineId = `md-bottom-sheet-headline-${Math.random()\n    .toString(36)\n    .slice(2)}`;\n\n  private dragStartY = 0;\n  private dragCurrentY = 0;\n  private readonly DISMISS_THRESHOLD = 100;\n\n  // ── Lifecycle ───────────────────────────────────────────\n\n  connectedCallback() {\n    this.hasActions = !!this.el.querySelector('[slot=\"actions\"]');\n  }\n\n  componentWillLoad() {\n    // Seed from the light DOM. The slotchange listener below cannot do this on\n    // its own: the `close` slot only renders once this flag (or `closeable`) is\n    // set, so waiting for slotchange means it never fires and a slotted close\n    // is silently dropped.\n    this.hasSlottedClose = Array.from(this.el.children).some(\n      (c) => c.getAttribute('slot') === 'close',\n    );\n  }\n\n  componentDidLoad() {\n    const shadow = this.el.shadowRoot;\n    if (!shadow) return;\n\n    const closeSlot = shadow.querySelector(\n      'slot[name=\"close\"]',\n    ) as HTMLSlotElement | null;\n    const actionsSlot = shadow.querySelector(\n      'slot[name=\"actions\"]',\n    ) as HTMLSlotElement | null;\n\n    closeSlot?.addEventListener('slotchange', () => {\n      this.hasSlottedClose = closeSlot.assignedElements().length > 0;\n    });\n    actionsSlot?.addEventListener('slotchange', () => {\n      this.hasActions = actionsSlot.assignedElements().length > 0;\n    });\n\n    if (this.open) {\n      this.onOpenChange(true);\n    }\n  }\n\n  disconnectedCallback() {\n    this.removeGlobalListeners();\n    document.body.style.overflow = '';\n  }\n\n  // ── Watchers ────────────────────────────────────────────\n\n  @Watch('open')\n  onOpenChange(newVal: boolean) {\n    if (newVal) {\n      this.previousFocus = document.activeElement as HTMLElement;\n      document.body.style.overflow = 'hidden';\n      this.addGlobalListeners();\n      requestAnimationFrame(() => {\n        // The re-render that clears `inert` is scheduled *after* this watcher\n        // (Stencil runs @Watch before scheduleUpdate), so it may not have\n        // committed yet. Unlike aria-hidden, `inert` blocks .focus(); drop it\n        // imperatively — matching the declarative open state — so focus can\n        // enter the panel this frame instead of bouncing off an inert subtree.\n        this.containerEl?.removeAttribute('inert');\n        this.focusFirst();\n      });\n      this.mdOpen.emit();\n    } else {\n      this.removeGlobalListeners();\n      document.body.style.overflow = '';\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      if (this.containerEl) {\n        // Clear any inline transform left over from a drag-then-snap-back.\n        this.containerEl.style.transform = '';\n      }\n      this.mdClose.emit();\n    }\n  }\n\n  // ── Public methods ──────────────────────────────────────\n\n  @Method()\n  async show() {\n    this.open = true;\n  }\n\n  @Method()\n  async close() {\n    this.open = false;\n  }\n\n  // ── Global listeners ────────────────────────────────────\n\n  private addGlobalListeners() {\n    document.addEventListener('keydown', this.handleDocKeyDown, true);\n    document.addEventListener('focusin', this.handleDocFocusIn);\n  }\n\n  private removeGlobalListeners() {\n    document.removeEventListener('keydown', this.handleDocKeyDown, true);\n    document.removeEventListener('focusin', this.handleDocFocusIn);\n  }\n\n  // ── Keyboard ────────────────────────────────────────────\n\n  private handleDocKeyDown = (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    }\n  };\n\n  // ── Focus trap via focusin ──────────────────────────────\n\n  private handleDocFocusIn = () => {\n    if (!this.open) return;\n\n    const active = document.activeElement;\n    if (!active) return;\n\n    if (active === this.el || this.el.contains(active)) return;\n\n    const isShadowEl = this.containerEl?.contains(active);\n    if (isShadowEl) return;\n\n    this.focusFirst();\n  };\n\n  // ── Focus guard handlers (sentinel elements) ────────────\n\n  private handleStartGuardFocus = () => {\n    const focusable = this.getFocusableElements();\n    if (focusable.length > 0) {\n      focusable[focusable.length - 1].focus();\n    } else {\n      this.containerEl?.focus();\n    }\n  };\n\n  private handleEndGuardFocus = () => {\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 handlers ────────────────────────────────────\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  // ── Drag handling ───────────────────────────────────────\n\n  private handleDragStart = (e: PointerEvent) => {\n    if (!this.open || !this.showDragHandle) return;\n\n    this.dragging = true;\n    this.dragStartY = e.clientY;\n    this.dragCurrentY = 0;\n\n    if (this.containerEl) {\n      this.containerEl.style.transition = 'none';\n    }\n\n    (e.target as HTMLElement).setPointerCapture(e.pointerId);\n  };\n\n  private handleDragMove = (e: PointerEvent) => {\n    if (!this.dragging) return;\n\n    const deltaY = e.clientY - this.dragStartY;\n    this.dragCurrentY = Math.max(0, deltaY);\n\n    if (this.containerEl) {\n      this.containerEl.style.transform = `translateY(${this.dragCurrentY}px)`;\n    }\n  };\n\n  private handleDragEnd = () => {\n    if (!this.dragging) return;\n    this.dragging = false;\n\n    if (this.containerEl) {\n      this.containerEl.style.transition = '';\n    }\n\n    if (this.dragCurrentY > this.DISMISS_THRESHOLD) {\n      this.mdCancel.emit();\n      this.open = false;\n    } else if (this.containerEl) {\n      this.containerEl.style.transform = '';\n    }\n\n    this.dragCurrentY = 0;\n  };\n\n  // ── Focus management ────────────────────────────────────\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 getFocusableElements(): HTMLElement[] {\n    const selector =\n      'a[href], button:not([disabled]), input:not([disabled]), select:not([disabled]), textarea:not([disabled]), [tabindex]:not([tabindex=\"-1\"]), md-icon-button:not([disabled]), md-button:not([disabled]), md-text-field:not([disabled]), md-checkbox:not([disabled]), md-switch:not([disabled]), md-radio:not([disabled]), md-slider:not([disabled])';\n\n    // The focus-guard sentinels match the [tabindex] clause but must never\n    // receive wrap-around focus themselves — the trap would land (and in the\n    // spec env, recurse) on an invisible span instead of real content.\n    const shadowEls = (\n      Array.from(this.containerEl?.querySelectorAll(selector) ?? []) as HTMLElement[]\n    ).filter((el) => !el.classList.contains('md-bottom-sheet__focus-guard'));\n\n    const slots = this.containerEl?.querySelectorAll('slot') ?? [];\n    const slottedEls: HTMLElement[] = [];\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?.(selector)) {\n          slottedEls.push(el as HTMLElement);\n        }\n        const nested = (el as HTMLElement).querySelectorAll?.(selector);\n        if (nested) slottedEls.push(...(Array.from(nested) as HTMLElement[]));\n      });\n    });\n\n    return [...shadowEls, ...slottedEls];\n  }\n\n  // ── Render ──────────────────────────────────────────────\n\n  render() {\n    const hasHeadline = !!this.headline;\n    const showHeader = hasHeadline || this.closeable || this.hasSlottedClose;\n\n    return (\n      <Host\n        class={{\n          'md-bottom-sheet': true,\n          [`md-bottom-sheet--${this.variant}`]: true,\n          'md-bottom-sheet--open': this.open,\n          'md-bottom-sheet--no-drag-handle': !this.showDragHandle,\n        }}\n      >\n        <div\n          class=\"md-bottom-sheet__scrim\"\n          part=\"scrim\"\n          aria-hidden=\"true\"\n          onClick={this.handleScrimClick}\n        ></div>\n\n        <div\n          class=\"md-bottom-sheet__container\"\n          part=\"container\"\n          role=\"dialog\"\n          aria-modal=\"true\"\n          aria-labelledby={hasHeadline ? this.headlineId : undefined}\n          aria-label={\n            this.sheetAriaLabel ||\n            (!hasHeadline ? 'Bottom sheet' : undefined)\n          }\n          aria-hidden={!this.open ? 'true' : undefined}\n          // A closed sheet stays in the DOM (translated off-screen for the\n          // enter/exit motion, never display:none), so its focus guards,\n          // close button, and slotted controls remain tab-reachable inside an\n          // aria-hidden subtree — that fails axe `aria-hidden-focus`. `inert`\n          // drops the whole panel from focus order and the a11y tree while\n          // hidden; it flips off in the same render that clears aria-hidden,\n          // before the post-open focusFirst() runs.\n          inert={!this.open}\n          tabindex={-1}\n          ref={(el) => (this.containerEl = el!)}\n        >\n          <span\n            class=\"md-bottom-sheet__focus-guard\"\n            tabindex={0}\n            aria-hidden=\"true\"\n            onFocus={this.handleEndGuardFocus}\n          ></span>\n\n          {this.showDragHandle && (\n            <div\n              class={{\n                'md-bottom-sheet__drag-handle': true,\n                'md-bottom-sheet__drag-handle--dragging': this.dragging,\n              }}\n              part=\"drag-handle\"\n              aria-hidden=\"true\"\n              onPointerDown={this.handleDragStart}\n              onPointerMove={this.handleDragMove}\n              onPointerUp={this.handleDragEnd}\n              onPointerCancel={this.handleDragEnd}\n            >\n              <div\n                class=\"md-bottom-sheet__drag-handle-indicator\"\n                part=\"drag-handle-indicator\"\n              ></div>\n            </div>\n          )}\n\n          {showHeader && (\n            <div class=\"md-bottom-sheet__header\" part=\"header\">\n              {hasHeadline && (\n                <span\n                  id={this.headlineId}\n                  class=\"md-bottom-sheet__headline\"\n                  part=\"headline\"\n                >\n                  <slot name=\"headline\">{this.headline}</slot>\n                </span>\n              )}\n\n              {(this.closeable || this.hasSlottedClose) && (\n                <div class=\"md-bottom-sheet__close\" part=\"close\">\n                  <slot name=\"close\">\n                    <md-icon-button\n                      variant=\"standard\"\n                      icon=\"close\"\n                      aria-label=\"Close bottom sheet\"\n                      onClick={this.handleCloseClick}\n                    ></md-icon-button>\n                  </slot>\n                </div>\n              )}\n            </div>\n          )}\n\n          {this.topDivider && (\n            <div\n              class=\"md-bottom-sheet__divider\"\n              part=\"divider-top\"\n              aria-hidden=\"true\"\n            ></div>\n          )}\n\n          <div class=\"md-bottom-sheet__content\" part=\"content\">\n            <slot></slot>\n          </div>\n\n          {this.hasActions && this.bottomDivider && (\n            <div\n              class=\"md-bottom-sheet__divider md-bottom-sheet__divider--bottom\"\n              part=\"divider-bottom\"\n              aria-hidden=\"true\"\n            ></div>\n          )}\n\n          {this.hasActions && (\n            <div class=\"md-bottom-sheet__actions\" part=\"actions\">\n              <slot name=\"actions\"></slot>\n            </div>\n          )}\n\n          <span\n            class=\"md-bottom-sheet__focus-guard\"\n            tabindex={0}\n            aria-hidden=\"true\"\n            onFocus={this.handleStartGuardFocus}\n          ></span>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/components-csr/md-breadcrumb-item.js

@@ -0,0 +1,2 @@
+import{p as e,H as t,c as r,h as a,d as i,t as s}from"./p-bSpXNc5J.js";import{s as o,S as n}from"./p-BdEoSBtL.js";import{d}from"./p-C3vB0Hd9.js";const m=()=>`:host{--_link-color:var(--md-breadcrumb-item-link-color, var(--md-sys-color-on-surface-variant, #49454F));--_current-color:var(--md-breadcrumb-item-current-color, var(--md-sys-color-on-secondary-container, #1D192B));--_current-bg:var(--md-breadcrumb-item-current-bg, var(--md-sys-color-secondary-container, #E8DEF8));--_disabled-color:var(--md-breadcrumb-item-disabled-color, color-mix(in srgb, var(--md-sys-color-on-surface, #1C1B1F) 61%, transparent));--_hover-color:var(--md-breadcrumb-item-hover-color, var(--md-sys-color-primary, #6750A4));--_state-layer-color:var(--md-breadcrumb-item-state-layer-color, var(--md-sys-color-on-surface, #1C1B1F));--_gap:var(--md-breadcrumb-item-gap, calc(6px + var(--md-sys-density-scale, 0) * 1px));--_padding:var(--md-breadcrumb-item-padding, calc(8px + var(--md-sys-density-scale, 0) * 2px) max(4px, calc(12px + var(--md-sys-density-scale, 0) * 2px)));--_motion-duration:var(--md-sys-motion-spring-effects-default-duration, 200ms);--_motion-easing:var(--md-sys-motion-spring-effects-default-easing, cubic-bezier(0.34, 0.80, 0.34, 1.00));--_spring-easing:var(--md-sys-motion-spring-spatial-fast-easing, cubic-bezier(0.42, 1.67, 0.21, 0.90));--_spring-duration:var(--md-sys-motion-spring-spatial-fast-duration, 350ms);display:inline-flex;align-items:center;gap:var(--md-breadcrumbs-gap, var(--md-sys-spacing-gap-sm, 8px));box-sizing:border-box;font-family:var(--md-sys-typescale-label-large-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-label-large-font-weight, 500);line-height:max(16px, calc(20px + var(--md-sys-density-scale, 0) * 1px));letter-spacing:var(--md-sys-typescale-label-large-letter-spacing, 0.1px)}:host(.md-breadcrumb-item--collapsed){display:none}.md-breadcrumb-item__separator{color:var(--md-breadcrumbs-separator-color, var(--md-sys-color-on-surface-variant, #49454F));font-size:max(13px, calc(16px + var(--md-sys-density-scale, 0) * 0.5px));user-select:none;pointer-events:none;opacity:0.7;transition:opacity var(--_motion-duration) var(--_motion-easing)}.md-breadcrumb-item__link,.md-breadcrumb-item__static{position:relative;display:inline-flex;align-items:center;gap:var(--_gap);padding:var(--_padding);border-radius:var(--md-sys-shape-corner-full, 9999px);text-decoration:none;color:var(--_link-color);font:inherit;isolation:isolate;overflow:hidden;transition:color var(--_motion-duration) var(--_motion-easing),     background-color var(--_motion-duration) var(--_motion-easing),     transform var(--_spring-duration) var(--_spring-easing)}.md-breadcrumb-item__state-layer{position:absolute;inset:0;border-radius:inherit;background-color:var(--_state-layer-color);opacity:0;pointer-events:none;transition:opacity var(--_motion-duration) var(--_motion-easing)}.md-breadcrumb-item__link:hover .md-breadcrumb-item__state-layer{opacity:var(--md-sys-state-hover-state-layer-opacity, 0.08)}.md-breadcrumb-item__link:focus-visible .md-breadcrumb-item__state-layer{opacity:var(--md-sys-state-focus-state-layer-opacity, 0.12)}.md-breadcrumb-item__link:active .md-breadcrumb-item__state-layer{opacity:var(--md-sys-state-pressed-state-layer-opacity, 0.12)}.md-breadcrumb-item__link:hover{color:var(--_hover-color);transform:translateX(2px)}:host([dir="rtl"]) .md-breadcrumb-item__link:hover,:host-context([dir="rtl"]) .md-breadcrumb-item__link:hover{transform:translateX(-2px)}.md-breadcrumb-item__link:focus-visible{outline:3px solid var(--md-sys-color-secondary, #625B71);outline-offset:2px}:host(.md-breadcrumb-item--current) .md-breadcrumb-item__static{background-color:var(--_current-bg);color:var(--_current-color);font-weight:600}:host(.md-breadcrumb-item--disabled) .md-breadcrumb-item__static,:host(.md-breadcrumb-item--disabled) .md-breadcrumb-item__link{color:var(--_disabled-color);pointer-events:none;cursor:not-allowed}:host(.md-breadcrumb-item--disabled) md-ripple,:host(.md-breadcrumb-item--disabled) .md-breadcrumb-item__state-layer{display:none}.md-breadcrumb-item__icon{display:inline-flex;align-items:center;justify-content:center;inline-size:18px;block-size:18px;color:currentColor;flex-shrink:0}.md-breadcrumb-item__icon .material-symbols-outlined{font-family:var(--md-sys-icon-font-family, 'Material Symbols Outlined', 'Material Icons');font-size:max(14px, calc(18px + var(--md-sys-density-scale, 0) * 1px));line-height:1;font-variation-settings:'FILL' 0, 'wght' 500, 'GRAD' 0, 'opsz' 24;transition:font-variation-settings var(--_spring-duration) var(--_spring-easing)}:host(.md-breadcrumb-item--current) .md-breadcrumb-item__icon .material-symbols-outlined{font-variation-settings:'FILL' 1, 'wght' 600, 'GRAD' 0, 'opsz' 24}.md-breadcrumb-item__label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-inline-size:32ch;position:relative;z-index:1}.md-breadcrumb-item__icon{position:relative;z-index:1}@media (prefers-reduced-motion: reduce){.md-breadcrumb-item__link,.md-breadcrumb-item__static,.md-breadcrumb-item__icon .material-symbols-outlined,.md-breadcrumb-item__separator,.md-breadcrumb-item__state-layer{transition-duration:0.01ms !important}.md-breadcrumb-item__link:hover{transform:none}}@media (forced-colors: active){.md-breadcrumb-item__link{color:LinkText}:host(.md-breadcrumb-item--current) .md-breadcrumb-item__static{color:CanvasText;background-color:Canvas;outline:1px solid CanvasText}.md-breadcrumb-item__state-layer{display: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 l=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow();this.mdSelect=r(this,"mdSelect",7);this.href="";this.target="";this.rel="";this.current=false;this.icon="";this.disabled=false;this.collapsed=false;this.itemIndex=0;this.itemTotal=0;this.density=0;this.hasSlottedIcon=false;this.hasSlottedLabel=false;this.handleAnchorClick=e=>{const t=this.mdSelect.emit(this.buildDetail(e));if(t.defaultPrevented){e.preventDefault()}}}get isCollapsed(){return this.collapsed}get isCurrent(){return this.current}componentWillLoad(){this.hasSlottedIcon=this.hasDirectSlottedChild("icon");this.hasSlottedLabel=this.hasDefaultSlotContent()}componentDidLoad(){const e=this.el.shadowRoot?.querySelector('slot[name="icon"]');e?.addEventListener("slotchange",(()=>{this.hasSlottedIcon=e.assignedElements().length>0}));const t=this.el.shadowRoot?.querySelector("slot:not([name])");t?.addEventListener("slotchange",(()=>{this.hasSlottedLabel=(t?.assignedNodes()??[]).length>0}))}getLabelText(){return(this.el.textContent??"").trim()}buildDetail(e){return{href:this.href,label:this.getLabelText(),current:this.current,itemIndex:this.itemIndex,itemTotal:this.itemTotal,originalEvent:e}}hasDirectSlottedChild(e){const t=this.el.children;for(let r=0;r<t.length;r+=1){if(t[r].getAttribute("slot")===e)return true}return false}hasDefaultSlotContent(){for(let e=0;e<this.el.childNodes.length;e+=1){const t=this.el.childNodes[e];if(t.nodeType===1){if(!t.hasAttribute("slot"))return true}else if(t.nodeType===3&&(t.textContent??"").trim()!==""){return true}}return false}renderLeadingSeparator(){if(this.itemIndex===0)return null;const e=this.el.parentElement;const t=e?.separator??"/";return a("span",{class:"md-breadcrumb-item__separator",part:"separator","aria-hidden":"true"},t)}renderIcon(){if(this.hasSlottedIcon){return a("span",{class:"md-breadcrumb-item__icon",part:"icon","aria-hidden":"true"},a("slot",{name:"icon"}))}if(this.icon){return a("span",{class:"md-breadcrumb-item__icon",part:"icon","aria-hidden":"true"},a("span",{class:"material-symbols-outlined"},this.icon))}return null}renderLabel(){return a("span",{class:"md-breadcrumb-item__label",part:"label"},a("slot",null))}renderInner(){const e=this.renderIcon();const t=this.renderLabel();if(this.isCurrent||!this.href||this.disabled){return a("span",{class:"md-breadcrumb-item__static",part:"static","aria-current":this.isCurrent?"page":undefined},e,t)}return a("a",{class:"md-breadcrumb-item__link",part:"link",href:o(this.href),target:this.target||undefined,rel:this.rel||(this.target?n:undefined),onClick:this.handleAnchorClick},a("md-ripple",{disabled:this.disabled}),a("span",{class:"md-breadcrumb-item__state-layer",part:"state-layer","aria-hidden":"true"}),e,t)}render(){if(this.isCollapsed){return a(i,{class:"md-breadcrumb-item md-breadcrumb-item--collapsed",role:"listitem","aria-hidden":"true"})}return a(i,{class:{"md-breadcrumb-item":true,"md-breadcrumb-item--current":this.isCurrent,"md-breadcrumb-item--disabled":this.disabled},role:"listitem"},this.renderLeadingSeparator(),this.renderInner())}get el(){return this}static get style(){return m()}},[257,"md-breadcrumb-item",{href:[1],target:[1],rel:[1],current:[516],icon:[1],disabled:[516],collapsed:[516],itemIndex:[2,"item-index"],itemTotal:[2,"item-total"],density:[514],hasSlottedIcon:[32],hasSlottedLabel:[32]}]);function c(){if(typeof customElements==="undefined"){return}const e=["md-breadcrumb-item","md-ripple"];e.forEach((e=>{switch(e){case"md-breadcrumb-item":if(!customElements.get(s(e))){customElements.define(s(e),l)}break;case"md-ripple":if(!customElements.get(s(e))){d()}break}}))}c();const b=l;const u=c;export{b as MdBreadcrumbItem,u as defineCustomElement};
+//# sourceMappingURL=md-breadcrumb-item.js.map

package/dist/components-csr/md-breadcrumb-item.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["mdBreadcrumbItemCss","MdBreadcrumbItem","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","href","target","rel","current","icon","disabled","collapsed","itemIndex","itemTotal","density","hasSlottedIcon","hasSlottedLabel","handleAnchorClick","e","evt","mdSelect","emit","buildDetail","defaultPrevented","preventDefault","isCollapsed","isCurrent","componentWillLoad","hasDirectSlottedChild","hasDefaultSlotContent","componentDidLoad","iconSlot","el","shadowRoot","querySelector","addEventListener","assignedElements","length","mainSlot","assignedNodes","getLabelText","textContent","trim","originalEvent","label","slotName","children","i","getAttribute","childNodes","node","nodeType","hasAttribute","renderLeadingSeparator","parent","parentElement","sep","separator","h","class","part","renderIcon","name","renderLabel","renderInner","undefined","sanitizeHref","SAFE_LINK_REL","onClick","render","Host","role"],"sources":["src/components/md-breadcrumb-item/md-breadcrumb-item.css?tag=md-breadcrumb-item&encapsulation=shadow","src/components/md-breadcrumb-item/md-breadcrumb-item.tsx"],"sourcesContent":["/* ==========================================================\n   md-breadcrumb-item — single entry inside <md-breadcrumbs>\n   Aligned with MD3 Expressive Navigation patterns: label-large\n   typography, container-shaped focus ring, full state-layer\n   pill on hover, FILL=1 icon swap for the current page, and a\n   subtle spring forward-translate on hover for affordance.\n\n   PUBLIC CSS CUSTOM PROPERTIES:\n     --md-breadcrumb-item-link-color           Link text colour\n     --md-breadcrumb-item-current-color        Current-page text colour\n     --md-breadcrumb-item-current-bg           Current-page pill background\n     --md-breadcrumb-item-disabled-color       Disabled text colour\n     --md-breadcrumb-item-hover-color          Hover-state text colour\n     --md-breadcrumb-item-state-layer-color    Hover/focus/press overlay colour\n     --md-breadcrumb-item-gap                  Gap between icon + label\n     --md-breadcrumb-item-padding              Interactive padding\n\n   CSS PARTS:\n     separator    Glyph rendered before this item (when not first).\n     link         The anchor (when an href is set and not current).\n     static       The span (when current or no href).\n     state-layer  Hover/focus/press overlay.\n     icon         Leading icon container.\n     label        Label text wrapper.\n   ========================================================== */\n\n:host {\n  --_link-color: var(--md-breadcrumb-item-link-color, var(--md-sys-color-on-surface-variant, #49454F));\n  --_current-color: var(--md-breadcrumb-item-current-color, var(--md-sys-color-on-secondary-container, #1D192B));\n  --_current-bg: var(--md-breadcrumb-item-current-bg, var(--md-sys-color-secondary-container, #E8DEF8));\n  /* 61% (not the M3 38% disabled tint) so a disabled crumb still meets WCAG\n     1.4.3 text contrast (4.5:1) against the surface — axe flags the 38% tint. */\n  --_disabled-color: var(--md-breadcrumb-item-disabled-color, color-mix(in srgb, var(--md-sys-color-on-surface, #1C1B1F) 61%, transparent));\n  --_hover-color: var(--md-breadcrumb-item-hover-color, var(--md-sys-color-primary, #6750A4));\n  --_state-layer-color: var(--md-breadcrumb-item-state-layer-color, var(--md-sys-color-on-surface, #1C1B1F));\n  --_gap: var(--md-breadcrumb-item-gap, calc(6px + var(--md-sys-density-scale, 0) * 1px));\n  --_padding: var(--md-breadcrumb-item-padding, calc(8px + var(--md-sys-density-scale, 0) * 2px) max(4px, calc(12px + var(--md-sys-density-scale, 0) * 2px)));\n\n  /* MD3 motion: spring for the hover translate (so it feels\n     \"playful\"), standard easing for everything else. */\n  --_motion-duration: var(--md-sys-motion-spring-effects-default-duration, 200ms);\n  --_motion-easing: var(--md-sys-motion-spring-effects-default-easing, cubic-bezier(0.34, 0.80, 0.34, 1.00));\n  --_spring-easing: var(--md-sys-motion-spring-spatial-fast-easing, cubic-bezier(0.42, 1.67, 0.21, 0.90));\n  --_spring-duration: var(--md-sys-motion-spring-spatial-fast-duration, 350ms);\n\n  display: inline-flex;\n  align-items: center;\n  gap: var(--md-breadcrumbs-gap, var(--md-sys-spacing-gap-sm, 8px));\n  box-sizing: border-box;\n  font-family: var(--md-sys-typescale-label-large-font-family, Roboto, sans-serif);\n  /* label-large (14/20) — 0.5px/rung, the library rate for sub-22px type. */\n  font-size: max(12px, calc(14px + var(--md-sys-density-scale, 0) * 0.5px));\n  font-weight: var(--md-sys-typescale-label-large-font-weight, 500);\n  line-height: max(16px, calc(20px + var(--md-sys-density-scale, 0) * 1px));\n  letter-spacing: var(--md-sys-typescale-label-large-letter-spacing, 0.1px);\n}\n\n:host(.md-breadcrumb-item--collapsed) {\n  display: none;\n}\n\n/* ==========================================================\n   1. SEPARATOR — fades in alongside the item (parent uses a\n   stagger via animation-delay).\n   ========================================================== */\n.md-breadcrumb-item__separator {\n  color: var(--md-breadcrumbs-separator-color, var(--md-sys-color-on-surface-variant, #49454F));\n  /* Separator glyph tracks the label it sits between. */\n  font-size: max(13px, calc(16px + var(--md-sys-density-scale, 0) * 0.5px));\n  user-select: none;\n  pointer-events: none;\n  opacity: 0.7;\n  transition: opacity var(--_motion-duration) var(--_motion-easing);\n}\n\n/* ==========================================================\n   2. LINK / STATIC SURFACES\n   ========================================================== */\n\n.md-breadcrumb-item__link,\n.md-breadcrumb-item__static {\n  position: relative;\n  display: inline-flex;\n  align-items: center;\n  gap: var(--_gap);\n  padding: var(--_padding);\n  border-radius: var(--md-sys-shape-corner-full, 9999px);\n  text-decoration: none;\n  color: var(--_link-color);\n  font: inherit;\n  isolation: isolate;\n  overflow: hidden;\n\n  transition:\n    color var(--_motion-duration) var(--_motion-easing),\n    background-color var(--_motion-duration) var(--_motion-easing),\n    transform var(--_spring-duration) var(--_spring-easing);\n}\n\n/* State layer for hover/focus/press */\n.md-breadcrumb-item__state-layer {\n  position: absolute;\n  inset: 0;\n  border-radius: inherit;\n  background-color: var(--_state-layer-color);\n  opacity: 0;\n  pointer-events: none;\n  transition: opacity var(--_motion-duration) var(--_motion-easing);\n}\n\n.md-breadcrumb-item__link:hover .md-breadcrumb-item__state-layer {\n  opacity: var(--md-sys-state-hover-state-layer-opacity, 0.08);\n}\n.md-breadcrumb-item__link:focus-visible .md-breadcrumb-item__state-layer {\n  opacity: var(--md-sys-state-focus-state-layer-opacity, 0.12);\n}\n.md-breadcrumb-item__link:active .md-breadcrumb-item__state-layer {\n  opacity: var(--md-sys-state-pressed-state-layer-opacity, 0.12);\n}\n\n/* Hover: shift forward a hair so the link feels tactile. The\n   shift is in the inline direction so it works in both LTR\n   and RTL automatically (`inline-start` aware via `transform`\n   needing the RTL flip below). */\n.md-breadcrumb-item__link:hover {\n  color: var(--_hover-color);\n  transform: translateX(2px);\n}\n\n:host([dir=\"rtl\"]) .md-breadcrumb-item__link:hover,\n:host-context([dir=\"rtl\"]) .md-breadcrumb-item__link:hover {\n  transform: translateX(-2px);\n}\n\n.md-breadcrumb-item__link:focus-visible {\n  outline: 3px solid var(--md-sys-color-secondary, #625B71);\n  outline-offset: 2px;\n}\n\n/* ── Current page pill ── */\n:host(.md-breadcrumb-item--current) .md-breadcrumb-item__static {\n  background-color: var(--_current-bg);\n  color: var(--_current-color);\n  font-weight: 600;\n}\n\n:host(.md-breadcrumb-item--disabled) .md-breadcrumb-item__static,\n:host(.md-breadcrumb-item--disabled) .md-breadcrumb-item__link {\n  color: var(--_disabled-color);\n  pointer-events: none;\n  cursor: not-allowed;\n}\n:host(.md-breadcrumb-item--disabled) md-ripple,\n:host(.md-breadcrumb-item--disabled) .md-breadcrumb-item__state-layer {\n  display: none;\n}\n\n/* ==========================================================\n   3. ICON — FILL=1 swap for the current page\n   ========================================================== */\n\n.md-breadcrumb-item__icon {\n  display: inline-flex;\n  align-items: center;\n  justify-content: center;\n  inline-size: 18px;\n  block-size: 18px;\n  color: currentColor;\n  flex-shrink: 0;\n}\n\n.md-breadcrumb-item__icon .material-symbols-outlined {\n  font-family: var(--md-sys-icon-font-family, 'Material Symbols Outlined', 'Material Icons');\n  /* 1px/rung off 18dp (14px floor) — same taper as md-chip's 18dp glyph. */\n  font-size: max(14px, calc(18px + var(--md-sys-density-scale, 0) * 1px));\n  line-height: 1;\n  font-variation-settings: 'FILL' 0, 'wght' 500, 'GRAD' 0, 'opsz' 24;\n  transition: font-variation-settings var(--_spring-duration) var(--_spring-easing);\n}\n\n:host(.md-breadcrumb-item--current) .md-breadcrumb-item__icon .material-symbols-outlined {\n  font-variation-settings: 'FILL' 1, 'wght' 600, 'GRAD' 0, 'opsz' 24;\n}\n\n/* ==========================================================\n   4. LABEL\n   ========================================================== */\n.md-breadcrumb-item__label {\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  max-inline-size: 32ch;\n  position: relative;\n  z-index: 1;\n}\n\n.md-breadcrumb-item__icon {\n  position: relative;\n  z-index: 1;\n}\n\n/* ==========================================================\n   5. REDUCED MOTION\n   ========================================================== */\n@media (prefers-reduced-motion: reduce) {\n  .md-breadcrumb-item__link,\n  .md-breadcrumb-item__static,\n  .md-breadcrumb-item__icon .material-symbols-outlined,\n  .md-breadcrumb-item__separator,\n  .md-breadcrumb-item__state-layer {\n    transition-duration: 0.01ms !important;\n  }\n  .md-breadcrumb-item__link:hover {\n    transform: none;\n  }\n}\n\n/* ==========================================================\n   6. FORCED COLORS\n   ========================================================== */\n@media (forced-colors: active) {\n  .md-breadcrumb-item__link {\n    color: LinkText;\n  }\n  :host(.md-breadcrumb-item--current) .md-breadcrumb-item__static {\n    color: CanvasText;\n    background-color: Canvas;\n    outline: 1px solid CanvasText;\n  }\n  .md-breadcrumb-item__state-layer {\n    display: none;\n  }\n}\n\n/* ==========================================================\n   DENSITY (local override)\n   Maps the local `density` prop onto the same --md-sys-density-scale signal a\n   global `data-density` ancestor sets. Declared on :host, so a local rung wins\n   over the inherited global one. Every density-sensitive value in this file\n   derives from that single signal by calc — never add a fixed per-rung ladder.\n   ========================================================== */\n:host([density='-1']) { --md-sys-density-scale: -1; }\n:host([density='-2']) { --md-sys-density-scale: -2; }\n:host([density='-3']) { --md-sys-density-scale: -3; }\n:host([density='-4']) { --md-sys-density-scale: -4; }\n","import {\n  Component,\n  Host,\n  h,\n  Prop,\n  Element,\n  State,\n  Event,\n  EventEmitter,\n} from '@stencil/core';\nimport { sanitizeHref, SAFE_LINK_REL } from '../../utils/url';\n\n/**\n * Detail payload emitted by `md-breadcrumb-item`'s `mdSelect` event when the\n * user activates a navigable crumb (via mouse, touch, or keyboard).\n */\nexport interface MdBreadcrumbSelectDetail {\n  /** Destination URL of the activated crumb (empty string when none). */\n  href: string;\n  /** Plain-text label of the activated crumb. */\n  label: string;\n  /** Whether the activated crumb is marked as the current page. */\n  current: boolean;\n  /** Position of the activated crumb in the trail (0-indexed). */\n  itemIndex: number;\n  /** Total number of crumbs in the trail. */\n  itemTotal: number;\n  /** The original DOM event that triggered the activation. */\n  originalEvent: MouseEvent | KeyboardEvent;\n}\n\n@Component({\n  tag: 'md-breadcrumb-item',\n  styleUrl: 'md-breadcrumb-item.css',\n  shadow: true,\n})\nexport class MdBreadcrumbItem {\n  @Element() el!: HTMLElement;\n\n  /** Destination URL. When empty the item renders as a plain span. */\n  @Prop() href: string = '';\n\n  /** Anchor `target` attribute (e.g. `_blank`). */\n  @Prop() target: string = '';\n\n  /** Anchor `rel` attribute. */\n  @Prop() rel: string = '';\n\n  /**\n   * When `true`, mark this item as the current page. Usually the parent\n   * `md-breadcrumbs` auto-sets this on the last child, but explicit\n   * override is supported.\n   */\n  @Prop({ reflect: true }) current: boolean = false;\n\n  /** Optional leading icon (Material Symbols shorthand). */\n  @Prop() icon: string = '';\n\n  /** Disable the item — renders without an anchor and is not focusable. */\n  @Prop({ reflect: true }) disabled: boolean = false;\n\n  /**\n   * Marks this item as part of the collapsed middle section. Usually\n   * set by the parent `md-breadcrumbs` when `max-items` is exceeded.\n   * Declared as a public prop (instead of just a `data-*` attribute) so\n   * Stencil re-renders the item when the parent toggles its visibility.\n   */\n  @Prop({ reflect: true }) collapsed: boolean = false;\n\n  /**\n   * Position in the trail (0-indexed). Set automatically by the parent\n   * `md-breadcrumbs`. Exposed as a reactive prop so children re-render\n   * the leading separator when their position changes.\n   */\n  @Prop() itemIndex: number = 0;\n\n  /**\n   * Total number of items in the trail. Set automatically by the parent.\n   */\n  @Prop() itemTotal: number = 0;\n\n  /**\n   * Local density rung. Drives the same `--md-sys-density-scale` signal that a\n   * global `data-density` ancestor sets, so a local value simply overrides the\n   * inherited one. 0 = default, -4 = ultra-compact.\n   */\n  @Prop({ reflect: true }) density: 0 | -1 | -2 | -3 | -4 = 0;\n\n  /**\n   * Fires when the user activates a navigable crumb — i.e. when an item with\n   * a non-empty `href` (and not marked `current` / `disabled`) is clicked or\n   * activated with `Enter` while focused. The event is **cancelable**:\n   * call `event.preventDefault()` from the listener to stop the browser's\n   * default navigation. This is the recommended hook for SPA routing — let\n   * the breadcrumb render a real `<a>` (so right-click / middle-click /\n   * \"Open in new tab\" still work), then intercept `mdSelect` to push the\n   * route through your client-side router instead of a full page reload.\n   *\n   * The event bubbles, so consumers can attach a single listener on the\n   * parent `<md-breadcrumbs>` for delegation. The event is composed, so\n   * listeners outside the shadow tree (the typical case) receive it.\n   *\n   * ```ts\n   * document.querySelector('md-breadcrumbs')!\n   *   .addEventListener('mdSelect', (e) => {\n   *     const { href, label, itemIndex } = (e as CustomEvent).detail;\n   *     e.preventDefault();              // stop the <a> from navigating\n   *     myRouter.push(href);             // SPA navigation\n   *   });\n   * ```\n   */\n  @Event({ cancelable: true, bubbles: true, composed: true })\n  mdSelect!: EventEmitter<MdBreadcrumbSelectDetail>;\n\n  @State() private hasSlottedIcon = false;\n  @State() private hasSlottedLabel = false;\n\n  private get isCollapsed(): boolean {\n    return this.collapsed;\n  }\n\n  private get isCurrent(): boolean {\n    return this.current;\n  }\n\n  componentWillLoad() {\n    this.hasSlottedIcon = this.hasDirectSlottedChild('icon');\n    this.hasSlottedLabel = this.hasDefaultSlotContent();\n  }\n\n  componentDidLoad() {\n    const iconSlot = this.el.shadowRoot?.querySelector(\n      'slot[name=\"icon\"]',\n    ) as HTMLSlotElement | null;\n    iconSlot?.addEventListener('slotchange', () => {\n      this.hasSlottedIcon = iconSlot.assignedElements().length > 0;\n    });\n    const mainSlot = this.el.shadowRoot?.querySelector(\n      'slot:not([name])',\n    ) as HTMLSlotElement | null;\n    mainSlot?.addEventListener('slotchange', () => {\n      this.hasSlottedLabel = (mainSlot?.assignedNodes() ?? []).length > 0;\n    });\n  }\n\n  private getLabelText(): string {\n    // Prefer the rendered text content of the host (covers slotted nodes,\n    // text, and inline elements); fall back to the empty string.\n    return (this.el.textContent ?? '').trim();\n  }\n\n  private buildDetail(originalEvent: MouseEvent | KeyboardEvent): MdBreadcrumbSelectDetail {\n    return {\n      href: this.href,\n      label: this.getLabelText(),\n      current: this.current,\n      itemIndex: this.itemIndex,\n      itemTotal: this.itemTotal,\n      originalEvent,\n    };\n  }\n\n  private handleAnchorClick = (e: MouseEvent) => {\n    // The anchor only renders for navigable, non-current, non-disabled\n    // items, so we don't need to re-check those conditions here. Emit a\n    // cancelable mdSelect; if a listener calls preventDefault on the\n    // CustomEvent, suppress the browser's default link navigation.\n    //\n    // Note: pressing Enter on a focused anchor synthesises a click event,\n    // so this handler covers the keyboard activation path as well.\n    const evt = this.mdSelect.emit(this.buildDetail(e));\n    if (evt.defaultPrevented) {\n      e.preventDefault();\n    }\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  private hasDefaultSlotContent(): boolean {\n    for (let i = 0; i < this.el.childNodes.length; i += 1) {\n      const node = this.el.childNodes[i];\n      if (node.nodeType === 1) {\n        if (!(node as Element).hasAttribute('slot')) return true;\n      } else if (\n        node.nodeType === 3 &&\n        (node.textContent ?? '').trim() !== ''\n      ) {\n        return true;\n      }\n    }\n    return false;\n  }\n\n  private renderLeadingSeparator() {\n    if (this.itemIndex === 0) return null;\n    // Read the separator glyph from the parent (so we don't have to\n    // mirror it through a prop on every item).\n    const parent = this.el.parentElement as HTMLMdBreadcrumbsElement | null;\n    const sep = parent?.separator ?? '/';\n    return (\n      <span\n        class=\"md-breadcrumb-item__separator\"\n        part=\"separator\"\n        aria-hidden=\"true\"\n      >\n        {sep}\n      </span>\n    );\n  }\n\n  private renderIcon() {\n    if (this.hasSlottedIcon) {\n      return (\n        <span class=\"md-breadcrumb-item__icon\" part=\"icon\" aria-hidden=\"true\">\n          <slot name=\"icon\"></slot>\n        </span>\n      );\n    }\n    if (this.icon) {\n      return (\n        <span class=\"md-breadcrumb-item__icon\" part=\"icon\" aria-hidden=\"true\">\n          <span class=\"material-symbols-outlined\">{this.icon}</span>\n        </span>\n      );\n    }\n    return null;\n  }\n\n  private renderLabel() {\n    return (\n      <span class=\"md-breadcrumb-item__label\" part=\"label\">\n        <slot></slot>\n      </span>\n    );\n  }\n\n  private renderInner() {\n    const icon = this.renderIcon();\n    const label = this.renderLabel();\n    if (this.isCurrent || !this.href || this.disabled) {\n      return (\n        <span\n          class=\"md-breadcrumb-item__static\"\n          part=\"static\"\n          aria-current={this.isCurrent ? 'page' : undefined}\n        >\n          {icon}\n          {label}\n        </span>\n      );\n    }\n    return (\n      <a\n        class=\"md-breadcrumb-item__link\"\n        part=\"link\"\n        href={sanitizeHref(this.href)}\n        /* An explicit `rel` from the consumer wins; otherwise a link that\n           opens elsewhere gets opener severing by default. */\n        target={this.target || undefined}\n        rel={this.rel || (this.target ? SAFE_LINK_REL : undefined)}\n        onClick={this.handleAnchorClick}\n      >\n        <md-ripple disabled={this.disabled}></md-ripple>\n        <span\n          class=\"md-breadcrumb-item__state-layer\"\n          part=\"state-layer\"\n          aria-hidden=\"true\"\n        ></span>\n        {icon}\n        {label}\n      </a>\n    );\n  }\n\n  render() {\n    if (this.isCollapsed) {\n      // Parent flagged us as inside the collapsed middle — render\n      // nothing visible. We stay in the DOM so toggling expanded\n      // doesn't require a re-pass over the slot.\n      return (\n        <Host\n          class=\"md-breadcrumb-item md-breadcrumb-item--collapsed\"\n          role=\"listitem\"\n          aria-hidden=\"true\"\n        ></Host>\n      );\n    }\n\n    return (\n      <Host\n        class={{\n          'md-breadcrumb-item': true,\n          'md-breadcrumb-item--current': this.isCurrent,\n          'md-breadcrumb-item--disabled': this.disabled,\n        }}\n        role=\"listitem\"\n      >\n        {this.renderLeadingSeparator()}\n        {this.renderInner()}\n      </Host>\n    );\n  }\n}\n"],"mappings":"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","ignoreList":[]}

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

@@ -0,0 +1,2 @@
+import{p as e,H as t,c as a,h as r,d as s,t as o}from"./p-bSpXNc5J.js";const i=()=>`:host{--_gap:var(--md-breadcrumbs-gap, calc(8px + var(--md-sys-density-scale, 0) * 2px));--_separator-color:var(--md-breadcrumbs-separator-color, var(--md-sys-color-on-surface-variant, #49454F));--_text-color:var(--md-breadcrumbs-text-color, var(--md-sys-color-on-surface-variant, #49454F));--_stagger:var(--md-breadcrumbs-stagger, 40ms);--_in-duration:var(--md-sys-motion-spring-spatial-default-duration, 500ms);--_in-easing:var(--md-sys-motion-spring-spatial-default-easing, cubic-bezier(0.38, 1.21, 0.22, 1.00));--_state-duration:var(--md-sys-motion-spring-effects-default-duration, 200ms);--_state-easing:var(--md-sys-motion-spring-effects-default-easing, cubic-bezier(0.34, 0.80, 0.34, 1.00));display:block;inline-size:100%;box-sizing:border-box;font-family:var(--md-sys-typescale-label-large-font-family, Roboto, sans-serif);color:var(--_text-color)}.md-breadcrumbs__list{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:0 var(--_gap)}@keyframes md-breadcrumb-enter{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:translateX(0)}}::slotted(md-breadcrumb-item){animation:md-breadcrumb-enter var(--_in-duration) var(--_in-easing) both}::slotted(md-breadcrumb-item:nth-of-type(1)){animation-delay:calc(var(--_stagger) * 0)}::slotted(md-breadcrumb-item:nth-of-type(2)){animation-delay:calc(var(--_stagger) * 1)}::slotted(md-breadcrumb-item:nth-of-type(3)){animation-delay:calc(var(--_stagger) * 2)}::slotted(md-breadcrumb-item:nth-of-type(4)){animation-delay:calc(var(--_stagger) * 3)}::slotted(md-breadcrumb-item:nth-of-type(5)){animation-delay:calc(var(--_stagger) * 4)}::slotted(md-breadcrumb-item:nth-of-type(6)){animation-delay:calc(var(--_stagger) * 5)}::slotted(md-breadcrumb-item:nth-of-type(7)){animation-delay:calc(var(--_stagger) * 6)}::slotted(md-breadcrumb-item:nth-of-type(8)){animation-delay:calc(var(--_stagger) * 7)}::slotted(md-breadcrumb-item:nth-of-type(9)){animation-delay:calc(var(--_stagger) * 8)}::slotted(md-breadcrumb-item:nth-of-type(10)){animation-delay:calc(var(--_stagger) * 9)}::slotted(md-breadcrumb-item:nth-of-type(11)){animation-delay:calc(var(--_stagger) * 10)}::slotted(md-breadcrumb-item:nth-of-type(12)){animation-delay:calc(var(--_stagger) * 11)}:host([dir="rtl"]){}:host([dir="rtl"]) ::slotted(md-breadcrumb-item),:host-context([dir="rtl"]) ::slotted(md-breadcrumb-item){animation-name:md-breadcrumb-enter-rtl}@keyframes md-breadcrumb-enter-rtl{from{opacity:0;transform:translateX(8px)}to{opacity:1;transform:translateX(0)}}.md-breadcrumbs__overflow{display:inline-flex;align-items:center;gap:var(--md-sys-spacing-gap-xs, 4px);order:1}.md-breadcrumbs__overflow-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;inline-size:32px;block-size:32px;border:none;border-radius:var(--md-sys-shape-corner-full, 9999px);background-color:transparent;color:var(--md-sys-color-on-surface-variant, #49454F);cursor:pointer;transition:background-color var(--_state-duration) var(--_state-easing),     transform var(--_state-duration) var(--_state-easing)}.md-breadcrumbs__overflow-btn:hover{background-color:color-mix(in srgb, var(--md-sys-color-on-surface-variant, #49454F) 8%, transparent)}.md-breadcrumbs__overflow-btn:focus-visible{background-color:color-mix(in srgb, var(--md-sys-color-on-surface-variant, #49454F) 12%, transparent);outline:3px solid var(--md-sys-color-secondary, #625B71);outline-offset:2px}.md-breadcrumbs__overflow-btn:active{transform:scale(0.94)}.md-breadcrumbs__separator{display:inline-flex;align-items:center;color:var(--_separator-color);font-size:max(13px, calc(16px + var(--md-sys-density-scale, 0) * 0.5px));user-select:none;pointer-events:none}:host([dir="rtl"]) .md-breadcrumbs__separator,:host-context([dir="rtl"]) .md-breadcrumbs__separator{unicode-bidi:plaintext}@media (prefers-reduced-motion: reduce){::slotted(md-breadcrumb-item){animation:none !important}.md-breadcrumbs__overflow-btn{transition:none}}@media (forced-colors: active){.md-breadcrumbs__separator{color:GrayText}.md-breadcrumbs__overflow-btn{border:1px solid CanvasText}}: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 n=e(class e extends t{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow();this.mdExpand=a(this,"mdExpand",7);this.label="Breadcrumb";this.expandLabel="Show full breadcrumb trail";this.separator="/";this.maxItems=0;this.itemsBeforeCollapse=1;this.itemsAfterCollapse=2;this.density=0;this.expanded=false;this.itemCount=0;this.toggleExpanded=()=>{this.setExpanded(!this.expanded)}}componentWillLoad(){this.refreshItems()}componentDidLoad(){const e=this.el.shadowRoot?.querySelector("slot:not([name])");e?.addEventListener("slotchange",(()=>this.refreshItems()))}onCollapseConfigChange(){this.refreshItems()}refreshItems(){const e=this.collectItems();this.itemCount=e.length;e.forEach(((t,a)=>{t.itemIndex=a;t.itemTotal=e.length}));const t=e.some(((t,a)=>t.current&&a!==e.length-1));if(!t&&e.length>0){e.forEach(((t,a)=>{t.current=a===e.length-1}))}this.applyVisibility(e)}collectItems(){const e=[];const t=this.el.children;for(let a=0;a<t.length;a+=1){const r=t[a];if(r.tagName==="MD-BREADCRUMB-ITEM"){e.push(r)}}return e}applyVisibility(e){if(this.expanded||this.maxItems<=0||e.length<=this.maxItems){e.forEach((e=>{e.collapsed=false;e.style.removeProperty("order")}));return}const t=Math.max(0,this.itemsBeforeCollapse);const a=Math.max(1,this.itemsAfterCollapse);e.forEach(((r,s)=>{const o=s<t;const i=s>=e.length-a;r.collapsed=!(o||i);if(i){r.style.order="2"}else{r.style.removeProperty("order")}}))}setExpanded(e){if(this.expanded===e)return;this.expanded=e;this.applyVisibility(this.collectItems());this.mdExpand.emit({expanded:e,itemCount:this.itemCount})}async expand(){this.setExpanded(true)}async collapse(){this.setExpanded(false)}renderSeparator(e){return r("span",{class:"md-breadcrumbs__separator",part:`separator separator-${e}`,"aria-hidden":"true"},this.separator)}render(){const e=this.maxItems>0&&this.itemCount>this.maxItems&&!this.expanded;return r(s,{key:"6f23f1df810a985f560080ffbc3ef2cc84bb6aac",class:"md-breadcrumbs",role:"navigation","aria-label":this.label},r("ol",{key:"6a8d9404fb7f69b4cc18a5d673db40bc12eecd4c",class:"md-breadcrumbs__list",part:"list"},r("slot",{key:"7be137b4ee893d169a9aacbcd6945cc7198dcea2"}),e&&r("li",{key:"c71d04eed44facd2f43ae324deebec02d3c6a3d9",class:"md-breadcrumbs__overflow",part:"overflow"},Math.max(0,this.itemsBeforeCollapse)>0?this.renderSeparator(-2):null,r("button",{key:"9b2f97c61c4260d765d7e57c82f902859fb7d6a0",type:"button",class:"md-breadcrumbs__overflow-btn",part:"overflow-button","aria-label":this.expandLabel,"aria-expanded":this.expanded?"true":"false",onClick:this.toggleExpanded},r("svg",{key:"5d98bc01fc58049d20119ffd1f2a4dd961c7075c",viewBox:"0 0 24 24",width:"20",height:"20",fill:"currentColor","aria-hidden":"true"},r("circle",{key:"7ddb80ca2c6ddc1156a347c0258a5e0edc1705ef",cx:"6",cy:"12",r:"1.6"}),r("circle",{key:"138c27a9047165cb9bb43232c15c8f8bd9fff7a3",cx:"12",cy:"12",r:"1.6"}),r("circle",{key:"5d7263f67eb5a60d0fb6a3f5e8b0bd50e45e0981",cx:"18",cy:"12",r:"1.6"}))))))}get el(){return this}static get watchers(){return{maxItems:[{onCollapseConfigChange:0}],itemsBeforeCollapse:[{onCollapseConfigChange:0}],itemsAfterCollapse:[{onCollapseConfigChange:0}]}}static get style(){return i()}},[257,"md-breadcrumbs",{label:[1],expandLabel:[1,"expand-label"],separator:[1],maxItems:[2,"max-items"],itemsBeforeCollapse:[2,"items-before-collapse"],itemsAfterCollapse:[2,"items-after-collapse"],density:[514],expanded:[32],itemCount:[32],expand:[64],collapse:[64]},undefined,{maxItems:[{onCollapseConfigChange:0}],itemsBeforeCollapse:[{onCollapseConfigChange:0}],itemsAfterCollapse:[{onCollapseConfigChange:0}]}]);function d(){if(typeof customElements==="undefined"){return}const e=["md-breadcrumbs"];e.forEach((e=>{switch(e){case"md-breadcrumbs":if(!customElements.get(o(e))){customElements.define(o(e),n)}break}}))}d();const c=n;const l=d;export{c as MdBreadcrumbs,l as defineCustomElement};
+//# sourceMappingURL=md-breadcrumbs.js.map