npm - @awc-ui/core - Versions diffs - 1.0.0-beta.2 → 1.0.0-beta.3 - Mend

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

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (698) hide show

package/dist/components/md-area-chart.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"names":["mdAreaChartCss","MdAreaChart","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","label","titleAlign","series","curve","stack","connectNulls","showMarks","legend","tooltip","zoom","locale","noAnimation","animation","fillOpacity","showLine","grid","inverted","seriesLabels","summary","labelEmpty","loading","loadingLabel","labelZoomStart","labelZoomEnd","axisTicks","showLabels","labelPlot","labelPoint","density","mounted","kbIndex","announcement","zoomWin","dragBand","grab","engine","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","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","rebuildA11yTable","resize","replay","toDataURL","getInstance","makeEngine","mdReady","emit","LineChartEngine","ResizeObserver","observe","buildEngineTheme","t","background","textColor","textColorMuted","axisLineColor","gridLineColor","gridColor","surface","fontFamily","labelSize","titleSize","zoomSliderOn","longest","reduce","acc","range","data","xAxis","w","reset","mdZoom","startIndex","endIndex","setZoom","p","y","height","zoomBandStyle","off","canvasOffset","left","top","canvas","host","getBoundingClientRect","box","best","bestD","Infinity","forEach","px","d","clientY","sliderTrackRect","slider","shadowRoot","querySelector","r","track","f","renderZoomSlider","pct","fmt","String","h","class","part","exportparts","controlled","step","ariaLabelStart","ariaLabelEnd","valueStartText","valueEndText","onMdInput","onMdChange","onMdDragStart","onMdDragEnd","onMdFocus","onMdBlur","style","insetInlineStart","inlineSize","onPointerDown","buildSpec","percentage","yFmt","v","valueFormatter","toLocaleString","zw","cut","arr","slice","rebaseMap","rec","out","k","Object","entries","Number","color","resolveSeriesColor","pickPaletteColor","palette","normalizeRange","fill","stroke","dash","symbol","pointSymbols","lineWidth","markSize","title","subtitle","animationDuration","xValues","xScale","scale","xFormatter","defaultValueFormatter","xLabel","xHidden","xHideTicks","hideTicks","xDash","xGridDash","gridDash","xBands","resolveAxisBands","bands","yBands","yAxis","xBreaks","breaks","yBreaks","yScale","yMin","yMax","yFormatter","yTickFormatter","yLabel","yHidden","yHideTicks","yDash","yGridDash","area","gridY","gridX","readMdChartTheme","setSpec","onHover","idx","mdHover","dataIndex","axisValue","seriesIndices","visibleSeriesIndices","onLegendClick","item","mdLegendClick","seriesId","selected","onPointClick","si","di","clickDetail","mdMarkerClick","onLineClick","mdLineClick","onAreaClick","mdAreaClick","onAxisClick","values","mdAxisClick","seriesValues","nativeEvent","setHoverEnabled","setTooltip","render","tooltipRenderer","missingFormatter","trigger","hp","hoverPoints","_","filter","innerHTML","buildDataTableHtml","xAxisLabel","xAxisData","xValueFormatter","labels","tableLabels","focusIndex","xText","xLabels","pt","byIndex","Boolean","join","replace","buildChartSummary","chartType","seriesCount","xMin","xMax","empty","Host","role","heightProp","blockSize","onPointerCancel","onDblClick","name","ref","tabindex","onKeyDown","onBlur","variant","indeterminate"],"sources":["src/components/md-area-chart/md-area-chart.css?tag=md-area-chart&encapsulation=shadow","src/components/md-area-chart/md-area-chart.tsx"],"sourcesContent":["/* ==========================================================\n md-area-chart — Material Design 3 area / streamgraph chart\n\n PUBLIC CSS CUSTOM PROPERTIES:\n --md-area-chart-block-size Explicit chart height, overriding the aspect ratio (default: auto)\n --md-area-chart-min-block-size Floor the chart height never drops below (density-aware)\n --md-area-chart-aspect-ratio Width:height ratio used when no block-size is set (default: 16 / 9)\n --md-area-chart-background Chart surface fill (default: surface-container-low)\n --md-area-chart-padding Inset between the host edge and the plot canvas (density-aware)\n --md-area-chart-shape Corner radius of the chart surface (density-aware)\n --md-area-chart-zoom-size Height reserved for the zoom slider (default: 28px)\n --md-area-chart-zoom-track-color Zoom slider track colour (md-slider inactive track)\n --md-area-chart-zoom-window-color Zoom slider selected-window colour (md-slider active track)\n --md-area-chart-zoom-handle-color Zoom slider thumb + drag-band edge colour\n --md-area-chart-zoom-band-color Drag-to-zoom selection fill\n --md-area-chart-empty-color Empty-state text colour (default: on-surface-variant)\n --md-area-chart-empty-background Empty-state overlay fill (defaults to the chart background)\n --md-area-chart-empty-font Empty-state font family (default: body-medium)\n --md-area-chart-empty-font-size Empty-state font size (default: body-medium, 14px)\n --md-area-chart-empty-icon-size Size of an icon slotted into the empty state (default: 40px)\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 loading Loading overlay, shown while `loading` is set\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 loading Replaces the built-in spinner while `loading` is set\n footer Content for the footer row below the plot\n ========================================================== /\n\n:host {\n --_block-size: var(--md-area-chart-block-size, auto);\n --_min-block-size: var(--md-area-chart-min-block-size, max(120px, calc(160px + var(--md-sys-density-scale, 0) 8px)));\n --_aspect-ratio: var(--md-area-chart-aspect-ratio, 16 / 9);\n --_background: var(--md-area-chart-background, var(--md-sys-color-surface-container-low, #F7F2FA));\n --_padding: var(--md-area-chart-padding, max(8px, calc(16px + var(--md-sys-density-scale, 0) * 2px)));\n --_zoom-size: var(--md-area-chart-zoom-size, 28px);\n --_zoom-track-color: var(--md-area-chart-zoom-track-color, var(--md-sys-color-surface-container-highest, #E6E0E9));\n --_zoom-window-color: var(--md-area-chart-zoom-window-color, var(--md-sys-color-secondary-container, #E8DEF8));\n --_zoom-handle-color: var(--md-area-chart-zoom-handle-color, var(--md-sys-color-primary, #6750A4));\n --_zoom-band-color: var(--md-area-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 --_shape: var(--md-area-chart-shape, max(8px, calc(16px + var(--md-sys-density-scale, 0) 2px)));\n --_empty-color: var(--md-area-chart-empty-color, var(--md-sys-color-on-surface-variant, #49454F));\n --_empty-background: var(--md-area-chart-empty-background, var(--_background));\n --_empty-font: var(--md-area-chart-empty-font, var(--md-sys-typescale-body-medium-font-family, Roboto, sans-serif));\n --_empty-font-size: var(--md-area-chart-empty-font-size, var(--md-sys-typescale-body-medium-font-size, 14px));\n --_empty-icon-size: var(--md-area-chart-empty-icon-size, 40px);\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-area-chart__header,\n.md-area-chart__footer { display: contents; }\n\n.md-area-chart__header > slot[name='header']::slotted(),\n.md-area-chart__footer > slot[name='footer']::slotted() {\n display: block;\n margin-block: 8px;\n}\n\n.md-area-chart__canvas {\n position: absolute;\n inset: var(--_padding);\n min-block-size: 0;\n min-inline-size: 0;\n}\n\n.md-area-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/ 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-area-chart__empty ::slotted(.material-symbols-outlined),\n.md-area-chart__empty ::slotted(.material-symbols-rounded),\n.md-area-chart__empty ::slotted(.material-symbols-sharp),\n.md-area-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-area-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-area-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-area-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/ Loading state — the same opaque overlay as the empty state (it has to mask\n the phantom 0-1 axis the engine draws while there is no data), with the\n default indicator + label stacked in the middle. Slot `loading` replaces the\n content; the box keeps its size either way. /\n.md-area-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-area-chart__spinner {\n / Sized against the empty-state icon so a loading chart and an empty one read\n as the same family. /\n inline-size: var(--_empty-icon-size);\n block-size: var(--_empty-icon-size);\n}\n\n/ ── Zoom ──────────────────────────────────────────────────\n The slider sits inside the host's padding at the bottom, and the plot gives\n up exactly that much height (the canvas is inset by --_padding, so its bottom\n is pushed up by the slider's height). /\n:host(.md-area-chart--zoom-slider) .md-area-chart__canvas {\n bottom: calc(var(--_padding) + var(--_zoom-size));\n}\n\n:host(.md-area-chart--zoom-drag) .md-area-chart__canvas {\n / Signals the plot is draggable; the band itself is pointer-transparent. /\n cursor: ew-resize;\n}\n\n.md-area-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-area-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-area-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-area-chart__zoom-pan:active {\n cursor: grabbing;\n}\n\n/ Live drag selection over the plot. /\n.md-area-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/ ==========================================================\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 resolveAxisBands,\n resolveSeriesColor,\n LineChartEngine,\n type EngineTheme,\n type LineChartSpec,\n type MdChartAnimation,\n type MdChartAxis,\n type MdChartAxisClickDetail,\n type MdChartAxisValue,\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-area-chart — Material Design 3 area / streamgraph chart,\n * rendered by the in-house engine (Canvas2D + a DOM text\n * overlay). No ECharts.\n \n Differences from `md-line-chart`:\n * • the line is always filled with a gradient\n * • stacking defaults to `'normal'` (areas stack additively)\n * • supports the `silhouette` streamgraph baseline\n * • markers are off by default\n /\n@Component({\n tag: 'md-area-chart',\n styleUrl: 'md-area-chart.css',\n shadow: true,\n})\nexport class MdAreaChart {\n @Element() el!: HTMLElement;\n\n @Prop() label: string = '';\n\n /* Sub-title, drawn under the title in the muted text colour. /\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 @Prop() xAxis: MdChartAxis \| undefined;\n @Prop() yAxis: MdChartAxis \| undefined;\n @Prop() curve: 'linear' \| 'smooth' \| 'monotone' \| 'step' \| 'step-before' \| 'step-middle' = 'smooth';\n\n /* Default stacking is `'normal'` (additive). /\n @Prop() stack: MdChartStackMode = 'normal';\n\n @Prop({ attribute: 'connect-nulls' }) connectNulls: boolean = false;\n @Prop({ attribute: 'show-marks' }) showMarks: boolean = false;\n /* Line stroke width in px, for every series. Per-series `series[].lineWidth` wins. /\n @Prop({ attribute: 'line-width' }) lineWidth?: number;\n /* Marker RADIUS in px, for every series. Per-series `series[].markSize` wins. /\n @Prop({ attribute: 'mark-size' }) markSize?: number;\n @Prop({ reflect: true }) legend: MdChartLegendPosition \| 'none' = 'top-end';\n @Prop() tooltip: MdChartTooltipTrigger = 'axis';\n @Prop() zoom: 'none' \| 'inside' \| 'slider' \| 'both' = 'none';\n /\n Format raw Y values for tooltips / a11y table. The tooltip also asks it\n * about series with NO value at the hovered x — `null` for a null datum,\n * `undefined` for no datum at all — and shows a row for one when it returns\n * a 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 /* Fill opacity for the gradient (0..1). /\n @Prop({ attribute: 'fill-opacity' }) fillOpacity: number = 0.55;\n\n /\n Draw the line on top of each area's fill. Default `true`. Set `false` for a\n * fill-only area — useful when `fillOpacity` is high (a fully-opaque fill is the\n * same colour as the line, so the line reads as part of it). A per-series\n * `series[].stroke` still wins over this.\n /\n @Prop({ attribute: 'show-line' }) showLine: boolean = true;\n\n /* Gridlines: horizontal (y ticks), vertical (x ticks), both, or none. /\n @Prop() grid: 'none' \| 'horizontal' \| 'vertical' \| 'both' = 'horizontal';\n\n /\n Transpose the axes: the category / time axis runs down the side and values\n * run across the bottom. Suits long category names (they read horizontally\n * instead of rotated) and quantities naturally read as depth — altitude,\n * ocean depth, a drill core. `stack` applies as usual, along the value axis.\n /\n @Prop() inverted: boolean = false;\n\n /* Label each series at its last point, so the name follows the end of the\n * band — for racing / progression charts. /\n @Prop({ attribute: 'series-labels' }) seriesLabels: boolean = false;\n\n /\n Replaces the generated `aria-label` outright. The default summary is\n * assembled in English (\"Traffic, Area chart, with 3 series, from Jan to\n * Dec.\"); rather than translate it piecewise, hand over the whole sentence\n * built in your own language.\n /\n @Prop() summary: string = '';\n\n /\n Translatable chrome for the screen-reader data table. `%shown%` and\n * `%total%` are substituted in `truncated`.\n /\n @Prop() tableLabels?: { x?: string; index?: string; series?: string; truncated?: string };\n\n /* Message shown when `series` is empty. The `empty` slot overrides it. /\n @Prop({ attribute: 'label-empty' }) labelEmpty: string = 'No data to display';\n\n /* Show the loading overlay instead of the plot. /\n @Prop() loading: boolean = false;\n\n /* Text (and the spinner's accessible name) for the loading overlay. /\n @Prop({ attribute: 'loading-label' }) loadingLabel: string = 'Loading chart…';\n\n /* Accessible name for the zoom slider's start thumb. /\n @Prop({ attribute: 'label-zoom-start' }) labelZoomStart: string = 'Zoom range start';\n /* Accessible name for the zoom slider's end thumb. /\n @Prop({ attribute: 'label-zoom-end' }) labelZoomEnd: string = 'Zoom range end';\n\n /* Draw small perpendicular tick marks on the axes. /\n @Prop({ attribute: 'axis-ticks' }) axisTicks: boolean = false;\n /* Print each point's value as a data label beside its marker. /\n @Prop({ attribute: 'show-labels' }) showLabels: boolean = false;\n\n @Event() mdMarkerClick!: EventEmitter<MdChartClickDetail<MdChartSeries>>;\n\n /* Fires when a series' drawn line is clicked between its data points (a\n * click on a point emits `mdMarkerClick` instead). /\n @Event() mdLineClick!: EventEmitter<MdChartClickDetail<MdChartSeries>>;\n\n /* Fires when a series' filled area is clicked — the band between its line\n * and its base (its own band when stacked), excluding its line and points. /\n @Event() mdAreaClick!: EventEmitter<MdChartClickDetail<MdChartSeries>>;\n\n /* Fires when the plot background is clicked (inside the plot, but not on a\n * mark, line or area): the nearest x plus every visible series' value there. /\n @Event() mdAxisClick!: EventEmitter<MdChartAxisClickDetail>;\n\n @Event() mdLegendClick!: EventEmitter<{ seriesIndex: number; seriesId?: string; selected: boolean }>;\n @Event() mdHover!: EventEmitter<MdChartHoverDetail>;\n @Event() mdReady!: EventEmitter<void>;\n\n /* Fires when the zoom window changes (drag, slider or `setZoom`/`resetZoom`). /\n @Event() mdZoom!: EventEmitter<{ startIndex: number; endIndex: number; reset: boolean }>;\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 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 index window, or null for the full range. /\n @State() private zoomWin: { start: number; end: number } \| null = null;\n\n /* Live drag rectangle (plot-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\n private engine: LineChartEngine \| null = null;\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\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')\n @Watch('curve') @Watch('stack') @Watch('legend')\n @Watch('tooltip') @Watch('zoom') @Watch('connectNulls')\n @Watch('showMarks') @Watch('lineWidth') @Watch('markSize') @Watch('label') @Watch('subtitle') @Watch('titleAlign') @Watch('fillOpacity') @Watch('showLine') @Watch('grid') @Watch('axisTicks') @Watch('showLabels') @Watch('inverted') @Watch('loading')\n @Watch('animation') @Watch('animationDuration') @Watch('tooltipRenderer') @Watch('valueFormatter')\n onAnyPropChange() {\n this.applyEngine();\n this.rebuildA11yTable();\n }\n\n @Method()\n async resize(): Promise<void> {\n this.engine?.resize();\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 @Method()\n async toDataURL(): Promise<string> {\n return this.engine?.toDataURL('image/png') ?? '';\n }\n\n @Method()\n async getInstance(): Promise<LineChartEngine \| null> {\n return this.engine;\n }\n\n private bindChartHost = (el?: HTMLDivElement) => {\n this.chartHost = el;\n };\n\n private bindA11yTableHost = (el?: HTMLDivElement) => {\n this.a11yTableHost = el;\n };\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 LineChartEngine(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 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\n private get zoomInside(): boolean {\n return this.zoom === 'inside' \|\| this.zoom === 'both';\n }\n\n private get zoomSliderOn(): boolean {\n return this.zoom === 'slider' \|\| this.zoom === 'both';\n }\n\n /* Number of datapoints along x — the longest series, or the axis if longer. /\n private dataLength(): number {\n const longest = this.series.reduce(\n (acc, s) => Math.max(acc, s.range?.length ?? s.data?.length ?? 0),\n 0,\n );\n return Math.max(longest, this.xAxis?.data?.length ?? 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 points visible, else there is no band to draw.\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 this.applyEngine();\n this.rebuildA11yTable();\n this.mdZoom.emit({ startIndex: reset ? 0 : s, endIndex: reset ? last : e, reset });\n }\n\n /* Zoom to an absolute index 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 `plotX`/`plotY`; only the drag band, positioned against the\n * host, converts back out. Reading these as host coordinates drew the band\n * ~16px above the x-axis and shifted the selected range by the same amount.\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 /\n Drag-band geometry, converted from canvas space back out to host space\n * (the band is `position: absolute` inside a `position: relative` :host).\n \n Physical `left`/`top`, not logical insets: both values are offsets from the\n * host's LEFT edge, which `inset-inline-start` would mirror to the right in\n * RTL. Same idiom as md-line-chart / md-bar-chart.\n /\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 /* 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 /* Map a canvas-relative x to the nearest ABSOLUTE data index. /\n private indexAtX(hostX: number): number {\n const scene = this.engine?.getScene();\n const w = this.win();\n if (!scene?.xPositions?.length) return w.start;\n let best = 0;\n let bestD = Infinity;\n scene.xPositions.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 /* 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 /* Is the event over the plot itself (as opposed to the header, 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, NOT `e.target`: this\n // listener is on the host, so a shadow-internal target is retargeted to the\n // host, and capturing there would send the whole gesture — including the\n // closing click — to the host, where the plot canvas never sees it.\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 marker\n // clicks and tooltips keep working.\n if (Math.abs(band.x2 - band.x1) < 8) return;\n // In RTL the plot is mirrored, so the LEFT edge of the band is the LATER\n // index — order by index, not by pixel, or the 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-area-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 f = (clientX - track.left) / track.width;\n return track.rtl ? 1 - f : f;\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-area-chart__zoom\" part=\"zoom\">\n <md-slider\n class=\"md-area-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-area-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>): LineChartSpec {\n const percentage = this.stack === 'percentage';\n const yFmt = (v: number) => (this.valueFormatter ? this.valueFormatter(v) : v.toLocaleString(this.locale \|\| undefined));\n // Zoom is a view: slice what the engine draws, leave `this.series` alone.\n // Index-addressed options (pointSymbols) are rebased into window\n // coordinates, and anything outside the window is dropped.\n const zw = this.zoomWin ? this.win() : null;\n const cut = <T,>(arr: T[] \| undefined): T[] \| undefined =>\n arr && zw ? arr.slice(zw.start, zw.end + 1) : arr;\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 const keys = this.seriesKeys();\n return {\n series: this.series.map((s, i) => ({\n label: s.label ?? `Series ${i + 1}`,\n color: resolveSeriesColor(this.el, s.color, pickPaletteColor(t.palette, i)),\n // A range series draws from its band; `data` only keeps the row count\n // aligned so the shared x axis and hover index still line up.\n data: cut(s.range ? s.range.map(() => null) : s.data) ?? [],\n range: cut(s.range?.map(normalizeRange)),\n fill: s.fill,\n // A streamgraph rides a free baseline, so a layer's top edge is not a\n // value anyone can read — stroking it just adds noise. Explicit\n // per-series `stroke` still wins.\n stroke: s.stroke ?? (!this.showLine \|\| this.stack === 'wiggle' \|\| this.stack === 'silhouette' ? false : undefined),\n curve: s.curve ?? this.curve,\n connectNulls: s.connectNulls ?? this.connectNulls,\n showMarks: s.showMarks ?? this.showMarks,\n hidden: s.hidden ?? this.legendHidden.get(keys[i]) ?? false,\n dash: s.dash,\n symbol: s.symbol,\n pointSymbols: rebaseMap(s.pointSymbols),\n lineWidth: s.lineWidth ?? this.lineWidth,\n markSize: s.markSize ?? this.markSize,\n })),\n title: this.label \|\| undefined,\n subtitle: this.subtitle \|\| undefined,\n titleAlign: this.titleAlign,\n animation: this.noAnimation ? 'none' : this.animation,\n animationDuration: this.animationDuration,\n xValues: cut(this.xAxis?.data) ?? [],\n xScale: this.xAxis?.scale ?? 'category',\n xFormatter: this.xAxis?.valueFormatter ?? ((v: MdChartAxisValue) => defaultValueFormatter(v, this.locale)),\n xLabel: this.xAxis?.label,\n xHidden: this.xAxis?.hidden,\n xHideTicks: this.xAxis?.hideTicks,\n xDash: this.xAxis?.dash,\n xGridDash: this.xAxis?.gridDash,\n xBands: resolveAxisBands(this.el, this.xAxis?.bands),\n yBands: resolveAxisBands(this.el, this.yAxis?.bands),\n xBreaks: this.xAxis?.breaks,\n yBreaks: this.yAxis?.breaks,\n yScale: this.yAxis?.scale ?? 'value',\n yMin: percentage ? 0 : this.yAxis?.min,\n yMax: percentage ? 100 : this.yAxis?.max,\n yFormatter: percentage ? (v: number) => `${Math.round(v)}%` : yFmt,\n // The axis can format independently of the values (bare numbers on the\n // axis, units in the tooltip); unset → the axis follows `valueFormatter`.\n yTickFormatter:\n !percentage && this.yAxis?.valueFormatter ? (v: number) => this.yAxis!.valueFormatter!(v) : undefined,\n yLabel: this.yAxis?.label,\n yHidden: this.yAxis?.hidden,\n yHideTicks: this.yAxis?.hideTicks,\n yDash: this.yAxis?.dash,\n yGridDash: this.yAxis?.gridDash,\n stack: this.stack,\n inverted: this.inverted,\n area: true,\n fillOpacity: this.fillOpacity,\n legend: this.legend,\n gridY: this.grid === 'horizontal' \|\| this.grid === 'both',\n gridX: this.grid === 'vertical' \|\| this.grid === 'both',\n axisTicks: this.axisTicks,\n showLabels: this.showLabels,\n seriesLabels: this.seriesLabels,\n };\n }\n\n private applyEngine() {\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 indexes the WINDOW; consumers index the data they gave us.\n const abs = idx + (this.zoomWin ? this.win().start : 0);\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 d = this.clickDetail(si, di, e);\n if (d) this.mdMarkerClick.emit(d);\n },\n onLineClick: (si, di, e) => {\n const d = this.clickDetail(si, di, e);\n if (d) this.mdLineClick.emit(d);\n },\n onAreaClick: (si, di, e) => {\n const d = this.clickDetail(si, di, e);\n if (d) this.mdAreaClick.emit(d);\n },\n onAxisClick: (di, values, e) => {\n const abs = di + (this.zoomWin ? this.win().start : 0);\n this.mdAxisClick.emit({\n dataIndex: abs,\n axisValue: this.xAxis?.data?.[abs],\n seriesValues: values.map((v) => ({\n seriesIndex: v.seriesIndex,\n seriesId: this.series[v.seriesIndex]?.id,\n label: v.label,\n dataIndex: v.value == null ? -1 : abs,\n value: v.value,\n })),\n nativeEvent: e,\n });\n },\n });\n this.engine.setHoverEnabled(this.tooltip !== 'none');\n this.engine.setTooltip({\n render: this.tooltipRenderer,\n missingFormatter: this.valueFormatter,\n // `item` reports only the band under the cursor; `axis` lists them all.\n trigger: this.tooltip === 'item' ? 'item' : 'axis',\n });\n }\n\n /** The payload shared by the three per-series click events (marker / line /\n * area) — same shape, different gesture. /\n private clickDetail(si: number, di: number, e: PointerEvent): MdChartClickDetail<MdChartSeries> \| null {\n const s = this.series[si];\n if (!s) return null;\n const abs = di + (this.zoomWin ? this.win().start : 0);\n return {\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\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 labels: this.tableLabels,\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 default:\n return;\n }\n e.preventDefault();\n this.moveKeyboardCursor(next);\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 =\n this.summary \|\|\n buildChartSummary({\n title: this.label,\n chartType: 'area',\n seriesCount: this.series.length,\n locale: this.locale,\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 // would just be the wrong answer to \"where is my data?\".\n const empty = this.series.length === 0 && !this.loading;\n\n return (\n <Host\n class={{\n 'md-area-chart': true,\n 'md-area-chart--empty': empty,\n 'md-area-chart--mounted': this.mounted,\n 'md-area-chart--zoom-slider': this.zoomSliderOn,\n 'md-area-chart--zoom-drag': this.zoomInside,\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-area-chart__header\" part=\"header\"><slot name=\"header\"></slot></header>\n <div\n class=\"md-area-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-area-chart__empty\" part=\"empty\">\n <slot name=\"empty\">{this.labelEmpty}</slot>\n </div>\n )}\n\n {/ Loader — same opaque overlay as the empty state, so the phantom axis\n the engine draws for absent data can't show through. /}\n {this.loading && (\n <div class=\"md-area-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-area-chart__spinner\"\n variant=\"circular\"\n indeterminate\n label={this.loadingLabel}\n ></md-progress-indicator>\n <span class=\"md-area-chart__loading-text\">{this.loadingLabel}</span>\n </slot>\n </slot>\n </div>\n )}\n {/ Live drag selection over the plot, while a zoom range is dragged. /}\n {this.dragBand && this.plotRect() && (\n <div\n class=\"md-area-chart__zoom-band\"\n part=\"zoom-band\"\n style={this.zoomBandStyle()}\n ></div>\n )}\n {this.zoomSliderOn && this.renderZoomSlider()}\n <footer class=\"md-area-chart__footer\" part=\"footer\"><slot name=\"footer\"></slot></footer>\n <div class=\"md-area-chart__a11y-table\" ref={el => this.bindA11yTableHost(el as HTMLDivElement)}></div>\n\n {/ Narrates the keyboard cursor, politely. */}\n <div class=\"md-area-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":[]}
1	+ {"version":3,"names":["mdAreaChartCss","MdAreaChart","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","label","titleAlign","series","curve","stack","connectNulls","showMarks","legend","tooltip","zoom","locale","noAnimation","animation","fillOpacity","showLine","grid","inverted","seriesLabels","summary","labelEmpty","loading","loadingLabel","labelZoomStart","labelZoomEnd","axisTicks","showLabels","labelPlot","labelPoint","density","mounted","kbIndex","announcement","zoomWin","dragBand","grab","engine","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","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","rebuildA11yTable","resize","replay","toDataURL","getInstance","makeEngine","mdReady","emit","LineChartEngine","ResizeObserver","observe","buildEngineTheme","t","background","textColor","textColorMuted","axisLineColor","gridLineColor","gridColor","surface","fontFamily","labelSize","titleSize","zoomSliderOn","longest","reduce","acc","range","data","xAxis","w","reset","mdZoom","startIndex","endIndex","setZoom","p","y","height","zoomBandStyle","off","canvasOffset","left","top","canvas","host","getBoundingClientRect","box","best","bestD","Infinity","forEach","px","d","clientY","sliderTrackRect","slider","shadowRoot","querySelector","r","track","f","renderZoomSlider","pct","fmt","String","h","class","part","exportparts","controlled","step","ariaLabelStart","ariaLabelEnd","valueStartText","valueEndText","onMdInput","onMdChange","onMdDragStart","onMdDragEnd","onMdFocus","onMdBlur","style","insetInlineStart","inlineSize","onPointerDown","buildSpec","percentage","yFmt","v","valueFormatter","toLocaleString","zw","cut","arr","slice","rebaseMap","rec","out","k","Object","entries","Number","color","resolveSeriesColor","pickPaletteColor","palette","normalizeRange","fill","stroke","dash","symbol","pointSymbols","lineWidth","markSize","title","subtitle","animationDuration","xValues","xScale","scale","xFormatter","defaultValueFormatter","xLabel","xHidden","xHideTicks","hideTicks","xDash","xGridDash","gridDash","xBands","resolveAxisBands","bands","yBands","yAxis","xBreaks","breaks","yBreaks","yScale","yMin","yMax","yFormatter","yTickFormatter","yLabel","yHidden","yHideTicks","yDash","yGridDash","area","gridY","gridX","readMdChartTheme","setSpec","onHover","idx","mdHover","dataIndex","axisValue","seriesIndices","visibleSeriesIndices","onLegendClick","item","mdLegendClick","seriesId","selected","onPointClick","si","di","clickDetail","mdMarkerClick","onLineClick","mdLineClick","onAreaClick","mdAreaClick","onAxisClick","values","mdAxisClick","seriesValues","nativeEvent","setHoverEnabled","setTooltip","render","tooltipRenderer","missingFormatter","trigger","hp","hoverPoints","_","filter","innerHTML","buildDataTableHtml","xAxisLabel","xAxisData","xValueFormatter","labels","tableLabels","focusIndex","xText","xLabels","pt","byIndex","Boolean","join","replace","buildChartSummary","chartType","seriesCount","xMin","xMax","empty","Host","role","heightProp","blockSize","onPointerCancel","onDblClick","name","ref","tabindex","onKeyDown","onBlur","variant","indeterminate"],"sources":["src/components/md-area-chart/md-area-chart.css?tag=md-area-chart&encapsulation=shadow","src/components/md-area-chart/md-area-chart.tsx"],"sourcesContent":["/* ==========================================================\n md-area-chart — Material Design 3 area / streamgraph chart\n\n PUBLIC CSS CUSTOM PROPERTIES:\n --md-area-chart-block-size Explicit chart height, overriding the aspect ratio (default: auto)\n --md-area-chart-min-block-size Floor the chart height never drops below (density-aware)\n --md-area-chart-aspect-ratio Width:height ratio used when no block-size is set (default: 16 / 9)\n --md-area-chart-background Chart surface fill (default: surface-container-low)\n --md-area-chart-padding Inset between the host edge and the plot canvas (density-aware)\n --md-area-chart-shape Corner radius of the chart surface (density-aware)\n --md-area-chart-zoom-size Height reserved for the zoom slider (default: 28px)\n --md-area-chart-zoom-track-color Zoom slider track colour (md-slider inactive track)\n --md-area-chart-zoom-window-color Zoom slider selected-window colour (md-slider active track)\n --md-area-chart-zoom-handle-color Zoom slider thumb + drag-band edge colour\n --md-area-chart-zoom-band-color Drag-to-zoom selection fill\n --md-area-chart-empty-color Empty-state text colour (default: on-surface-variant)\n --md-area-chart-empty-background Empty-state overlay fill (defaults to the chart background)\n --md-area-chart-empty-font Empty-state font family (default: body-medium)\n --md-area-chart-empty-font-size Empty-state font size (default: body-medium, 14px)\n --md-area-chart-empty-icon-size Size of an icon slotted into the empty state (default: 40px)\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 loading Loading overlay, shown while `loading` is set\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 loading Replaces the built-in spinner while `loading` is set\n footer Content for the footer row below the plot\n ========================================================== /\n\n:host {\n --_block-size: var(--md-area-chart-block-size, auto);\n --_min-block-size: var(--md-area-chart-min-block-size, max(120px, calc(160px + var(--md-sys-density-scale, 0) 8px)));\n --_aspect-ratio: var(--md-area-chart-aspect-ratio, 16 / 9);\n --_background: var(--md-area-chart-background, var(--md-sys-color-surface-container-low, #F7F2FA));\n --_padding: var(--md-area-chart-padding, max(8px, calc(16px + var(--md-sys-density-scale, 0) * 2px)));\n --_zoom-size: var(--md-area-chart-zoom-size, 28px);\n --_zoom-track-color: var(--md-area-chart-zoom-track-color, var(--md-sys-color-surface-container-highest, #E6E0E9));\n --_zoom-window-color: var(--md-area-chart-zoom-window-color, var(--md-sys-color-secondary-container, #E8DEF8));\n --_zoom-handle-color: var(--md-area-chart-zoom-handle-color, var(--md-sys-color-primary, #6750A4));\n --_zoom-band-color: var(--md-area-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 --_shape: var(--md-area-chart-shape, max(8px, calc(16px + var(--md-sys-density-scale, 0) 2px)));\n --_empty-color: var(--md-area-chart-empty-color, var(--md-sys-color-on-surface-variant, #49454F));\n --_empty-background: var(--md-area-chart-empty-background, var(--_background));\n --_empty-font: var(--md-area-chart-empty-font, var(--md-sys-typescale-body-medium-font-family, Roboto, sans-serif));\n --_empty-font-size: var(--md-area-chart-empty-font-size, var(--md-sys-typescale-body-medium-font-size, 14px));\n --_empty-icon-size: var(--md-area-chart-empty-icon-size, 40px);\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-area-chart__header,\n.md-area-chart__footer { display: contents; }\n\n.md-area-chart__header > slot[name='header']::slotted(),\n.md-area-chart__footer > slot[name='footer']::slotted() {\n display: block;\n margin-block: 8px;\n}\n\n.md-area-chart__canvas {\n position: absolute;\n inset: var(--_padding);\n min-block-size: 0;\n min-inline-size: 0;\n}\n\n.md-area-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/ 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-area-chart__empty ::slotted(.material-symbols-outlined),\n.md-area-chart__empty ::slotted(.material-symbols-rounded),\n.md-area-chart__empty ::slotted(.material-symbols-sharp),\n.md-area-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-area-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-area-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-area-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/ Loading state — the same opaque overlay as the empty state (it has to mask\n the phantom 0-1 axis the engine draws while there is no data), with the\n default indicator + label stacked in the middle. Slot `loading` replaces the\n content; the box keeps its size either way. /\n.md-area-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-area-chart__spinner {\n / Sized against the empty-state icon so a loading chart and an empty one read\n as the same family. /\n inline-size: var(--_empty-icon-size);\n block-size: var(--_empty-icon-size);\n}\n\n/ ── Zoom ──────────────────────────────────────────────────\n The slider sits inside the host's padding at the bottom, and the plot gives\n up exactly that much height (the canvas is inset by --_padding, so its bottom\n is pushed up by the slider's height). /\n:host(.md-area-chart--zoom-slider) .md-area-chart__canvas {\n bottom: calc(var(--_padding) + var(--_zoom-size));\n}\n\n:host(.md-area-chart--zoom-drag) .md-area-chart__canvas {\n / Signals the plot is draggable; the band itself is pointer-transparent. /\n cursor: ew-resize;\n}\n\n.md-area-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-area-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-area-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-area-chart__zoom-pan:active {\n cursor: grabbing;\n}\n\n/ Live drag selection over the plot. /\n.md-area-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/ ==========================================================\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 resolveAxisBands,\n resolveSeriesColor,\n LineChartEngine,\n type EngineTheme,\n type LineChartSpec,\n type MdChartAnimation,\n type MdChartAxis,\n type MdChartAxisClickDetail,\n type MdChartAxisValue,\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-area-chart — Material Design 3 area / streamgraph chart,\n * rendered by the in-house engine (Canvas2D + a DOM text\n * overlay). No ECharts.\n \n Differences from `md-line-chart`:\n * • the line is always filled with a gradient\n * • stacking defaults to `'normal'` (areas stack additively)\n * • supports the `silhouette` streamgraph baseline\n * • markers are off by default\n /\n@Component({\n tag: 'md-area-chart',\n styleUrl: 'md-area-chart.css',\n shadow: true,\n})\nexport class MdAreaChart {\n @Element() el!: HTMLElement;\n\n @Prop() label: string = '';\n\n /* Sub-title, drawn under the title in the muted text colour. /\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 @Prop() xAxis: MdChartAxis \| undefined;\n @Prop() yAxis: MdChartAxis \| undefined;\n @Prop() curve: 'linear' \| 'smooth' \| 'monotone' \| 'step' \| 'step-before' \| 'step-middle' = 'smooth';\n\n /* Default stacking is `'normal'` (additive). /\n @Prop() stack: MdChartStackMode = 'normal';\n\n @Prop({ attribute: 'connect-nulls' }) connectNulls: boolean = false;\n @Prop({ attribute: 'show-marks' }) showMarks: boolean = false;\n /* Line stroke width in px, for every series. Per-series `series[].lineWidth` wins. /\n @Prop({ attribute: 'line-width' }) lineWidth?: number;\n /* Marker RADIUS in px, for every series. Per-series `series[].markSize` wins. /\n @Prop({ attribute: 'mark-size' }) markSize?: number;\n @Prop({ reflect: true }) legend: MdChartLegendPosition \| 'none' = 'top-end';\n @Prop() tooltip: MdChartTooltipTrigger = 'axis';\n @Prop() zoom: 'none' \| 'inside' \| 'slider' \| 'both' = 'none';\n /\n Format raw Y values for tooltips / a11y table. The tooltip also asks it\n * about series with NO value at the hovered x — `null` for a null datum,\n * `undefined` for no datum at all — and shows a row for one when it returns\n * a 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 /* Fill opacity for the gradient (0..1). /\n @Prop({ attribute: 'fill-opacity' }) fillOpacity: number = 0.55;\n\n /\n Draw the line on top of each area's fill. Default `true`. Set `false` for a\n * fill-only area — useful when `fillOpacity` is high (a fully-opaque fill is the\n * same colour as the line, so the line reads as part of it). A per-series\n * `series[].stroke` still wins over this.\n /\n @Prop({ attribute: 'show-line' }) showLine: boolean = true;\n\n /* Gridlines: horizontal (y ticks), vertical (x ticks), both, or none. /\n @Prop() grid: 'none' \| 'horizontal' \| 'vertical' \| 'both' = 'horizontal';\n\n /\n Transpose the axes: the category / time axis runs down the side and values\n * run across the bottom. Suits long category names (they read horizontally\n * instead of rotated) and quantities naturally read as depth — altitude,\n * ocean depth, a drill core. `stack` applies as usual, along the value axis.\n /\n @Prop() inverted: boolean = false;\n\n /* Label each series at its last point, so the name follows the end of the\n * band — for racing / progression charts. /\n @Prop({ attribute: 'series-labels' }) seriesLabels: boolean = false;\n\n /\n Replaces the generated `aria-label` outright. The default summary is\n * assembled in English (\"Traffic, Area chart, with 3 series, from Jan to\n * Dec.\"); rather than translate it piecewise, hand over the whole sentence\n * built in your own language.\n /\n @Prop() summary: string = '';\n\n /\n Translatable chrome for the screen-reader data table. `%shown%` and\n * `%total%` are substituted in `truncated`.\n /\n @Prop() tableLabels?: { x?: string; index?: string; series?: string; truncated?: string };\n\n /* Message shown when `series` is empty. The `empty` slot overrides it. /\n @Prop({ attribute: 'label-empty' }) labelEmpty: string = 'No data to display';\n\n /* Show the loading overlay instead of the plot. /\n @Prop() loading: boolean = false;\n\n /* Text (and the spinner's accessible name) for the loading overlay. /\n @Prop({ attribute: 'loading-label' }) loadingLabel: string = 'Loading chart…';\n\n /* Accessible name for the zoom slider's start thumb. /\n @Prop({ attribute: 'label-zoom-start' }) labelZoomStart: string = 'Zoom range start';\n /* Accessible name for the zoom slider's end thumb. /\n @Prop({ attribute: 'label-zoom-end' }) labelZoomEnd: string = 'Zoom range end';\n\n /* Draw small perpendicular tick marks on the axes. /\n @Prop({ attribute: 'axis-ticks' }) axisTicks: boolean = false;\n /* Print each point's value as a data label beside its marker. /\n @Prop({ attribute: 'show-labels' }) showLabels: boolean = false;\n\n @Event() mdMarkerClick!: EventEmitter<MdChartClickDetail<MdChartSeries>>;\n\n /* Fires when a series' drawn line is clicked between its data points (a\n * click on a point emits `mdMarkerClick` instead). /\n @Event() mdLineClick!: EventEmitter<MdChartClickDetail<MdChartSeries>>;\n\n /* Fires when a series' filled area is clicked — the band between its line\n * and its base (its own band when stacked), excluding its line and points. /\n @Event() mdAreaClick!: EventEmitter<MdChartClickDetail<MdChartSeries>>;\n\n /* Fires when the plot background is clicked (inside the plot, but not on a\n * mark, line or area): the nearest x plus every visible series' value there. /\n @Event() mdAxisClick!: EventEmitter<MdChartAxisClickDetail>;\n\n @Event() mdLegendClick!: EventEmitter<{ seriesIndex: number; seriesId?: string; selected: boolean }>;\n @Event() mdHover!: EventEmitter<MdChartHoverDetail>;\n @Event() mdReady!: EventEmitter<void>;\n\n /* Fires when the zoom window changes (drag, slider or `setZoom`/`resetZoom`). /\n @Event() mdZoom!: EventEmitter<{ startIndex: number; endIndex: number; reset: boolean }>;\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 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 index window, or null for the full range. /\n @State() private zoomWin: { start: number; end: number } \| null = null;\n\n /* Live drag rectangle (plot-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\n private engine: LineChartEngine \| null = null;\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\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')\n @Watch('curve') @Watch('stack') @Watch('legend')\n @Watch('tooltip') @Watch('zoom') @Watch('connectNulls')\n @Watch('showMarks') @Watch('lineWidth') @Watch('markSize') @Watch('label') @Watch('subtitle') @Watch('titleAlign') @Watch('fillOpacity') @Watch('showLine') @Watch('grid') @Watch('axisTicks') @Watch('showLabels') @Watch('inverted') @Watch('loading')\n @Watch('animation') @Watch('animationDuration') @Watch('tooltipRenderer') @Watch('valueFormatter')\n onAnyPropChange() {\n this.applyEngine();\n this.rebuildA11yTable();\n }\n\n @Method()\n async resize(): Promise<void> {\n this.engine?.resize();\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 @Method()\n async toDataURL(): Promise<string> {\n return this.engine?.toDataURL('image/png') ?? '';\n }\n\n @Method()\n async getInstance(): Promise<LineChartEngine \| null> {\n return this.engine;\n }\n\n private bindChartHost = (el?: HTMLDivElement) => {\n this.chartHost = el;\n };\n\n private bindA11yTableHost = (el?: HTMLDivElement) => {\n this.a11yTableHost = el;\n };\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 LineChartEngine(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 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\n private get zoomInside(): boolean {\n return this.zoom === 'inside' \|\| this.zoom === 'both';\n }\n\n private get zoomSliderOn(): boolean {\n return this.zoom === 'slider' \|\| this.zoom === 'both';\n }\n\n /* Number of datapoints along x — the longest series, or the axis if longer. /\n private dataLength(): number {\n const longest = this.series.reduce(\n (acc, s) => Math.max(acc, s.range?.length ?? s.data?.length ?? 0),\n 0,\n );\n return Math.max(longest, this.xAxis?.data?.length ?? 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 points visible, else there is no band to draw.\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 this.applyEngine();\n this.rebuildA11yTable();\n this.mdZoom.emit({ startIndex: reset ? 0 : s, endIndex: reset ? last : e, reset });\n }\n\n /* Zoom to an absolute index 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 `plotX`/`plotY`; only the drag band, positioned against the\n * host, converts back out. Reading these as host coordinates drew the band\n * ~16px above the x-axis and shifted the selected range by the same amount.\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 /\n Drag-band geometry, converted from canvas space back out to host space\n * (the band is `position: absolute` inside a `position: relative` :host).\n \n Physical `left`/`top`, not logical insets: both values are offsets from the\n * host's LEFT edge, which `inset-inline-start` would mirror to the right in\n * RTL. Same idiom as md-line-chart / md-bar-chart.\n /\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 /* 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 /* Map a canvas-relative x to the nearest ABSOLUTE data index. /\n private indexAtX(hostX: number): number {\n const scene = this.engine?.getScene();\n const w = this.win();\n if (!scene?.xPositions?.length) return w.start;\n let best = 0;\n let bestD = Infinity;\n scene.xPositions.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 /* 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 /* Is the event over the plot itself (as opposed to the header, 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, NOT `e.target`: this\n // listener is on the host, so a shadow-internal target is retargeted to the\n // host, and capturing there would send the whole gesture — including the\n // closing click — to the host, where the plot canvas never sees it.\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 marker\n // clicks and tooltips keep working.\n if (Math.abs(band.x2 - band.x1) < 8) return;\n // In RTL the plot is mirrored, so the LEFT edge of the band is the LATER\n // index — order by index, not by pixel, or the 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-area-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 f = (clientX - track.left) / track.width;\n return track.rtl ? 1 - f : f;\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-area-chart__zoom\" part=\"zoom\">\n <md-slider\n class=\"md-area-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-area-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>): LineChartSpec {\n const percentage = this.stack === 'percentage';\n const yFmt = (v: number) => (this.valueFormatter ? this.valueFormatter(v) : v.toLocaleString(this.locale \|\| undefined));\n // Zoom is a view: slice what the engine draws, leave `this.series` alone.\n // Index-addressed options (pointSymbols) are rebased into window\n // coordinates, and anything outside the window is dropped.\n const zw = this.zoomWin ? this.win() : null;\n const cut = <T,>(arr: T[] \| undefined): T[] \| undefined =>\n arr && zw ? arr.slice(zw.start, zw.end + 1) : arr;\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 const keys = this.seriesKeys();\n return {\n series: this.series.map((s, i) => ({\n label: s.label ?? `Series ${i + 1}`,\n color: resolveSeriesColor(this.el, s.color, pickPaletteColor(t.palette, i)),\n // A range series draws from its band; `data` only keeps the row count\n // aligned so the shared x axis and hover index still line up.\n data: cut(s.range ? s.range.map(() => null) : s.data) ?? [],\n range: cut(s.range?.map(normalizeRange)),\n fill: s.fill,\n // A streamgraph rides a free baseline, so a layer's top edge is not a\n // value anyone can read — stroking it just adds noise. Explicit\n // per-series `stroke` still wins.\n stroke: s.stroke ?? (!this.showLine \|\| this.stack === 'wiggle' \|\| this.stack === 'silhouette' ? false : undefined),\n curve: s.curve ?? this.curve,\n connectNulls: s.connectNulls ?? this.connectNulls,\n showMarks: s.showMarks ?? this.showMarks,\n hidden: s.hidden ?? this.legendHidden.get(keys[i]) ?? false,\n dash: s.dash,\n symbol: s.symbol,\n pointSymbols: rebaseMap(s.pointSymbols),\n lineWidth: s.lineWidth ?? this.lineWidth,\n markSize: s.markSize ?? this.markSize,\n })),\n title: this.label \|\| undefined,\n subtitle: this.subtitle \|\| undefined,\n titleAlign: this.titleAlign,\n animation: this.noAnimation ? 'none' : this.animation,\n animationDuration: this.animationDuration,\n xValues: cut(this.xAxis?.data) ?? [],\n xScale: this.xAxis?.scale ?? 'category',\n xFormatter: this.xAxis?.valueFormatter ?? ((v: MdChartAxisValue) => defaultValueFormatter(v, this.locale)),\n xLabel: this.xAxis?.label,\n xHidden: this.xAxis?.hidden,\n xHideTicks: this.xAxis?.hideTicks,\n xDash: this.xAxis?.dash,\n xGridDash: this.xAxis?.gridDash,\n xBands: resolveAxisBands(this.el, this.xAxis?.bands),\n yBands: resolveAxisBands(this.el, this.yAxis?.bands),\n xBreaks: this.xAxis?.breaks,\n yBreaks: this.yAxis?.breaks,\n yScale: this.yAxis?.scale ?? 'value',\n yMin: percentage ? 0 : this.yAxis?.min,\n yMax: percentage ? 100 : this.yAxis?.max,\n yFormatter: percentage ? (v: number) => `${Math.round(v)}%` : yFmt,\n // The axis can format independently of the values (bare numbers on the\n // axis, units in the tooltip); unset → the axis follows `valueFormatter`.\n yTickFormatter:\n !percentage && this.yAxis?.valueFormatter ? (v: number) => this.yAxis!.valueFormatter!(v) : undefined,\n yLabel: this.yAxis?.label,\n yHidden: this.yAxis?.hidden,\n yHideTicks: this.yAxis?.hideTicks,\n yDash: this.yAxis?.dash,\n yGridDash: this.yAxis?.gridDash,\n stack: this.stack,\n inverted: this.inverted,\n area: true,\n fillOpacity: this.fillOpacity,\n legend: this.legend,\n gridY: this.grid === 'horizontal' \|\| this.grid === 'both',\n gridX: this.grid === 'vertical' \|\| this.grid === 'both',\n axisTicks: this.axisTicks,\n showLabels: this.showLabels,\n seriesLabels: this.seriesLabels,\n };\n }\n\n private applyEngine() {\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 indexes the WINDOW; consumers index the data they gave us.\n const abs = idx + (this.zoomWin ? this.win().start : 0);\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 d = this.clickDetail(si, di, e);\n if (d) this.mdMarkerClick.emit(d);\n },\n onLineClick: (si, di, e) => {\n const d = this.clickDetail(si, di, e);\n if (d) this.mdLineClick.emit(d);\n },\n onAreaClick: (si, di, e) => {\n const d = this.clickDetail(si, di, e);\n if (d) this.mdAreaClick.emit(d);\n },\n onAxisClick: (di, values, e) => {\n const abs = di + (this.zoomWin ? this.win().start : 0);\n this.mdAxisClick.emit({\n dataIndex: abs,\n axisValue: this.xAxis?.data?.[abs],\n seriesValues: values.map((v) => ({\n seriesIndex: v.seriesIndex,\n seriesId: this.series[v.seriesIndex]?.id,\n label: v.label,\n dataIndex: v.value == null ? -1 : abs,\n value: v.value,\n })),\n nativeEvent: e,\n });\n },\n });\n this.engine.setHoverEnabled(this.tooltip !== 'none');\n this.engine.setTooltip({\n render: this.tooltipRenderer,\n missingFormatter: this.valueFormatter,\n // `item` reports only the band under the cursor; `axis` lists them all.\n trigger: this.tooltip === 'item' ? 'item' : 'axis',\n });\n }\n\n /** The payload shared by the three per-series click events (marker / line /\n * area) — same shape, different gesture. /\n private clickDetail(si: number, di: number, e: PointerEvent): MdChartClickDetail<MdChartSeries> \| null {\n const s = this.series[si];\n if (!s) return null;\n const abs = di + (this.zoomWin ? this.win().start : 0);\n return {\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\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 labels: this.tableLabels,\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 default:\n return;\n }\n e.preventDefault();\n this.moveKeyboardCursor(next);\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 =\n this.summary \|\|\n buildChartSummary({\n title: this.label,\n chartType: 'area',\n seriesCount: this.series.length,\n locale: this.locale,\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 // would just be the wrong answer to \"where is my data?\".\n const empty = this.series.length === 0 && !this.loading;\n\n return (\n <Host\n class={{\n 'md-area-chart': true,\n 'md-area-chart--empty': empty,\n 'md-area-chart--mounted': this.mounted,\n 'md-area-chart--zoom-slider': this.zoomSliderOn,\n 'md-area-chart--zoom-drag': this.zoomInside,\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-area-chart__header\" part=\"header\"><slot name=\"header\"></slot></header>\n <div\n class=\"md-area-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-area-chart__empty\" part=\"empty\">\n <slot name=\"empty\">{this.labelEmpty}</slot>\n </div>\n )}\n\n {/ Loader — same opaque overlay as the empty state, so the phantom axis\n the engine draws for absent data can't show through. /}\n {this.loading && (\n <div class=\"md-area-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-area-chart__spinner\"\n variant=\"circular\"\n indeterminate\n label={this.loadingLabel}\n ></md-progress-indicator>\n <span class=\"md-area-chart__loading-text\">{this.loadingLabel}</span>\n </slot>\n </slot>\n </div>\n )}\n {/ Live drag selection over the plot, while a zoom range is dragged. /}\n {this.dragBand && this.plotRect() && (\n <div\n class=\"md-area-chart__zoom-band\"\n part=\"zoom-band\"\n style={this.zoomBandStyle()}\n ></div>\n )}\n {this.zoomSliderOn && this.renderZoomSlider()}\n <footer class=\"md-area-chart__footer\" part=\"footer\"><slot name=\"footer\"></slot></footer>\n <div class=\"md-area-chart__a11y-table\" ref={el => this.bindA11yTableHost(el as HTMLDivElement)}></div>\n\n {/ Narrates the keyboard cursor, politely. */}\n <div class=\"md-area-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/md-autocomplete.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{p as t,H as i,c as s,f as e,h as o,d as a,t as n}from"./p-MWBNn6Lj.js";import{s as h,g as r,c as l,r as c}from"./p-DWxN44zD.js";import{V as d,i as p,c as m}from"./p-BEWIC0pC.js";import{d as u}from"./p-uTEkf0sE.js";import{d as f}from"./p-6wZSqm_2.js";import{d as g}from"./p-BwXpiUsu.js";import{d as y}from"./p-B0Opn6dK.js";import{d as b}from"./p-7fN_yCXW.js";import{d as v}from"./p-e2HRV63Y.js";import{d as _}from"./p-stybaFzj.js";import{d as x}from"./p-B3MWYEEJ.js";const w=()=>`:host{--md-text-field-padding-inline-end:var(--md-sys-spacing-inset-lg, 16px);--_min-width:var(--md-autocomplete-min-width, 220px);--_chip-gap:var(--md-autocomplete-chip-gap, var(--md-sys-spacing-gap-xs, 4px));--_chip-radius:var(--md-autocomplete-chip-radius, 8px);--_caret-color:var(--md-autocomplete-caret-color, var(--md-sys-color-on-surface-variant));--_clear-color:var(--md-autocomplete-clear-color, var(--md-sys-color-on-surface-variant));--_option-icon-size:var(--md-autocomplete-option-icon-size, 20px);--_loading-color:var(--md-autocomplete-loading-color, var(--md-sys-color-on-surface-variant));display:inline-flex;flex-direction:column;inline-size:var(--md-autocomplete-width, 100%);min-inline-size:var(--_min-width);box-sizing:border-box;vertical-align:bottom;position:relative}:host(.md-autocomplete--chips-top) .md-autocomplete__chips{margin-block-start:0;margin-block-end:var(--md-sys-spacing-inset-sm, 8px)}:host(.md-autocomplete--chips-left),:host(.md-autocomplete--chips-right){flex-direction:row;align-items:center;gap:var(--md-sys-spacing-gap-sm, 8px)}:host(.md-autocomplete--chips-left) .md-autocomplete__field,:host(.md-autocomplete--chips-right) .md-autocomplete__field{flex:1 1 auto;inline-size:auto;min-inline-size:0}:host(.md-autocomplete--chips-left) .md-autocomplete__chips,:host(.md-autocomplete--chips-right) .md-autocomplete__chips{contain:none;flex:0 1 auto;max-inline-size:50%;margin-block-start:0}.md-autocomplete__field{display:block;inline-size:100%}.md-autocomplete__chips{display:flex;flex-wrap:wrap;align-items:center;gap:var(--_chip-gap);max-inline-size:100%;margin-block-start:var(--md-sys-spacing-inset-sm, 8px);contain:inline-size}.md-autocomplete__chips md-chip{--md-chip-container-shape:var(--_chip-radius)}.md-autocomplete__inline-chips{display:flex;flex-wrap:wrap;align-items:center;gap:var(--_chip-gap);min-inline-size:0;overflow:visible}.md-autocomplete__inline-chips md-chip{--md-chip-container-shape:var(--_chip-radius);flex-shrink:0}.md-autocomplete__caret{color:var(--_caret-color);font-size:var(--md-autocomplete-caret-size, 24px);line-height:1;display:inline-flex;align-items:center;justify-content:center;inline-size:24px;block-size:24px;cursor:pointer;transition:transform var(--md-sys-motion-duration-short4, 200ms)     var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1))}:host(.md-autocomplete--open) .md-autocomplete__caret{transform:rotate(180deg)}.md-autocomplete__clear{--md-icon-button-container-width:28px;--md-icon-button-container-height:28px;--md-icon-button-icon-size:18px;color:var(--_clear-color);margin-inline-end:2px}.md-autocomplete__clear--hidden{visibility:hidden;pointer-events:none}.md-autocomplete__loader{display:inline-flex;align-items:center;justify-content:center;inline-size:24px;block-size:24px;--md-loading-indicator-size:var(--md-autocomplete-spinner-size, 22px);--md-loading-indicator-shape-size:var(--md-autocomplete-spinner-size, 22px)}md-menu::part(empty-text){display:flex;justify-content:center;padding:var(--md-sys-spacing-inset-md, 12px) var(--md-sys-spacing-inset-lg, 16px);color:var(--md-sys-color-on-surface-variant);text-align:center}.md-autocomplete__option-icon{display:inline-flex;align-items:center;justify-content:center;color:var(--md-autocomplete-option-icon-color, var(--md-sys-color-on-surface-variant, #49454f));font-size:var(--_option-icon-size);inline-size:var(--_option-icon-size);block-size:var(--_option-icon-size)}.md-autocomplete__listbox{display:block}.md-autocomplete__vspacer{inline-size:100%;pointer-events:none}.md-autocomplete__loading{display:block;padding:var(--md-sys-spacing-inset-md, 12px) var(--md-sys-spacing-inset-lg, 16px);color:var(--_loading-color)}.md-autocomplete__sr-status{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}:host(.md-autocomplete--disabled),:host(.md-autocomplete--soft-disabled){pointer-events:none}:host(.md-autocomplete--soft-disabled) .md-autocomplete__field{pointer-events:auto}@media (prefers-reduced-motion: reduce){.md-autocomplete__caret,.md-autocomplete__clear{transition:none}}@media (forced-colors: active){.md-autocomplete__caret,.md-autocomplete__clear{color:CanvasText}}.material-symbols-outlined{font-family:var(--md-sys-icon-font-family, 'Material Symbols Outlined', 'Material Icons');font-weight:normal;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;overflow-wrap:normal;direction:ltr;font-feature-settings:'liga';-webkit-font-smoothing:antialiased}: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}`;let k=0;const z=200;const M=200;const C=t(class t extends i{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.mdChange=s(this,"mdChange",7);this.mdInput=s(this,"mdInput",7);this.mdOpen=s(this,"mdOpen",7);this.mdClose=s(this,"mdClose",7);this.mdClear=s(this,"mdClear",7);this.mdValidityChange=s(this,"mdValidityChange",5);this.internals=this.attachInternals();this.valueMissingLabel="Please make a selection";this.reserveSupportingSpace=false;this.customValidityMessage="";this.variant="filled";this.label="";this.placeholder="";this.supportingText="";this.error=false;this.errorText="";this.disabled=false;this.softDisabled=false;this.required=false;this.density=0;this.options=[];this.multiple=false;this.chipPosition="below";this.value="";this.inputValue="";this.freeSolo=false;this.maxSelected=0;this.loading=false;this.noOptionsText="No options";this.noResultsText="No results";this.loadingText="Loading…";this.statusTemplate="{count} suggestions available";this.disableCloseOnSelect=false;this.clearOnBlur=false;this.clearable=true;this.clearIcon="close";this.dropdownIcon="arrow_drop_down";this.limitResults=0;this.open=false;this.virtualize="auto";this.filterMode="substring";this.placement="bottom-start";this.matchTriggerWidth=true;this.name="";this.triggerId=`md-autocomplete-${++k}`;this.focused=false;this.optionsData=[];this.labelMap=new Map;this.packing=false;this.typedSinceOpen=false;this.loadGen=0;this.pendingListFocus=null;this.providerSet=false;this.vc=new d({queryItem:t=>this.el.shadowRoot?.querySelector(`md-menu-item[data-vindex="${t}"]`)??null,requestRender:()=>e(this)});this.isSelected=t=>this.selectedArray.includes(t);this.defaultValue="";this.defaultInputValue="";this.lastValidityKey=null;this._syncGuard=false;this._lastEmit=null;this.vpWired=false;this.handleMenuOpen=()=>{this._syncGuard=true;this.open=true;this._syncGuard=false;if(this._lastEmit!=="open"){this._lastEmit="open";this.mdOpen.emit()}if(this.vc.active){this.vc.setQuery(this.query);this.attachMenuViewport()}};this.handleMenuClose=()=>{this._syncGuard=true;this.open=false;this._syncGuard=false;if(this._lastEmit!=="close"){this._lastEmit="close";this.mdClose.emit()}this.typedSinceOpen=false;this.vc.detachViewport();this.vpWired=false;if(!this.multiple&&!this.freeSolo){const t=typeof this.value==="string"&&this.value?this.labelMap.get(this.value)??this.value:"";if(this.inputValue!==t){this.inputValue=t;this.mdInput.emit(t)}}};this.removeChip=t=>i=>{i.stopPropagation();if("preventDefault"in i)i.preventDefault();if(this.disabled||this.softDisabled||!this.multiple)return;this.commitValue(this.selectedArray.filter((i=>i!==t)))};this.handleClear=()=>{if(this.disabled||this.softDisabled)return;this.inputValue="";this.mdInput.emit("");this.typedSinceOpen=false;if(this.vc.active)this.vc.setQuery("");this.commitValue(this.multiple?[]:"");this.mdClear.emit();this.fieldEl?.focus?.()};this.handleFieldInput=t=>{this.applyTyped(t.detail??"")};this.handleListboxKeyDown=t=>{if(t.ctrlKey||t.metaKey||t.altKey)return;const i=t.key.length===1;if(!i&&t.key!=="Backspace")return;t.preventDefault();t.stopPropagation();this.fieldEl?.focus?.();this.applyTyped(t.key==="Backspace"?this.inputValue.slice(0,-1):this.inputValue+t.key)};this.handleFieldKeyDown=t=>{if(this.disabled||this.softDisabled)return;switch(t.key){case"ArrowDown":t.preventDefault();if(!this.open){this.pendingListFocus="first";this.open=true}else{this.firstOptionItem()?.focus()}break;case"ArrowUp":t.preventDefault();if(!this.open){this.pendingListFocus="last";this.open=true}else{const t=this.el.shadowRoot?.querySelectorAll(".md-autocomplete__listbox md-menu-item:not([disabled])");t?.[t.length-1]?.focus()}break;case"Enter":if(this.freeSolo&&this.commitFreeSolo()){t.preventDefault();if(!this.multiple)this.open=false}break;case"Escape":if(this.open){t.preventDefault();this.open=false}break;case"Backspace":if(this.multiple&&!this.inputValue&&this.selectedArray.length>0){this.commitValue(this.selectedArray.slice(0,-1))}break}};this.handleFieldFocus=()=>{this.focused=true};this.handleFieldBlur=()=>{this.focused=false;if(this.open)return;if(this.clearOnBlur&&!this.multiple&&!this.freeSolo){const t=typeof this.value==="string"?this.labelMap.get(this.value):"";if(this.inputValue&&this.inputValue!==t){this.inputValue=t??"";this.mdInput.emit(this.inputValue)}}};this.renderChipItem=t=>o("md-chip",{key:t,part:"chip",exportparts:"remove:chip-remove,label:chip-label",variant:"input",selectable:false,label:this.labelMap.get(t)??t,disabled:this.disabled||this.softDisabled,removable:!this.disabled&&!this.softDisabled,onMdRemove:this.removeChip(t),onClick:t=>t.stopPropagation()})}async focusInput(){this.fieldEl?.focus?.()}async showMenu(){if(this.disabled)return;this.open=true}async closeMenu(){this.open=false}async loadOptions(t){const i=++this.loadGen;if(this.virtualize==="never"||!p()){const i=Array.isArray(t)?t:Array.from({length:t.count},((i,s)=>t.getRow(s)));this.vc.reset();this.optionsData=this.normalize(i);this.refreshLabelMap();return}this.optionsData=[];this.packing=true;try{this.vc.setFixedRowHeight(this.rowHeight);this.vc.setFilterMode(this.filterMode);await this.vc.load(Array.isArray(t)?this.normalize(t):t)}finally{if(i===this.loadGen)this.packing=false}if(i!==this.loadGen)return;if(this.open&&this.typedSinceOpen)this.vc.setQuery(this.query);this.refreshLabelMap();e(this)}async getLabels(t){if(this.vc.active)return Object.fromEntries(this.vc.getLabels(t));const i={};for(const s of t)i[s]=this.labelMap.get(s)??s;return i}normalize(t){return t.map((t=>({value:t.value,label:t.label??t.value,disabled:!!t.disabled,icon:t.icon,iconColor:t.iconColor,supportingText:t.supportingText??t.description,selected:!!t.selected})))}get optionList(){const t=this.options;if(Array.isArray(t))return t;if(typeof t==="string"&&t.trim()){try{const i=JSON.parse(t);return Array.isArray(i)?i:[]}catch{if(typeof console!=="undefined"){console.warn("[md-autocomplete] `options` attribute is not valid JSON:",t)}return[]}}return[]}refreshOptions(){const t=m(this.el,[]);const i=t.length>0?t:this.normalize(this.optionList);const s=this.virtualize==="always"||this.virtualize==="auto"&&i.length>z;const o=++this.loadGen;if(s&&p()&&i.length>0){this.optionsData=[];this.packing=true;this.vc.setFixedRowHeight(this.rowHeight);this.vc.setFilterMode(this.filterMode);void this.vc.load(i).then((t=>{if(o!==this.loadGen)return;if(!t){this.optionsData=i}this.packing=false;if(t&&this.open&&this.typedSinceOpen)this.vc.setQuery(this.query);this.refreshLabelMap();e(this)}))}else{this.vc.reset();this.optionsData=i;this.refreshLabelMap()}}onOptionChange(t){t.stopPropagation();this.refreshOptions()}get busy(){return this.loading||this.packing}get selectedArray(){if(this.multiple)return Array.isArray(this.value)?this.value:[];if(typeof this.value==="string"&&this.value)return[this.value];return[]}get query(){return this.typedSinceOpen?this.inputValue.trim():""}get filteredOptions(){const t=this.selectedArray;const i={inputValue:this.query,selected:t};let s=this.filterer?this.filterer(this.optionsData,i):this.defaultFilter(this.optionsData,i);if(this.limitResults>0)s=s.slice(0,this.limitResults);return s}defaultFilter(t,i){const s=i.inputValue.toLowerCase();if(!s)return t;return t.filter((t=>t.label.toLowerCase().includes(s)||t.value.toLowerCase().includes(s)||(t.supportingText?.toLowerCase().includes(s)??false)))}refreshLabelMap(){const t=this.selectedArray;if(t.length===0){if(this.labelMap.size)this.labelMap=new Map;return}const i=new Map;if(this.vc.active){const s=this.vc.getLabels(t);for(const e of t){i.set(e,s.get(e)??this.labelMap.get(e)??e)}}else{for(const s of t){const t=this.optionsData.find((t=>t.value===s));i.set(s,t?.label??this.labelMap.get(s)??s)}}this.labelMap=i}componentWillLoad(){this.refreshOptions();this.defaultValue=Array.isArray(this.value)?[...this.value]:this.value;this.defaultInputValue=this.inputValue;this.syncFormValue()}componentDidLoad(){if(this.open&&!this.disabled){void this.menuEl?.show?.({autoFocus:false});this.mdOpen.emit()}}disconnectedCallback(){clearTimeout(this.searchDebounce);this.vc.detachViewport()}formResetCallback(){this.value=Array.isArray(this.defaultValue)?[...this.defaultValue]:this.defaultValue;this.inputValue=this.defaultInputValue;this.typedSinceOpen=false;clearTimeout(this.searchDebounce);if(this.vc.active)this.vc.setQuery("")}syncFormValue(){this.updateValidity();this.refreshLabelMap();if(!this.multiple&&!this.open){const t=typeof this.value==="string"&&this.value?this.labelMap.get(this.value)??this.value:"";if(this.inputValue!==t)this.inputValue=t}if(this.multiple){const t=this.selectedArray;if(!t.length){h(this.internals,null);return}const i=new FormData;for(const s of t)i.append(this.name||"",s);h(this.internals,i);return}const t=typeof this.value==="string"?this.value:"";h(this.internals,t||null)}onMultipleFlip(){if(this.multiple){if(typeof this.value==="string")this.value=this.value?[this.value]:[];else this.syncFormValue()}else{if(Array.isArray(this.value))this.value=this.value[0]??"";else this.syncFormValue()}}updateValidity(){if(!this.internals?.setValidity)return;if(this.customValidityMessage){this.internals.setValidity({customError:true},this.customValidityMessage,this.fieldEl??this.el)}else if(this.required&&this.selectedArray.length===0){this.internals.setValidity({valueMissing:true},this.errorText||this.valueMissingLabel,this.fieldEl??this.el)}else{this.internals.setValidity({})}this.emitValidityChange()}async getValidity(){return r(this.internals)}emitValidityChange(){const t=r(this.internals);const i=`${t.valid}|${t.validationMessage}`;if(this.lastValidityKey===i)return;const s=this.lastValidityKey!==null;this.lastValidityKey=i;if(s)this.mdValidityChange.emit(t)}async checkValidity(){return l(this.internals)}async reportValidity(){return c(this.internals)}async setCustomValidity(t){this.customValidityMessage=t;this.updateValidity()}syncMenu(t){if(this._syncGuard||!this.menuEl)return;if(t){this.menuEl.show?.({autoFocus:false})}else{this.menuEl.close?.()}}attachMenuViewport(){void(async()=>{const t=await(this.menuEl?.getScrollViewport?.())??null;if(!t||this.vpWired)return;this.vpWired=true;await this.vc.attachViewport((async()=>t))})()}componentDidRender(){void this.syncComboboxRefs();if(!this.menuEl)return;if(this.vc.active&&!this.providerSet){void this.menuEl.setVirtualProvider?.(this.vc.provider);this.providerSet=true}else if(!this.vc.active&&this.providerSet){void this.menuEl.setVirtualProvider?.(null);this.providerSet=false}if(this.open&&this.vc.active&&!this.vpWired)this.attachMenuViewport();if(this.pendingListFocus&&this.open){const t=this.el.shadowRoot?.querySelectorAll(".md-autocomplete__listbox md-menu-item:not([disabled])");const i=this.pendingListFocus==="first"?t?.[0]:t?.[t.length-1];if(i){this.pendingListFocus=null;i.focus()}}else if(this.pendingListFocus&&!this.open){this.pendingListFocus=null}}async syncComboboxRefs(){const t=this.fieldEl;const i=await(t?.getInputElement?.());if(!i||!("ariaControlsElements"in i))return;const s=this.el.shadowRoot?.querySelector('[role="listbox"]');const e=this.open&&s?[s]:null;const o=i.ariaControlsElements;if(!e&&!o?.length)return;if(e&&o?.length===1&&o[0]===e[0])return;i.ariaControlsElements=e}commitValue(t){this.value=t;this.mdChange.emit(t)}pick(t,i,s,e){e?.stopPropagation();if(s)return;if(this.multiple){const s=this.selectedArray;const o=s.includes(t);const a=!o&&this.maxSelected>0&&s.length>=this.maxSelected;if(a){const t=e?.target;if(t)t.selected=false;return}this.labelMap=new Map(this.labelMap).set(t,i);const n=o?s.filter((i=>i!==t)):[...s,t];this.commitValue(n);this.inputValue="";this.mdInput.emit("");this.typedSinceOpen=false;if(this.vc.active)this.vc.setQuery("");this.fieldEl?.focus?.()}else{this.labelMap=new Map(this.labelMap).set(t,i);this.commitValue(t);this.inputValue=i;this.mdInput.emit(i);this.typedSinceOpen=false;if(this.vc.active)this.vc.setQuery("");if(!this.disableCloseOnSelect)this.open=false;this.fieldEl?.focus?.()}}commitFreeSolo(){if(!this.freeSolo)return false;const t=this.inputValue.trim();if(!t)return false;if(this.multiple){const i=this.selectedArray;if(i.includes(t))return true;if(this.maxSelected>0&&i.length>=this.maxSelected)return false;this.labelMap=new Map(this.labelMap).set(t,t);this.commitValue([...i,t]);this.inputValue="";this.mdInput.emit("")}else{this.commitValue(t)}return true}applyTyped(t){this.inputValue=t;this.typedSinceOpen=true;this.mdInput.emit(t);if(!this.open)this.open=true;if(this.vc.active){clearTimeout(this.searchDebounce);this.searchDebounce=setTimeout((()=>{this.vc.setQuery(this.query)}),M)}}firstOptionItem(){return this.el.shadowRoot?.querySelector(".md-autocomplete__listbox md-menu-item:not([disabled])")??null}get inlineChips(){return this.multiple&&this.chipPosition==="inline"}renderChips(){if(!this.multiple||this.inlineChips)return null;const t=this.selectedArray;if(t.length===0)return null;return o("div",{class:"md-autocomplete__chips",part:"chips",role:"group","aria-label":this.label?`${this.label} — selected`:"Selected"},t.map(this.renderChipItem))}renderInlineChips(){if(!this.inlineChips)return null;const t=this.selectedArray;if(t.length===0)return null;return o("div",{slot:"chips",class:"md-autocomplete__inline-chips",part:"chips",role:"group","aria-label":this.label?`${this.label} — selected`:"Selected"},t.map(this.renderChipItem))}renderClearButton(t=false){if(!this.clearable)return null;const i=this.multiple?this.selectedArray.length>0:!!this.inputValue||!!this.value;const s=t||!i;return o("md-icon-button",{class:{"md-autocomplete__clear":true,"md-autocomplete__clear--hidden":s},slot:"trailing-icon",part:"clear",variant:"standard",size:"xs",icon:this.clearIcon,"aria-label":"Clear value","aria-hidden":s?"true":undefined,onClick:t=>{t.stopPropagation();this.handleClear()}})}renderTrigger(){return o("md-text-field",{ref:t=>this.fieldEl=t,id:this.triggerId,class:"md-autocomplete__field",part:"field",variant:this.variant,label:this.label,placeholder:this.placeholder,value:this.inputValue,disabled:this.disabled,error:this.error,errorText:this.errorText,reserveSupportingSpace:this.reserveSupportingSpace,supportingText:this.supportingText,required:this.required,density:this.density,appearFocused:this.open||this.focused,"aria-haspopup":"listbox",inputRole:"combobox",inputExpanded:this.open,inputAriaAutocomplete:"list",chipsWrap:this.inlineChips,onMdInput:this.handleFieldInput,onClick:()=>{if(!this.disabled&&!this.softDisabled&&!this.open)this.open=true},onKeyDown:this.handleFieldKeyDown,onFocus:this.handleFieldFocus,onBlur:this.handleFieldBlur},this.renderInlineChips(),this.busy?[this.renderClearButton(true),o("span",{slot:"trailing-icon",class:"md-autocomplete__loader",part:"loading-spinner"},o("slot",{name:"loader"},o("md-loading-indicator",{label:this.loadingText})))]:[this.renderClearButton(),o("span",{slot:"trailing-icon",class:"md-autocomplete__caret material-symbols-outlined",part:"caret","aria-hidden":"true",onClick:t=>{t.stopPropagation();if(!this.disabled&&!this.softDisabled)this.open=!this.open}},o("slot",{name:"dropdown-icon"},this.dropdownIcon))])}renderOptionIcon(t,i){if(!t)return null;return o("span",{slot:"leading-icon",part:"option-icon",class:"material-symbols-outlined md-autocomplete__option-icon",style:i?{color:i}:undefined,"aria-hidden":"true"},t)}renderVirtualOptions(){return o("div",{class:"md-autocomplete__listbox",role:"listbox",id:`${this.triggerId}-listbox`,"aria-label":this.label||"Options","aria-multiselectable":this.multiple?"true":undefined,onKeyDown:this.handleListboxKeyDown},o("div",{class:"md-autocomplete__vspacer",style:{height:`${this.vc.topPad}px`},"aria-hidden":"true"}),this.vc.windowRows.map(((t,i)=>{const s=this.vc.windowStart+i;const e=this.isSelected(t.value);return o("md-menu-item",{key:t.index,id:`${this.triggerId}-opt-${s}`,"data-vindex":s,presentation:"option",type:this.multiple?"checkbox":"radio","check-position":"start","keep-open":true,part:e?"option option-selected":"option",disabled:t.disabled,selected:e,headline:t.label,"supporting-text":t.supportingText||"","aria-setsize":this.vc.filteredLength,"aria-posinset":s+1,onMdClick:i=>this.pick(t.value,t.label,t.disabled,i)},this.renderOptionIcon(t.icon||undefined))})),o("div",{class:"md-autocomplete__vspacer",style:{height:`${this.vc.bottomPad}px`},"aria-hidden":"true"}))}renderMenu(){const t=this.vc.active;const i=t?[]:this.filteredOptions;const s=t?false:this.optionsData.length===0;const e=this.busy?"":t?this.vc.filteredLength===0?this.noResultsText:"":s?this.noOptionsText:i.length===0?this.noResultsText:"";const a=t?this.maxHeight??320:this.maxHeight;return o("md-menu",{ref:t=>this.menuEl=t,anchor:this.triggerId,placement:this.placement,"match-anchor-width":this.matchTriggerWidth,"max-height":a,persistent:this.disableCloseOnSelect,"empty-text":e,"auto-focus":false,listbox:true,"list-label":this.label||"Options",part:"menu",onMdOpen:this.handleMenuOpen,onMdClose:this.handleMenuClose},this.busy?o("div",{class:"md-autocomplete__loading",part:"loading",role:"status","aria-label":this.loadingText},o("md-progress-indicator",{variant:"linear",indeterminate:true,wave:true,part:"loading-progress",label:this.loadingText})):t?this.renderVirtualOptions():o("div",{class:"md-autocomplete__listbox",role:"listbox",id:`${this.triggerId}-listbox`,"aria-label":this.label||"Options","aria-multiselectable":this.multiple?"true":undefined,onKeyDown:this.handleListboxKeyDown},i.map(((t,i)=>o("md-menu-item",{key:t.value,id:`${this.triggerId}-opt-${i}`,presentation:"option",type:this.multiple?"checkbox":"radio","check-position":"start","keep-open":true,part:this.isSelected(t.value)?"option option-selected":"option",disabled:t.disabled,selected:this.isSelected(t.value),headline:t.label,"supporting-text":t.supportingText||"",onMdClick:i=>this.pick(t.value,t.label,t.disabled,i)},this.renderOptionIcon(t.icon,t.iconColor))))))}render(){const t=this.multiple&&(this.chipPosition==="top"||this.chipPosition==="left");const i=this.vc.active?this.vc.filteredLength:this.filteredOptions.length;const s=this.busy?this.loadingText:this.open?this.statusTemplate.replace("{count}",String(i)):"";return o(a,{key:"265bb0cbd1dc6b00e618a0263c0cd825ad3a77fb",class:{"md-autocomplete":true,[`md-autocomplete--${this.variant}`]:true,"md-autocomplete--open":this.open,"md-autocomplete--disabled":this.disabled,"md-autocomplete--soft-disabled":this.softDisabled,"md-autocomplete--multiple":this.multiple,"md-autocomplete--loading":this.busy,[`md-autocomplete--chips-${this.chipPosition}`]:this.multiple},"aria-haspopup":"listbox","aria-busy":this.busy?"true":"false"},t&&this.renderChips(),this.renderTrigger(),!t&&this.renderChips(),this.renderMenu(),o("span",{key:"65354ca0d573e3411bc022eb008b59cf4fa335bf",class:"md-autocomplete__sr-status",role:"status","aria-live":"polite"},s))}static get formAssociated(){return true}get el(){return this}static get watchers(){return{options:[{refreshOptions:0}],value:[{syncFormValue:0}],multiple:[{onMultipleFlip:0}],required:[{updateValidity:0}],valueMissingLabel:[{updateValidity:0}],open:[{syncMenu:0}]}}static get style(){return w()}},[321,"md-autocomplete",{valueMissingLabel:[1,"value-missing-label"],reserveSupportingSpace:[4,"reserve-supporting-space"],variant:[513],label:[1],placeholder:[1],supportingText:[1,"supporting-text"],error:[516],errorText:[1,"error-text"],disabled:[516],softDisabled:[516,"soft-disabled"],required:[516],density:[514],options:[1],multiple:[516],chipPosition:[513,"chip-position"],value:[1025],inputValue:[1025,"input-value"],freeSolo:[516,"free-solo"],maxSelected:[2,"max-selected"],loading:[516],noOptionsText:[1,"no-options-text"],noResultsText:[1,"no-results-text"],loadingText:[1,"loading-text"],statusTemplate:[1,"status-template"],disableCloseOnSelect:[516,"disable-close-on-select"],clearOnBlur:[516,"clear-on-blur"],clearable:[516],clearIcon:[1,"clear-icon"],dropdownIcon:[1,"dropdown-icon"],limitResults:[2,"limit-results"],open:[1540],filterer:[16],virtualize:[1],filterMode:[1,"filter-mode"],rowHeight:[2,"row-height"],placement:[1],matchTriggerWidth:[4,"match-trigger-width"],maxHeight:[2,"max-height"],name:[513],triggerId:[32],focused:[32],optionsData:[32],labelMap:[32],packing:[32],focusInput:[64],showMenu:[64],closeMenu:[64],loadOptions:[64],getLabels:[64],getValidity:[64],checkValidity:[64],reportValidity:[64],setCustomValidity:[64]},[[0,"mdSelectOptionChange","onOptionChange"]],{options:[{refreshOptions:0}],value:[{syncFormValue:0}],multiple:[{onMultipleFlip:0}],required:[{updateValidity:0}],valueMissingLabel:[{updateValidity:0}],open:[{syncMenu:0}]}]);function O(){if(typeof customElements==="undefined"){return}const t=["md-autocomplete","md-chip","md-icon-button","md-loading-indicator","md-menu","md-menu-item","md-progress-indicator","md-ripple","md-text-field"];t.forEach((t=>{switch(t){case"md-autocomplete":if(!customElements.get(n(t))){customElements.define(n(t),C)}break;case"md-chip":if(!customElements.get(n(t))){u()}break;case"md-icon-button":if(!customElements.get(n(t))){f()}break;case"md-loading-indicator":if(!customElements.get(n(t))){g()}break;case"md-menu":if(!customElements.get(n(t))){y()}break;case"md-menu-item":if(!customElements.get(n(t))){b()}break;case"md-progress-indicator":if(!customElements.get(n(t))){v()}break;case"md-ripple":if(!customElements.get(n(t))){_()}break;case"md-text-field":if(!customElements.get(n(t))){x()}break}}))}O();const V=C;const E=O;export{V as MdAutocomplete,E as defineCustomElement};
+import{p as t,H as i,c as s,f as e,h as o,d as a,t as n}from"./p-BR6gfOQH.js";import{s as h,g as r,c as l,r as c}from"./p-DWxN44zD.js";import{V as d,i as p,c as m}from"./p-Bz-JaJcA.js";import{d as u}from"./p-B-JfuA2g.js";import{d as f}from"./p-DYL-8C5C.js";import{d as g}from"./p-B-iHDK5h.js";import{d as b}from"./p-CCMritCA.js";import{d as y}from"./p-D8oM1Kr3.js";import{d as v}from"./p-tSoecrcz.js";import{d as _}from"./p-CTC8XAB6.js";import{d as x}from"./p-CtVItLby.js";const w=()=>`:host{--md-text-field-padding-inline-end:var(--md-sys-spacing-inset-lg, 16px);--_min-width:var(--md-autocomplete-min-width, 220px);--_chip-gap:var(--md-autocomplete-chip-gap, var(--md-sys-spacing-gap-xs, 4px));--_chip-radius:var(--md-autocomplete-chip-radius, 8px);--_caret-color:var(--md-autocomplete-caret-color, var(--md-sys-color-on-surface-variant));--_clear-color:var(--md-autocomplete-clear-color, var(--md-sys-color-on-surface-variant));--_option-icon-size:var(--md-autocomplete-option-icon-size, 20px);--_loading-color:var(--md-autocomplete-loading-color, var(--md-sys-color-on-surface-variant));display:inline-flex;flex-direction:column;inline-size:var(--md-autocomplete-width, 100%);min-inline-size:var(--_min-width);box-sizing:border-box;vertical-align:bottom;position:relative}:host(.md-autocomplete--chips-top) .md-autocomplete__chips{margin-block-start:0;margin-block-end:var(--md-sys-spacing-inset-sm, 8px)}:host(.md-autocomplete--chips-left),:host(.md-autocomplete--chips-right){flex-direction:row;align-items:center;gap:var(--md-sys-spacing-gap-sm, 8px)}:host(.md-autocomplete--chips-left) .md-autocomplete__field,:host(.md-autocomplete--chips-right) .md-autocomplete__field{flex:1 1 auto;inline-size:auto;min-inline-size:0}:host(.md-autocomplete--chips-left) .md-autocomplete__chips,:host(.md-autocomplete--chips-right) .md-autocomplete__chips{contain:none;flex:0 1 auto;max-inline-size:50%;margin-block-start:0}.md-autocomplete__field{display:block;inline-size:100%}.md-autocomplete__chips{display:flex;flex-wrap:wrap;align-items:center;gap:var(--_chip-gap);max-inline-size:100%;margin-block-start:var(--md-sys-spacing-inset-sm, 8px);contain:inline-size}.md-autocomplete__chips md-chip{--md-chip-container-shape:var(--_chip-radius)}.md-autocomplete__inline-chips{display:flex;flex-wrap:wrap;align-items:center;gap:var(--_chip-gap);min-inline-size:0;overflow:visible}.md-autocomplete__inline-chips md-chip{--md-chip-container-shape:var(--_chip-radius);flex-shrink:0}.md-autocomplete__caret{color:var(--_caret-color);font-size:var(--md-autocomplete-caret-size, 24px);line-height:1;display:inline-flex;align-items:center;justify-content:center;inline-size:24px;block-size:24px;cursor:pointer;transition:transform var(--md-sys-motion-duration-short4, 200ms)     var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1))}:host(.md-autocomplete--open) .md-autocomplete__caret{transform:rotate(180deg)}.md-autocomplete__clear{--md-icon-button-container-width:28px;--md-icon-button-container-height:28px;--md-icon-button-icon-size:18px;color:var(--_clear-color);margin-inline-end:2px}.md-autocomplete__clear--hidden{visibility:hidden;pointer-events:none}.md-autocomplete__loader{display:inline-flex;align-items:center;justify-content:center;inline-size:24px;block-size:24px;--md-loading-indicator-size:var(--md-autocomplete-spinner-size, 22px);--md-loading-indicator-shape-size:var(--md-autocomplete-spinner-size, 22px)}md-menu::part(empty-text){display:flex;justify-content:center;padding:var(--md-sys-spacing-inset-md, 12px) var(--md-sys-spacing-inset-lg, 16px);color:var(--md-sys-color-on-surface-variant);text-align:center}.md-autocomplete__option-icon{display:inline-flex;align-items:center;justify-content:center;color:var(--md-autocomplete-option-icon-color, var(--md-sys-color-on-surface-variant, #49454f));font-size:var(--_option-icon-size);inline-size:var(--_option-icon-size);block-size:var(--_option-icon-size)}.md-autocomplete__listbox{display:block}.md-autocomplete__vspacer{inline-size:100%;pointer-events:none}.md-autocomplete__loading{display:block;padding:var(--md-sys-spacing-inset-md, 12px) var(--md-sys-spacing-inset-lg, 16px);color:var(--_loading-color)}.md-autocomplete__sr-status{position:absolute;inline-size:1px;block-size:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}:host(.md-autocomplete--disabled),:host(.md-autocomplete--soft-disabled){pointer-events:none}:host(.md-autocomplete--soft-disabled) .md-autocomplete__field{pointer-events:auto}@media (prefers-reduced-motion: reduce){.md-autocomplete__caret,.md-autocomplete__clear{transition:none}}@media (forced-colors: active){.md-autocomplete__caret,.md-autocomplete__clear{color:CanvasText}}.material-symbols-outlined{font-family:var(--md-sys-icon-font-family, 'Material Symbols Outlined', 'Material Icons');font-weight:normal;font-style:normal;line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;overflow-wrap:normal;direction:ltr;font-feature-settings:'liga';-webkit-font-smoothing:antialiased}: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}`;let k=0;const z=200;const C=200;const M=t(class t extends i{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.mdChange=s(this,"mdChange",7);this.mdInput=s(this,"mdInput",7);this.mdOpen=s(this,"mdOpen",7);this.mdClose=s(this,"mdClose",7);this.mdClear=s(this,"mdClear",7);this.mdValidityChange=s(this,"mdValidityChange",5);this.internals=this.attachInternals();this.valueMissingLabel="Please make a selection";this.reserveSupportingSpace=false;this.customValidityMessage="";this.variant="filled";this.label="";this.placeholder="";this.supportingText="";this.error=false;this.errorText="";this.disabled=false;this.softDisabled=false;this.required=false;this.density=0;this.options=[];this.multiple=false;this.chipPosition="below";this.value="";this.inputValue="";this.freeSolo=false;this.maxSelected=0;this.loading=false;this.noOptionsText="No options";this.noResultsText="No results";this.loadingText="Loading…";this.statusTemplate="{count} suggestions available";this.disableCloseOnSelect=false;this.clearOnBlur=false;this.clearable=true;this.clearIcon="close";this.dropdownIcon="arrow_drop_down";this.limitResults=0;this.open=false;this.virtualize="auto";this.filterMode="substring";this.placement="bottom-start";this.matchTriggerWidth=true;this.name="";this.triggerId=`md-autocomplete-${++k}`;this.focused=false;this.optionsData=[];this.labelMap=new Map;this.packing=false;this.typedSinceOpen=false;this.loadGen=0;this.pendingListFocus=null;this.providerSet=false;this.vc=new d({queryItem:t=>this.el.shadowRoot?.querySelector(`md-menu-item[data-vindex="${t}"]`)??null,requestRender:()=>e(this)});this.isSelected=t=>this.selectedArray.includes(t);this.defaultValue="";this.defaultInputValue="";this.lastValidityKey=null;this._syncGuard=false;this._lastEmit=null;this.vpWired=false;this.handleMenuOpen=()=>{this._syncGuard=true;this.open=true;this._syncGuard=false;if(this._lastEmit!=="open"){this._lastEmit="open";this.mdOpen.emit()}if(this.vc.active){this.vc.setQuery(this.query);this.attachMenuViewport()}};this.handleMenuClose=()=>{this._syncGuard=true;this.open=false;this._syncGuard=false;if(this._lastEmit!=="close"){this._lastEmit="close";this.mdClose.emit()}this.typedSinceOpen=false;this.vc.detachViewport();this.vpWired=false;if(!this.multiple&&!this.freeSolo){const t=typeof this.value==="string"&&this.value?this.labelMap.get(this.value)??this.value:"";if(this.inputValue!==t){this.inputValue=t;this.mdInput.emit(t)}}};this.removeChip=t=>i=>{i.stopPropagation();if("preventDefault"in i)i.preventDefault();if(this.disabled||this.softDisabled||!this.multiple)return;this.commitValue(this.selectedArray.filter((i=>i!==t)))};this.handleClear=()=>{if(this.disabled||this.softDisabled)return;this.inputValue="";this.mdInput.emit("");this.typedSinceOpen=false;if(this.vc.active)this.vc.setQuery("");this.commitValue(this.multiple?[]:"");this.mdClear.emit();this.fieldEl?.focus?.()};this.handleFieldInput=t=>{this.applyTyped(t.detail??"")};this.handleListboxKeyDown=t=>{if(t.ctrlKey||t.metaKey||t.altKey)return;const i=t.key.length===1;if(!i&&t.key!=="Backspace")return;t.preventDefault();t.stopPropagation();this.fieldEl?.focus?.();this.applyTyped(t.key==="Backspace"?this.inputValue.slice(0,-1):this.inputValue+t.key)};this.handleFieldKeyDown=t=>{if(this.disabled||this.softDisabled)return;switch(t.key){case"ArrowDown":t.preventDefault();if(!this.open){this.pendingListFocus="first";this.open=true}else{this.firstOptionItem()?.focus()}break;case"ArrowUp":t.preventDefault();if(!this.open){this.pendingListFocus="last";this.open=true}else{const t=this.el.shadowRoot?.querySelectorAll(".md-autocomplete__listbox md-menu-item:not([disabled])");t?.[t.length-1]?.focus()}break;case"Enter":if(this.freeSolo&&this.commitFreeSolo()){t.preventDefault();if(!this.multiple)this.open=false}break;case"Escape":if(this.open){t.preventDefault();this.open=false}break;case"Backspace":if(this.multiple&&!this.inputValue&&this.selectedArray.length>0){this.commitValue(this.selectedArray.slice(0,-1))}break}};this.handleFieldFocus=()=>{this.focused=true};this.handleFieldBlur=()=>{this.focused=false;if(this.open)return;if(this.clearOnBlur&&!this.multiple&&!this.freeSolo){const t=typeof this.value==="string"?this.labelMap.get(this.value):"";if(this.inputValue&&this.inputValue!==t){this.inputValue=t??"";this.mdInput.emit(this.inputValue)}}};this.renderChipItem=t=>o("md-chip",{key:t,part:"chip",exportparts:"remove:chip-remove,label:chip-label",variant:"input",selectable:false,label:this.labelMap.get(t)??t,disabled:this.disabled||this.softDisabled,removable:!this.disabled&&!this.softDisabled,onMdRemove:this.removeChip(t),onClick:t=>t.stopPropagation()})}async focusInput(){this.fieldEl?.focus?.()}async showMenu(){if(this.disabled)return;this.open=true}async closeMenu(){this.open=false}async loadOptions(t){const i=++this.loadGen;if(this.virtualize==="never"||!p()){const i=Array.isArray(t)?t:Array.from({length:t.count},((i,s)=>t.getRow(s)));this.vc.reset();this.optionsData=this.normalize(i);this.refreshLabelMap();return}this.optionsData=[];this.packing=true;try{this.vc.setFixedRowHeight(this.rowHeight);this.vc.setFilterMode(this.filterMode);await this.vc.load(Array.isArray(t)?this.normalize(t):t)}finally{if(i===this.loadGen)this.packing=false}if(i!==this.loadGen)return;if(this.open&&this.typedSinceOpen)this.vc.setQuery(this.query);this.refreshLabelMap();e(this)}async getLabels(t){if(this.vc.active)return Object.fromEntries(this.vc.getLabels(t));const i={};for(const s of t)i[s]=this.labelMap.get(s)??s;return i}normalize(t){return t.map((t=>({value:t.value,label:t.label??t.value,disabled:!!t.disabled,icon:t.icon,iconColor:t.iconColor,supportingText:t.supportingText??t.description,selected:!!t.selected})))}get optionList(){const t=this.options;if(Array.isArray(t))return t;if(typeof t==="string"&&t.trim()){try{const i=JSON.parse(t);return Array.isArray(i)?i:[]}catch{if(typeof console!=="undefined"){console.warn("[md-autocomplete] `options` attribute is not valid JSON:",t)}return[]}}return[]}refreshOptions(){const t=m(this.el,[]);const i=t.length>0?t:this.normalize(this.optionList);const s=this.virtualize==="always"||this.virtualize==="auto"&&i.length>z;const o=++this.loadGen;if(s&&p()&&i.length>0){this.optionsData=[];this.packing=true;this.vc.setFixedRowHeight(this.rowHeight);this.vc.setFilterMode(this.filterMode);void this.vc.load(i).then((t=>{if(o!==this.loadGen)return;if(!t){this.optionsData=i}this.packing=false;if(t&&this.open&&this.typedSinceOpen)this.vc.setQuery(this.query);this.refreshLabelMap();e(this)}))}else{this.vc.reset();this.optionsData=i;this.refreshLabelMap()}}onOptionChange(t){t.stopPropagation();this.refreshOptions()}get busy(){return this.loading||this.packing}get selectedArray(){if(this.multiple)return Array.isArray(this.value)?this.value:[];if(typeof this.value==="string"&&this.value)return[this.value];return[]}get query(){return this.typedSinceOpen?this.inputValue.trim():""}get filteredOptions(){const t=this.selectedArray;const i={inputValue:this.query,selected:t};let s=this.filterer?this.filterer(this.optionsData,i):this.defaultFilter(this.optionsData,i);if(this.limitResults>0)s=s.slice(0,this.limitResults);return s}defaultFilter(t,i){const s=i.inputValue.toLowerCase();if(!s)return t;return t.filter((t=>t.label.toLowerCase().includes(s)||t.value.toLowerCase().includes(s)||(t.supportingText?.toLowerCase().includes(s)??false)))}refreshLabelMap(){const t=this.selectedArray;if(t.length===0){if(this.labelMap.size)this.labelMap=new Map;return}const i=new Map;if(this.vc.active){const s=this.vc.getLabels(t);for(const e of t){i.set(e,s.get(e)??this.labelMap.get(e)??e)}}else{for(const s of t){const t=this.optionsData.find((t=>t.value===s));i.set(s,t?.label??this.labelMap.get(s)??s)}}this.labelMap=i}componentWillLoad(){this.refreshOptions();this.defaultValue=Array.isArray(this.value)?[...this.value]:this.value;this.defaultInputValue=this.inputValue;this.syncFormValue()}componentDidLoad(){if(this.open&&!this.disabled){void this.menuEl?.show?.({autoFocus:false});this.mdOpen.emit()}}disconnectedCallback(){clearTimeout(this.searchDebounce);this.vc.detachViewport()}formResetCallback(){this.value=Array.isArray(this.defaultValue)?[...this.defaultValue]:this.defaultValue;this.inputValue=this.defaultInputValue;this.typedSinceOpen=false;clearTimeout(this.searchDebounce);if(this.vc.active)this.vc.setQuery("")}syncFormValue(){this.updateValidity();this.refreshLabelMap();if(!this.multiple&&!this.open){const t=typeof this.value==="string"&&this.value?this.labelMap.get(this.value)??this.value:"";if(this.inputValue!==t)this.inputValue=t}if(this.multiple){const t=this.selectedArray;if(!t.length){h(this.internals,null);return}const i=new FormData;for(const s of t)i.append(this.name||"",s);h(this.internals,i);return}const t=typeof this.value==="string"?this.value:"";h(this.internals,t||null)}onMultipleFlip(){if(this.multiple){if(typeof this.value==="string")this.value=this.value?[this.value]:[];else this.syncFormValue()}else{if(Array.isArray(this.value))this.value=this.value[0]??"";else this.syncFormValue()}}updateValidity(){if(!this.internals?.setValidity)return;if(this.customValidityMessage){this.internals.setValidity({customError:true},this.customValidityMessage,this.fieldEl??this.el)}else if(this.required&&this.selectedArray.length===0){this.internals.setValidity({valueMissing:true},this.errorText||this.valueMissingLabel,this.fieldEl??this.el)}else{this.internals.setValidity({})}this.emitValidityChange()}async getValidity(){return r(this.internals)}emitValidityChange(){const t=r(this.internals);const i=`${t.valid}|${t.validationMessage}`;if(this.lastValidityKey===i)return;const s=this.lastValidityKey!==null;this.lastValidityKey=i;if(s)this.mdValidityChange.emit(t)}async checkValidity(){return l(this.internals)}async reportValidity(){return c(this.internals)}async setCustomValidity(t){this.customValidityMessage=t;this.updateValidity()}syncMenu(t){if(this._syncGuard||!this.menuEl)return;if(t){this.menuEl.show?.({autoFocus:false})}else{this.menuEl.close?.()}}attachMenuViewport(){void(async()=>{const t=await(this.menuEl?.getScrollViewport?.())??null;if(!t||this.vpWired)return;this.vpWired=true;await this.vc.attachViewport((async()=>t))})()}componentDidRender(){void this.syncComboboxRefs();if(!this.menuEl)return;if(this.vc.active&&!this.providerSet){void this.menuEl.setVirtualProvider?.(this.vc.provider);this.providerSet=true}else if(!this.vc.active&&this.providerSet){void this.menuEl.setVirtualProvider?.(null);this.providerSet=false}if(this.open&&this.vc.active&&!this.vpWired)this.attachMenuViewport();if(this.pendingListFocus&&this.open){const t=this.el.shadowRoot?.querySelectorAll(".md-autocomplete__listbox md-menu-item:not([disabled])");const i=this.pendingListFocus==="first"?t?.[0]:t?.[t.length-1];if(i){this.pendingListFocus=null;i.focus()}}else if(this.pendingListFocus&&!this.open){this.pendingListFocus=null}}async syncComboboxRefs(){const t=this.fieldEl;const i=await(t?.getInputElement?.());if(!i||!("ariaControlsElements"in i))return;const s=this.el.shadowRoot?.querySelector('[role="listbox"]');const e=this.open&&s?[s]:null;const o=i.ariaControlsElements;if(!e&&!o?.length)return;if(e&&o?.length===1&&o[0]===e[0])return;i.ariaControlsElements=e}commitValue(t){this.value=t;this.mdChange.emit(t)}pick(t,i,s,e){e?.stopPropagation();if(s)return;if(this.multiple){const s=this.selectedArray;const o=s.includes(t);const a=!o&&this.maxSelected>0&&s.length>=this.maxSelected;if(a){const t=e?.target;if(t)t.selected=false;return}this.labelMap=new Map(this.labelMap).set(t,i);const n=o?s.filter((i=>i!==t)):[...s,t];this.commitValue(n);this.inputValue="";this.mdInput.emit("");this.typedSinceOpen=false;if(this.vc.active)this.vc.setQuery("");this.fieldEl?.focus?.()}else{this.labelMap=new Map(this.labelMap).set(t,i);this.commitValue(t);this.inputValue=i;this.mdInput.emit(i);this.typedSinceOpen=false;if(this.vc.active)this.vc.setQuery("");if(!this.disableCloseOnSelect)this.open=false;this.fieldEl?.focus?.()}}commitFreeSolo(){if(!this.freeSolo)return false;const t=this.inputValue.trim();if(!t)return false;if(this.multiple){const i=this.selectedArray;if(i.includes(t))return true;if(this.maxSelected>0&&i.length>=this.maxSelected)return false;this.labelMap=new Map(this.labelMap).set(t,t);this.commitValue([...i,t]);this.inputValue="";this.mdInput.emit("")}else{this.commitValue(t)}return true}applyTyped(t){this.inputValue=t;this.typedSinceOpen=true;this.mdInput.emit(t);if(!this.open)this.open=true;if(this.vc.active){clearTimeout(this.searchDebounce);this.searchDebounce=setTimeout((()=>{this.vc.setQuery(this.query)}),C)}}firstOptionItem(){return this.el.shadowRoot?.querySelector(".md-autocomplete__listbox md-menu-item:not([disabled])")??null}get inlineChips(){return this.multiple&&this.chipPosition==="inline"}renderChips(){if(!this.multiple||this.inlineChips)return null;const t=this.selectedArray;if(t.length===0)return null;return o("div",{class:"md-autocomplete__chips",part:"chips",role:"group","aria-label":this.label?`${this.label} — selected`:"Selected"},t.map(this.renderChipItem))}renderInlineChips(){if(!this.inlineChips)return null;const t=this.selectedArray;if(t.length===0)return null;return o("div",{slot:"chips",class:"md-autocomplete__inline-chips",part:"chips",role:"group","aria-label":this.label?`${this.label} — selected`:"Selected"},t.map(this.renderChipItem))}renderClearButton(t=false){if(!this.clearable)return null;const i=this.multiple?this.selectedArray.length>0:!!this.inputValue||!!this.value;const s=t||!i;return o("md-icon-button",{class:{"md-autocomplete__clear":true,"md-autocomplete__clear--hidden":s},slot:"trailing-icon",part:"clear",variant:"standard",size:"xs",icon:this.clearIcon,"aria-label":"Clear value","aria-hidden":s?"true":undefined,onClick:t=>{t.stopPropagation();this.handleClear()}})}renderTrigger(){return o("md-text-field",{ref:t=>this.fieldEl=t,id:this.triggerId,class:"md-autocomplete__field",part:"field",variant:this.variant,label:this.label,placeholder:this.placeholder,value:this.inputValue,disabled:this.disabled,error:this.error,errorText:this.errorText,reserveSupportingSpace:this.reserveSupportingSpace,supportingText:this.supportingText,required:this.required,density:this.density,appearFocused:this.open||this.focused,"aria-haspopup":"listbox",inputRole:"combobox",inputExpanded:this.open,inputAriaAutocomplete:"list",chipsWrap:this.inlineChips,onMdInput:this.handleFieldInput,onClick:()=>{if(!this.disabled&&!this.softDisabled&&!this.open)this.open=true},onKeyDown:this.handleFieldKeyDown,onFocus:this.handleFieldFocus,onBlur:this.handleFieldBlur},this.renderInlineChips(),this.busy?[this.renderClearButton(true),o("span",{slot:"trailing-icon",class:"md-autocomplete__loader",part:"loading-spinner"},o("slot",{name:"loader"},o("md-loading-indicator",{label:this.loadingText})))]:[this.renderClearButton(),o("span",{slot:"trailing-icon",class:"md-autocomplete__caret material-symbols-outlined",part:"caret","aria-hidden":"true",onClick:t=>{t.stopPropagation();if(!this.disabled&&!this.softDisabled)this.open=!this.open}},o("slot",{name:"dropdown-icon"},this.dropdownIcon))])}renderOptionIcon(t,i){if(!t)return null;return o("span",{slot:"leading-icon",part:"option-icon",class:"material-symbols-outlined md-autocomplete__option-icon",style:i?{color:i}:undefined,"aria-hidden":"true"},t)}renderVirtualOptions(){return o("div",{class:"md-autocomplete__listbox",role:"listbox",id:`${this.triggerId}-listbox`,"aria-label":this.label||"Options","aria-multiselectable":this.multiple?"true":undefined,onKeyDown:this.handleListboxKeyDown},o("div",{class:"md-autocomplete__vspacer",style:{height:`${this.vc.topPad}px`},"aria-hidden":"true"}),this.vc.windowRows.map(((t,i)=>{const s=this.vc.windowStart+i;const e=this.isSelected(t.value);return o("md-menu-item",{key:t.index,id:`${this.triggerId}-opt-${s}`,"data-vindex":s,presentation:"option",type:this.multiple?"checkbox":"radio","check-position":"start","keep-open":true,part:e?"option option-selected":"option",disabled:t.disabled,selected:e,headline:t.label,"supporting-text":t.supportingText||"","aria-setsize":this.vc.filteredLength,"aria-posinset":s+1,onMdClick:i=>this.pick(t.value,t.label,t.disabled,i)},this.renderOptionIcon(t.icon||undefined))})),o("div",{class:"md-autocomplete__vspacer",style:{height:`${this.vc.bottomPad}px`},"aria-hidden":"true"}))}renderMenu(){const t=this.vc.active;const i=t?[]:this.filteredOptions;const s=t?false:this.optionsData.length===0;const e=this.busy?"":t?this.vc.filteredLength===0?this.noResultsText:"":s?this.noOptionsText:i.length===0?this.noResultsText:"";const a=t?this.maxHeight??320:this.maxHeight;return o("md-menu",{ref:t=>this.menuEl=t,anchor:this.triggerId,placement:this.placement,"match-anchor-width":this.matchTriggerWidth,"max-height":a,persistent:this.disableCloseOnSelect,"empty-text":e,"auto-focus":false,listbox:true,"list-label":this.label||"Options",part:"menu",onMdOpen:this.handleMenuOpen,onMdClose:this.handleMenuClose},this.busy?o("div",{class:"md-autocomplete__loading",part:"loading",role:"status","aria-label":this.loadingText},o("md-progress-indicator",{variant:"linear",indeterminate:true,wave:true,part:"loading-progress",label:this.loadingText})):t?this.renderVirtualOptions():o("div",{class:"md-autocomplete__listbox",role:"listbox",id:`${this.triggerId}-listbox`,"aria-label":this.label||"Options","aria-multiselectable":this.multiple?"true":undefined,onKeyDown:this.handleListboxKeyDown},i.map(((t,i)=>o("md-menu-item",{key:t.value,id:`${this.triggerId}-opt-${i}`,presentation:"option",type:this.multiple?"checkbox":"radio","check-position":"start","keep-open":true,part:this.isSelected(t.value)?"option option-selected":"option",disabled:t.disabled,selected:this.isSelected(t.value),headline:t.label,"supporting-text":t.supportingText||"",onMdClick:i=>this.pick(t.value,t.label,t.disabled,i)},this.renderOptionIcon(t.icon,t.iconColor))))))}render(){const t=this.multiple&&(this.chipPosition==="top"||this.chipPosition==="left");const i=this.vc.active?this.vc.filteredLength:this.filteredOptions.length;const s=this.busy?this.loadingText:this.open?this.statusTemplate.replace("{count}",String(i)):"";return o(a,{key:"265bb0cbd1dc6b00e618a0263c0cd825ad3a77fb",class:{"md-autocomplete":true,[`md-autocomplete--${this.variant}`]:true,"md-autocomplete--open":this.open,"md-autocomplete--disabled":this.disabled,"md-autocomplete--soft-disabled":this.softDisabled,"md-autocomplete--multiple":this.multiple,"md-autocomplete--loading":this.busy,[`md-autocomplete--chips-${this.chipPosition}`]:this.multiple},"aria-haspopup":"listbox","aria-busy":this.busy?"true":"false"},t&&this.renderChips(),this.renderTrigger(),!t&&this.renderChips(),this.renderMenu(),o("span",{key:"65354ca0d573e3411bc022eb008b59cf4fa335bf",class:"md-autocomplete__sr-status",role:"status","aria-live":"polite"},s))}static get formAssociated(){return true}get el(){return this}static get watchers(){return{options:[{refreshOptions:0}],value:[{syncFormValue:0}],multiple:[{onMultipleFlip:0}],required:[{updateValidity:0}],valueMissingLabel:[{updateValidity:0}],open:[{syncMenu:0}]}}static get style(){return w()}},[321,"md-autocomplete",{valueMissingLabel:[1,"value-missing-label"],reserveSupportingSpace:[4,"reserve-supporting-space"],variant:[513],label:[1],placeholder:[1],supportingText:[1,"supporting-text"],error:[516],errorText:[1,"error-text"],disabled:[516],softDisabled:[516,"soft-disabled"],required:[516],density:[514],options:[1],multiple:[516],chipPosition:[513,"chip-position"],value:[1025],inputValue:[1025,"input-value"],freeSolo:[516,"free-solo"],maxSelected:[2,"max-selected"],loading:[516],noOptionsText:[1,"no-options-text"],noResultsText:[1,"no-results-text"],loadingText:[1,"loading-text"],statusTemplate:[1,"status-template"],disableCloseOnSelect:[516,"disable-close-on-select"],clearOnBlur:[516,"clear-on-blur"],clearable:[516],clearIcon:[1,"clear-icon"],dropdownIcon:[1,"dropdown-icon"],limitResults:[2,"limit-results"],open:[1540],filterer:[16],virtualize:[1],filterMode:[1,"filter-mode"],rowHeight:[2,"row-height"],placement:[1],matchTriggerWidth:[4,"match-trigger-width"],maxHeight:[2,"max-height"],name:[513],triggerId:[32],focused:[32],optionsData:[32],labelMap:[32],packing:[32],focusInput:[64],showMenu:[64],closeMenu:[64],loadOptions:[64],getLabels:[64],getValidity:[64],checkValidity:[64],reportValidity:[64],setCustomValidity:[64]},[[0,"mdSelectOptionChange","onOptionChange"]],{options:[{refreshOptions:0}],value:[{syncFormValue:0}],multiple:[{onMultipleFlip:0}],required:[{updateValidity:0}],valueMissingLabel:[{updateValidity:0}],open:[{syncMenu:0}]}]);function O(){if(typeof customElements==="undefined"){return}const t=["md-autocomplete","md-chip","md-icon-button","md-loading-indicator","md-menu","md-menu-item","md-progress-indicator","md-ripple","md-text-field"];t.forEach((t=>{switch(t){case"md-autocomplete":if(!customElements.get(n(t))){customElements.define(n(t),M)}break;case"md-chip":if(!customElements.get(n(t))){u()}break;case"md-icon-button":if(!customElements.get(n(t))){f()}break;case"md-loading-indicator":if(!customElements.get(n(t))){g()}break;case"md-menu":if(!customElements.get(n(t))){b()}break;case"md-menu-item":if(!customElements.get(n(t))){y()}break;case"md-progress-indicator":if(!customElements.get(n(t))){v()}break;case"md-ripple":if(!customElements.get(n(t))){_()}break;case"md-text-field":if(!customElements.get(n(t))){x()}break}}))}O();const V=M;const A=O;export{V as MdAutocomplete,A as defineCustomElement};
 //# sourceMappingURL=md-autocomplete.js.map

package/dist/components/md-avatar.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{M as t,d as o}from"./p-Ch2-tttM.js";const s=t;const p=o;export{s as MdAvatar,p as defineCustomElement};
+import{M as o,d as s}from"./p-Eb44PPZa.js";const t=o;const a=s;export{t as MdAvatar,a as defineCustomElement};
 //# sourceMappingURL=md-avatar.js.map

package/dist/components/md-badge.js CHANGED Viewed

@@ -1,2 +1,2 @@
-import{p as e,H as a,h as t,d as s,t as o}from"./p-MWBNn6Lj.js";const i=()=>`:host{--_container-color:var(--md-badge-container-color, var(--md-sys-color-error, #B3261E));--_label-color:var(--md-badge-label-color, var(--md-sys-color-on-error, #FFFFFF));--_shape:var(--md-badge-container-shape, var(--md-sys-shape-corner-full, 9999px));--_icon-color:var(--md-badge-icon-color, var(--md-badge-label-color, var(--md-sys-color-on-error, #FFFFFF)));--_icon-size:var(--md-badge-icon-size, max(8px, calc(10px + var(--md-sys-density-scale, 0) * 0.5px)));--_offset-x:var(--md-badge-offset-x, 50%);--_offset-y:var(--md-badge-offset-y, -50%);--_large-height:var(--md-badge-large-height, max(12px, calc(16px + var(--md-sys-density-scale, 0) * 1px)));--_large-padding:var(--md-badge-large-padding, 0 max(2px, calc(4px + var(--md-sys-density-scale, 0) * 0.5px)));--_small-size:var(--md-badge-small-size, max(4px, calc(6px + var(--md-sys-density-scale, 0) * 0.5px)));display:inline-flex;align-items:center;justify-content:center;position:absolute;top:0;right:0;z-index:1;box-sizing:border-box;pointer-events:none;background-color:var(--_container-color);border-radius:var(--_shape)}:host(.md-badge--small){width:var(--_small-size);height:var(--_small-size);padding:0;transform:translate(var(--_offset-x), var(--_offset-y))}:host(.md-badge--large){min-width:var(--_large-height);height:var(--_large-height);padding:var(--_large-padding);transform:translate(var(--_offset-x), var(--_offset-y));color:var(--_label-color);font-family:var(--md-sys-typescale-label-small-font-family, Roboto, sans-serif);font-size:max(9px, calc(11px + var(--md-sys-density-scale, 0) * 0.5px));font-weight:var(--md-sys-typescale-label-small-font-weight, 500);letter-spacing:var(--md-sys-typescale-label-small-letter-spacing, 0.5px);line-height:1}:host(.md-badge--large:not(.md-badge--has-content)){padding:0}.md-badge__label{display:block;white-space:nowrap;text-align:center}.md-badge__icon{font-size:var(--_icon-size);color:var(--_icon-color);line-height:1;display:flex;align-items:center;justify-content:center}::slotted(*){width:var(--_icon-size) !important;height:var(--_icon-size) !important;font-size:var(--_icon-size) !important;color:var(--_icon-color) !important;fill:var(--_icon-color) !important}.material-symbols-outlined{font-family:var(--md-sys-icon-font-family, 'Material Symbols Outlined', 'Material Icons');font-weight:normal;font-style:normal;font-size:var(--_icon-size, 10px);line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;overflow-wrap:normal;direction:ltr;font-feature-settings:'liga';-webkit-font-smoothing:antialiased}@media (forced-colors: active){:host{forced-color-adjust:none;background-color:Mark;color:MarkText}}:host([density='-1']){--md-sys-density-scale:-1}:host([density='-2']){--md-sys-density-scale:-2}:host([density='-3']){--md-sys-density-scale:-3}:host([density='-4']){--md-sys-density-scale:-4}`;const r=e(class e extends a{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow();this.variant="large";this.value="";this.max=999;this.icon="";this.density=0;this.hasSlottedIcon=false;this.readSlottedIcon=()=>{this.hasSlottedIcon=Array.from(this.el.children).some((e=>e.getAttribute("slot")==="icon"))}}componentWillLoad(){this.readSlottedIcon()}get displayValue(){if(this.variant==="small"||!this.value)return"";const e=Number(this.value);if(!Number.isNaN(e)&&Number.isFinite(e)&&e>this.max){return`${this.max}+`}return this.value.slice(0,4)}get accessibleLabel(){if(this.variant==="small")return"notification";const e=this.displayValue;if(e)return e;if(this.icon)return this.icon;return undefined}render(){const e=this.variant==="small";const a=this.displayValue;const o=!e&&!!a;const i=!e&&(!!this.icon||this.hasSlottedIcon);const r=o||i;return t(s,{key:"24252e87e0919c3ef49173c4659ad7509e989826",class:{"md-badge":true,"md-badge--small":e,"md-badge--large":!e,"md-badge--has-content":r},role:"status","aria-label":this.accessibleLabel},!e&&t("slot",{key:"8d9fd92575a0a03c8d7e9017b58e86b609d36d07",name:"icon",onSlotchange:this.readSlottedIcon},this.icon?t("span",{class:"md-badge__icon material-symbols-outlined",part:"icon","aria-hidden":"true"},this.icon):null),o&&t("span",{key:"c62df0bac4aa40c211e3fc830fa51fb0f003852c",class:"md-badge__label",part:"label"},a))}get el(){return this}static get style(){return i()}},[257,"md-badge",{variant:[513],value:[1],max:[2],icon:[1],density:[514],hasSlottedIcon:[32]}]);function n(){if(typeof customElements==="undefined"){return}const e=["md-badge"];e.forEach((e=>{switch(e){case"md-badge":if(!customElements.get(o(e))){customElements.define(o(e),r)}break}}))}n();const l=r;const d=n;export{l as MdBadge,d as defineCustomElement};
+import{p as e,H as a,h as t,d as s,t as o}from"./p-BR6gfOQH.js";const i=()=>`:host{--_container-color:var(--md-badge-container-color, var(--md-sys-color-error, #B3261E));--_label-color:var(--md-badge-label-color, var(--md-sys-color-on-error, #FFFFFF));--_shape:var(--md-badge-container-shape, var(--md-sys-shape-corner-full, 9999px));--_icon-color:var(--md-badge-icon-color, var(--md-badge-label-color, var(--md-sys-color-on-error, #FFFFFF)));--_icon-size:var(--md-badge-icon-size, max(8px, calc(10px + var(--md-sys-density-scale, 0) * 0.5px)));--_offset-x:var(--md-badge-offset-x, 50%);--_offset-y:var(--md-badge-offset-y, -50%);--_large-height:var(--md-badge-large-height, max(12px, calc(16px + var(--md-sys-density-scale, 0) * 1px)));--_large-padding:var(--md-badge-large-padding, 0 max(2px, calc(4px + var(--md-sys-density-scale, 0) * 0.5px)));--_small-size:var(--md-badge-small-size, max(4px, calc(6px + var(--md-sys-density-scale, 0) * 0.5px)));display:inline-flex;align-items:center;justify-content:center;position:absolute;top:0;right:0;z-index:1;box-sizing:border-box;pointer-events:none;background-color:var(--_container-color);border-radius:var(--_shape)}:host(.md-badge--small){width:var(--_small-size);height:var(--_small-size);padding:0;transform:translate(var(--_offset-x), var(--_offset-y))}:host(.md-badge--large){min-width:var(--_large-height);height:var(--_large-height);padding:var(--_large-padding);transform:translate(var(--_offset-x), var(--_offset-y));color:var(--_label-color);font-family:var(--md-sys-typescale-label-small-font-family, Roboto, sans-serif);font-size:max(9px, calc(11px + var(--md-sys-density-scale, 0) * 0.5px));font-weight:var(--md-sys-typescale-label-small-font-weight, 500);letter-spacing:var(--md-sys-typescale-label-small-letter-spacing, 0.5px);line-height:1}:host(.md-badge--large:not(.md-badge--has-content)){padding:0}.md-badge__label{display:block;white-space:nowrap;text-align:center}.md-badge__icon{font-size:var(--_icon-size);color:var(--_icon-color);line-height:1;display:flex;align-items:center;justify-content:center}::slotted(*){width:var(--_icon-size) !important;height:var(--_icon-size) !important;font-size:var(--_icon-size) !important;color:var(--_icon-color) !important;fill:var(--_icon-color) !important}.material-symbols-outlined{font-family:var(--md-sys-icon-font-family, 'Material Symbols Outlined', 'Material Icons');font-weight:normal;font-style:normal;font-size:var(--_icon-size, 10px);line-height:1;letter-spacing:normal;text-transform:none;display:inline-block;white-space:nowrap;overflow-wrap:normal;direction:ltr;font-feature-settings:'liga';-webkit-font-smoothing:antialiased}@media (forced-colors: active){:host{forced-color-adjust:none;background-color:Mark;color:MarkText}}:host([density='-1']){--md-sys-density-scale:-1}:host([density='-2']){--md-sys-density-scale:-2}:host([density='-3']){--md-sys-density-scale:-3}:host([density='-4']){--md-sys-density-scale:-4}`;const r=e(class e extends a{constructor(e){super();if(e!==false){this.__registerHost()}this.__attachShadow();this.variant="large";this.value="";this.max=999;this.icon="";this.density=0;this.hasSlottedIcon=false;this.readSlottedIcon=()=>{this.hasSlottedIcon=Array.from(this.el.children).some((e=>e.getAttribute("slot")==="icon"))}}componentWillLoad(){this.readSlottedIcon()}get displayValue(){if(this.variant==="small"||!this.value)return"";const e=Number(this.value);if(!Number.isNaN(e)&&Number.isFinite(e)&&e>this.max){return`${this.max}+`}return this.value.slice(0,4)}get accessibleLabel(){if(this.variant==="small")return"notification";const e=this.displayValue;if(e)return e;if(this.icon)return this.icon;return undefined}render(){const e=this.variant==="small";const a=this.displayValue;const o=!e&&!!a;const i=!e&&(!!this.icon||this.hasSlottedIcon);const r=o||i;return t(s,{key:"24252e87e0919c3ef49173c4659ad7509e989826",class:{"md-badge":true,"md-badge--small":e,"md-badge--large":!e,"md-badge--has-content":r},role:"status","aria-label":this.accessibleLabel},!e&&t("slot",{key:"8d9fd92575a0a03c8d7e9017b58e86b609d36d07",name:"icon",onSlotchange:this.readSlottedIcon},this.icon?t("span",{class:"md-badge__icon material-symbols-outlined",part:"icon","aria-hidden":"true"},this.icon):null),o&&t("span",{key:"c62df0bac4aa40c211e3fc830fa51fb0f003852c",class:"md-badge__label",part:"label"},a))}get el(){return this}static get style(){return i()}},[257,"md-badge",{variant:[513],value:[1],max:[2],icon:[1],density:[514],hasSlottedIcon:[32]}]);function n(){if(typeof customElements==="undefined"){return}const e=["md-badge"];e.forEach((e=>{switch(e){case"md-badge":if(!customElements.get(o(e))){customElements.define(o(e),r)}break}}))}n();const l=r;const d=n;export{l as MdBadge,d as defineCustomElement};
 //# sourceMappingURL=md-badge.js.map