@awc-ui/core 1.0.0-beta.5 → 1.0.0-beta.7
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.
- package/dist/cjs/md-button_6.cjs.entry.js +17 -2
- package/dist/cjs/md-button_6.cjs.entry.js.map +1 -1
- package/dist/cjs/md-segmented-button-set.cjs.entry.js +20 -2
- package/dist/cjs/md-segmented-button-set.cjs.entry.js.map +1 -1
- package/dist/collection/components/md-button/md-button.js +17 -2
- package/dist/collection/components/md-button/md-button.js.map +1 -1
- package/dist/collection/components/md-segmented-button-set/md-segmented-button-set.js +20 -2
- package/dist/collection/components/md-segmented-button-set/md-segmented-button-set.js.map +1 -1
- package/dist/components/md-button.js +1 -1
- package/dist/components/md-date-picker.js +1 -1
- package/dist/components/md-dialog.js +1 -1
- package/dist/components/md-multi-select.js +1 -1
- package/dist/components/md-segmented-button-set.js +1 -1
- package/dist/components/md-segmented-button-set.js.map +1 -1
- package/dist/components/md-snackbar.js +1 -1
- package/dist/components/md-step.js +1 -1
- package/dist/components/md-stepper.js +1 -1
- package/dist/components/md-time-picker.js +1 -1
- package/dist/components/{p-C1RN8YA1.js → p-BTgac9TA.js} +2 -2
- package/dist/components/p-BTgac9TA.js.map +1 -0
- package/dist/components-csr/md-button.js +1 -1
- package/dist/components-csr/md-date-picker.js +1 -1
- package/dist/components-csr/md-dialog.js +1 -1
- package/dist/components-csr/md-multi-select.js +1 -1
- package/dist/components-csr/md-segmented-button-set.js +1 -1
- package/dist/components-csr/md-segmented-button-set.js.map +1 -1
- package/dist/components-csr/md-snackbar.js +1 -1
- package/dist/components-csr/md-step.js +1 -1
- package/dist/components-csr/md-stepper.js +1 -1
- package/dist/components-csr/md-time-picker.js +1 -1
- package/dist/components-csr/{p-GG1ZMEng.js → p-QF3B4ODr.js} +2 -2
- package/dist/components-csr/p-QF3B4ODr.js.map +1 -0
- package/dist/esm/md-button_6.entry.js +17 -2
- package/dist/esm/md-button_6.entry.js.map +1 -1
- package/dist/esm/md-segmented-button-set.entry.js +20 -2
- package/dist/esm/md-segmented-button-set.entry.js.map +1 -1
- package/dist/md3/md3.esm.js +1 -1
- package/dist/md3/p-91df971f.entry.js +2 -0
- package/dist/md3/p-91df971f.entry.js.map +1 -0
- package/dist/md3/p-e661754b.entry.js +2 -0
- package/dist/md3/p-e661754b.entry.js.map +1 -0
- package/dist/types/components/md-segmented-button-set/md-segmented-button-set.d.ts +16 -0
- package/hydrate/index.js +37 -4
- package/hydrate/index.mjs +37 -4
- package/package.json +2 -2
- package/dist/components/p-C1RN8YA1.js.map +0 -1
- package/dist/components-csr/p-GG1ZMEng.js.map +0 -1
- package/dist/md3/p-56ea09a4.entry.js +0 -2
- package/dist/md3/p-56ea09a4.entry.js.map +0 -1
- package/dist/md3/p-6b841f69.entry.js +0 -2
- package/dist/md3/p-6b841f69.entry.js.map +0 -1
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as t,H as i,c as e,f as s,h as l,d as r,t as a}from"./p-CB5yqdO-.js";import{L as n}from"./p-AILMdNGi.js";import{V as o,i as c,n as h,r as d,c as m}from"./p-Bz-JaJcA.js";import{s as u,g as p,c as f,r as g}from"./p-DWxN44zD.js";import{p as b}from"./p-CxhZdOPw.js";import{d as v}from"./p-C1RN8YA1.js";import{d as _}from"./p-D9iSpQOZ.js";import{d as y}from"./p-wDoz_U2w.js";import{d as x}from"./p-7H7RuKzd.js";import{d as w}from"./p--hajGo6a.js";import{d as k}from"./p-CvxKUiKT.js";import{d as z}from"./p-CwwjCemf.js";const C=()=>`:host{--md-text-field-padding-inline-end:var(--md-sys-spacing-inset-lg, 16px);--_min-width:var(--md-multi-select-min-width, 200px);--_chip-gap:var(--md-multi-select-chip-gap, var(--md-sys-spacing-gap-xs, 4px));--_chip-radius:var(--md-multi-select-chip-radius, 8px);--_caret-color:var(--md-multi-select-caret-color, var(--md-sys-color-on-surface-variant));--_clear-color:var(--md-multi-select-clear-color, var(--md-sys-color-on-surface-variant));--_option-icon-size:var(--md-multi-select-option-icon-size, 20px);font-family:var(--md-sys-typescale-body-large-font-family, Roboto, sans-serif);display:inline-block;inline-size:var(--md-multi-select-width, 100%);min-inline-size:var(--_min-width);box-sizing:border-box;vertical-align:bottom;position:relative}.md-multi-select__field{display:block;inline-size:100%;cursor:pointer;--md-text-field-cursor:pointer}.md-multi-select__field::part(input){cursor:pointer}:host(.md-multi-select--display-text) .md-multi-select__field::part(input){text-overflow:ellipsis}:host(.md-multi-select--disabled) .md-multi-select__field,:host(.md-multi-select--soft-disabled) .md-multi-select__field{cursor:not-allowed;--md-text-field-cursor:not-allowed}:host(.md-multi-select--disabled) .md-multi-select__field::part(input),:host(.md-multi-select--soft-disabled) .md-multi-select__field::part(input){cursor:not-allowed}.md-multi-select__frame{display:flex;flex-direction:column;gap:var(--md-multi-select-frame-gap, max(6px, calc(8px + var(--md-sys-density-scale, 0) * 0.5px)))}:host(.md-multi-select--chips-top) .md-multi-select__frame{flex-direction:column-reverse;gap:var(--md-multi-select-frame-gap, max(6px, calc(16px + var(--md-sys-density-scale, 0) * 2.5px)))}:host(.md-multi-select--chips-left) .md-multi-select__frame,:host(.md-multi-select--chips-right) .md-multi-select__frame{flex-flow:row nowrap;align-items:center;justify-content:flex-start}:host(.md-multi-select--chips-left) .md-multi-select__chips{order:-1}:host(.md-multi-select--chips-left) .md-multi-select__field,:host(.md-multi-select--chips-right) .md-multi-select__field{inline-size:var(--md-multi-select-trigger-width, max-content);flex:0 0 auto}:host(.md-multi-select--chips-left) ::slotted([slot='trigger']),:host(.md-multi-select--chips-right) ::slotted([slot='trigger']){inline-size:var(--md-multi-select-trigger-width, max-content);flex:0 0 auto}:host(.md-multi-select--chips-left) .md-multi-select__chips,:host(.md-multi-select--chips-right) .md-multi-select__chips{flex:0 1 auto;min-inline-size:0}.md-multi-select__chips{display:flex;flex-wrap:wrap;align-items:center;gap:var(--_chip-gap);max-inline-size:100%}:host(.md-multi-select--chips-bottom) .md-multi-select__chips,:host(.md-multi-select--chips-top) .md-multi-select__chips{contain:inline-size}.md-multi-select__chips md-chip{--md-chip-container-shape:var(--_chip-radius)}.md-multi-select__button{flex:0 0 auto}.md-multi-select__button-desc{padding-block-start:4px;padding-inline:16px;font:var(--md-sys-typescale-body-small, 400 12px/16px Roboto, sans-serif);color:var(--md-sys-color-on-surface-variant, #49454f)}.md-multi-select__button-desc--error{color:var(--md-sys-color-error, #b3261e)}.md-multi-select__sr-live{position:absolute;inline-size:1px;block-size:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.md-multi-select__inline-chips{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--_chip-gap);min-inline-size:0;max-inline-size:100%;flex:1 1 auto;position:relative;overflow:hidden;}.md-multi-select__inline-chips--wrap{flex-wrap:wrap;overflow:visible;padding-block-start:var(--md-multi-select-inline-chips-block-start, var(--md-sys-spacing-gap-xs, 4px));row-gap:var(--_chip-gap)}.md-multi-select__inline-chips md-chip,.md-multi-select__inline-measure md-chip{--md-chip-container-shape:var(--_chip-radius);flex-shrink:0}.md-multi-select__measure-clip{position:absolute;inline-size:0;block-size:0;overflow:hidden;pointer-events:none}.md-multi-select__inline-measure{position:absolute;inset-block-start:0;inset-inline-start:0;display:flex;flex-wrap:nowrap;align-items:center;gap:var(--_chip-gap);inline-size:max-content;visibility:hidden;pointer-events:none;white-space:nowrap}.md-multi-select__overflow-chip{flex-shrink:0;display:inline-flex;align-items:center;block-size:var(--md-multi-select-chip-height, 32px);padding-inline:12px;border:1px solid var(--md-multi-select-chip-outline, var(--md-sys-color-outline-variant, #CAC4D0));border-radius:var(--_chip-radius);background:transparent;color:var(--md-sys-color-on-surface-variant, #49454F);font:500 var(--md-sys-typescale-label-large-size, 14px) / var(--md-sys-typescale-label-large-line-height, 20px) var(--md-sys-typescale-label-large-font, Roboto, sans-serif);white-space:nowrap;cursor:pointer}.md-multi-select__overflow-chip:hover:not(:disabled){background:color-mix(in srgb, var(--md-sys-color-on-surface, #1C1B1F) 8%, transparent)}.md-multi-select__overflow-chip:focus-visible{outline:2px solid var(--md-sys-color-primary, #6750A4);outline-offset:2px}.md-multi-select__clear{display:inline-flex;align-items:center;justify-content:center;inline-size:var(--md-multi-select-clear-size, 28px);block-size:var(--md-multi-select-clear-size, 28px);padding:0;background:var(--md-multi-select-clear-bg, transparent);border:0;border-radius:var(--md-multi-select-clear-radius, 50%);color:var(--_clear-color);cursor:pointer;font-size:var(--md-multi-select-clear-icon-size, 18px);transition:background var(--md-sys-motion-duration-short2, 100ms) ease}.md-multi-select__clear:hover{background:var(--md-multi-select-clear-hover-bg, color-mix(in srgb, var(--md-sys-color-on-surface) 8%, transparent))}.md-multi-select__clear:focus-visible{outline-width:var(--md-multi-select-clear-focus-ring-width, 2px);outline-style:solid;outline-color:var(--md-multi-select-clear-focus-ring-color, var(--md-sys-color-primary));outline-offset:var(--md-multi-select-clear-focus-ring-offset, 1px)}.md-multi-select__clear .material-symbols-outlined{font-size:var(--md-multi-select-clear-icon-size, 18px)}.md-multi-select__field .md-multi-select__caret-box{display:inline-flex;align-items:center;justify-content:center;width:auto;height:auto}.md-multi-select__caret{color:var(--_caret-color);font-size:var(--md-multi-select-caret-size, 24px);line-height:1;transition:transform var(--md-sys-motion-duration-short4, 200ms) var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1));display:inline-flex;align-items:center;justify-content:center;inline-size:var(--md-multi-select-caret-box-size, 24px);block-size:var(--md-multi-select-caret-box-size, 24px)}:host(.md-multi-select--open) .md-multi-select__caret{transform:rotate(180deg)}.md-multi-select__loader{display:inline-flex;align-items:center;justify-content:center;inline-size:var(--md-multi-select-loader-size, 24px);block-size:var(--md-multi-select-loader-size, 24px);--md-loading-indicator-size:var(--md-multi-select-spinner-size, 22px);--md-loading-indicator-shape-size:var(--md-multi-select-spinner-size, 22px)}.md-multi-select__loading{display:flex;align-items:center;padding-block:var(--md-multi-select-loading-padding, var(--md-sys-spacing-inset-lg, 16px));padding-inline:var(--md-multi-select-loading-padding, var(--md-sys-spacing-inset-lg, 16px))}.md-multi-select__loading md-progress-indicator{inline-size:100%}.md-multi-select__empty{display:flex;justify-content:center;padding:var(--md-multi-select-empty-padding, var(--md-sys-spacing-inset-md, 12px) var(--md-sys-spacing-inset-lg, 16px));color:var(--md-multi-select-empty-color, var(--md-sys-color-on-surface-variant, #49454f));text-align:center;font:var(--md-multi-select-empty-font, var(--md-sys-typescale-body-medium, 400 14px/20px Roboto, sans-serif))}.md-multi-select__select-all{display:block;border-block-end:var(--md-multi-select-select-all-divider-width, 1px) solid var(--md-multi-select-select-all-divider-color, var(--md-sys-color-outline-variant, #cac4d0))}md-menu::part(empty-text){display:block;padding:var(--md-multi-select-empty-padding, var(--md-sys-spacing-inset-md, 12px) var(--md-sys-spacing-inset-lg, 16px));color:var(--md-multi-select-empty-color, var(--md-sys-color-on-surface-variant));text-align:center}.md-multi-select__option-icon{display:inline-flex;align-items:center;justify-content:center;color:var(--md-multi-select-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);line-height:1}@media (prefers-reduced-motion: reduce){.md-multi-select__caret,.md-multi-select__clear{transition:none}}@media (forced-colors: active){.md-multi-select__caret{color:CanvasText}.md-multi-select__clear:focus-visible{outline-color:Highlight}}.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}.md-multi-select__vspacer{display:block;flex:none;pointer-events:none}.md-multi-select__search-wrap{position:relative;display:block}.md-multi-select__search{box-sizing:border-box;width:100%;border:none;outline:none;padding:var(--md-multi-select-search-padding, 12px 44px 12px 16px);font:inherit;color:var(--md-multi-select-search-color, var(--md-sys-color-on-surface, #1d1b20));background:var(--md-multi-select-search-bg, var(--md-sys-color-surface-container, #f3edf7));border-bottom:var(--md-multi-select-search-border-width, 1px) solid var(--md-multi-select-search-border-color, var(--md-sys-color-outline-variant, #cac4d0))}.md-multi-select__search::placeholder{color:var(--md-multi-select-search-placeholder-color, var(--md-sys-color-on-surface-variant, #49454f))}.md-multi-select__search-spinner{position:absolute;inset-block-start:50%;inset-inline-end:12px;margin-block-start:-12px;--md-loading-indicator-size:var(--md-multi-select-search-spinner-size, 24px);--md-loading-indicator-shape-size:18px;pointer-events:none}:host([density='-1']){--md-sys-density-scale:-1}:host([density='-2']){--md-sys-density-scale:-2}:host([density='-3']){--md-sys-density-scale:-3}:host([density='-4']){--md-sys-density-scale:-4}:host([hidden]){display:none !important}`;let M=0;const O=200;const T=180;const S=t(class t extends i{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.mdChange=e(this,"mdChange",7);this.mdOpen=e(this,"mdOpen",7);this.mdClose=e(this,"mdClose",7);this.mdRemove=e(this,"mdRemove",7);this.mdClear=e(this,"mdClear",7);this.mdValidityChange=e(this,"mdValidityChange",5);this.internals=this.attachInternals();this.valueMissingLabel="Please select at least one option";this.reserveSupportingSpace=false;this.customValidityMessage="";this.variant="outlined";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.virtualize="auto";this.filterable=false;this.filterMode="substring";this.value=[];this.maxSelected=0;this.showSelectAll=false;this.selectAllLabel="Select all";this.placement="bottom-start";this.matchTriggerWidth=true;this.displayMode="chips";this.chipOverflow="count";this.chipPosition="bottom";this.trigger="field";this.triggerIcon="add";this.triggerLabel="";this.searchPlaceholder="Search…";this.filterLabel="";this.noResultsText="No results";this.noOptionsText="No options";this.searchingLabel="Searching";this.loadingText="Loading…";this.loading=false;this.clearable=false;this.clearIcon="close";this.clearLabel="Clear selection";this.dropdownIcon="arrow_drop_down";this.name="";this.open=false;this.optionsData=[];this.triggerId=`md-multi-select-${++M}`;this.hasTriggerLeading=false;this.hasTriggerTrailing=false;this.liveMessage="";this.hasSlottedTrigger=false;this.query="";this.inlineVisibleCount=Number.POSITIVE_INFINITY;this.inlineOverflowCount=0;this.wiredTrigger=null;this._needsReposition=false;this._focusChipAfterRender=null;this.vc=new o({queryItem:t=>this.el.shadowRoot?.querySelector(`md-menu-item[data-vindex="${t}"]`)??null,requestRender:()=>s(this)});this.providerSet=false;this.selectedLabelMap=new Map;this.searching=false;this.queryText=null;this.defaultValue=[];this.onTriggerSlotChange=()=>{this.computeSlottedTrigger();this.wireSlottedTrigger()};this.lastValidityKey=null;this.loadSeq=0;this._syncGuard=false;this._lastEmit=null;this.toggleOpen=()=>{if(this.isDisabled)return;this.open=!this.open};this.isSelected=t=>this.value.includes(t);this.toggleValue=(t,i)=>{i?.stopPropagation();if(this.isDisabled)return;const e=this.isSelected(t);const s=!e&&this.maxSelected>0&&this.value.length>=this.maxSelected;if(s){const t=i?.target;if(t)t.selected=false;return}const l=e?this.value.filter((i=>i!==t)):[...this.value,t];this.value=l;this.mdChange.emit([...l])};this.removeValue=t=>i=>{i.stopPropagation();if("preventDefault"in i)i.preventDefault();if(this.isDisabled||!this.isSelected(t))return;const e=this.selectedOptions().findIndex((i=>i.value===t));this.value=this.value.filter((i=>i!==t));this.mdRemove.emit(t);this.mdChange.emit([...this.value]);const s=this.selectedOptions().length;this._focusChipAfterRender=s===0?"trigger":Math.min(e,s-1)};this.clearValue=t=>{t.stopPropagation();if(this.isDisabled||this.value.length===0)return;this.value=[];this.mdChange.emit([]);this.mdClear.emit();this.fieldEl?.focus?.()};this.toggleSelectAll=t=>{t?.stopPropagation();if(this.isDisabled)return;const i=this.optionsData.filter((t=>!t.disabled)).map((t=>t.value));const e=i.length>0&&i.every((t=>this.value.includes(t)));this.value=e?[]:i.slice(0,this.maxSelected>0?this.maxSelected:undefined);this.mdChange.emit([...this.value]);const s=t?.target;if(s){const t=i.length>0&&i.every((t=>this.value.includes(t)));s.selected=t;s.indeterminate=!t&&i.some((t=>this.value.includes(t)))}};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.wireViewport()}if(this.filterable){requestAnimationFrame((()=>{const t=this.el.shadowRoot?.querySelector(".md-multi-select__search");t?.focus();void this.menuEl?.setComboboxElement?.(t)}))}};this.handleMenuClose=()=>{this._syncGuard=true;this.open=false;this._syncGuard=false;if(this._lastEmit!=="close"){this._lastEmit="close";this.mdClose.emit()}void this.menuEl?.setComboboxElement?.(null);this.vc.detachViewport();this.vpWired=false;if(this.query){this.query="";const t=this.el.shadowRoot?.querySelector(".md-multi-select__search");if(t)t.value=""}};this.onSearchInput=t=>{const i=t.target.value;this.queryText=null;if(!this.vc.active){this.query=i;return}if(!this.searching){this.searching=true;s(this)}clearTimeout(this.searchDebounce);this.searchDebounce=setTimeout((()=>{this.vc.setQuery(i);this.searching=false;s(this)}),T)};this.renderValueChip=t=>l("md-chip",{key:t.value,part:"chip",exportparts:"remove:chip-remove,label:chip-label",variant:"input",selectable:false,label:t.label,disabled:this.isDisabled,removable:!this.isDisabled,onMdRemove:this.removeValue(t.value),onClick:t=>t.stopPropagation()});this.recomputeInlineOverflow=()=>{if(this.trigger!=="field"||this.displayMode!=="chips-inline"||this.chipOverflow!=="count")return;const t=this.inlineDisplayEl;const i=this.inlineMeasureEl;const e=this.selectedOptions().length;if(!t||!i||e===0)return;const s=t.clientWidth;if(s<=0)return;const l=getComputedStyle(i).columnGap||getComputedStyle(i).gap;const r=parseFloat(l)||4;const a=Array.from(i.querySelectorAll("md-chip"));const n=a.slice(0,e).map((t=>t.getBoundingClientRect().width));if(n.some((t=>t<=0)))return;const o=i.querySelector(".md-multi-select__overflow-chip");const c=o?o.getBoundingClientRect().width:44;let h=0;for(let t=0;t<e;t++)h+=n[t]+(t>0?r:0);let d;if(h<=s+.5){d=e}else{const t=s-c-r;let i=0;d=0;for(let s=0;s<e;s++){const e=n[s]+(s>0?r:0);if(i+e<=t){i+=e;d++}else break}}if(d!==this.inlineVisibleCount||e-d!==this.inlineOverflowCount){this.inlineVisibleCount=d;this.inlineOverflowCount=e-d}}}get optionList(){return b(this.options,"md-multi-select","options")}get isDisabled(){return this.disabled||this.softDisabled}async show(){if(this.isDisabled)return;this.open=true}async close(){this.open=false}async focusTrigger(){this.fieldEl?.focus?.()}async reset(){if(this.value.length===0)return;this.value=[];this.mdChange.emit([])}async loadOptions(t){if(this.virtualize==="never"||!c()){this.loadSeq++;this.vc.reset();this.optionsData=h(d(t));return}const i=++this.loadSeq;this.optionsData=[];this.vc.setFixedRowHeight(this.rowHeight);this.vc.setFilterMode(this.filterMode);const e=await this.vc.load(t);if(i!==this.loadSeq)return;if(!e){this.vc.reset();this.optionsData=h(d(t))}else{this.updateSelectedLabels()}s(this)}async setQuery(t){this.vc.setQuery(t);if(!this.vc.active)this.query=t;this.queryText=t;this.syncSearchField();s(this)}syncSearchField(){if(this.queryText===null)return;const t=this.el.shadowRoot?.querySelector(".md-multi-select__search");if(!t)return;t.value=this.queryText;this.queryText=null}async getLabels(t){return Object.fromEntries(this.vc.getLabels(t))}componentDidLoad(){this.wireSlottedTrigger();if(this.open&&!this.isDisabled){this.menuEl?.show?.({autoFocus:false})}if(typeof ResizeObserver!=="undefined"&&this.frameEl){this._frameRO=new ResizeObserver((()=>{if(this.open)void this.menuEl?.reposition?.()}));this._frameRO.observe(this.frameEl)}}componentWillLoad(){this.refreshOptions();if(this.value.length===0){const t=this.optionsData.filter((t=>t.selected&&!t.disabled)).map((t=>t.value));if(t.length)this.value=t}this.defaultValue=[...this.value];this.syncFormValue();this.hasTriggerLeading=!!this.el.querySelector('[slot="trigger-leading"]');this.hasTriggerTrailing=!!this.el.querySelector('[slot="trigger-trailing"]');this.computeSlottedTrigger()}computeSlottedTrigger(){this.hasSlottedTrigger=this.el.querySelector('[slot="trigger"]')!==null}wireSlottedTrigger(){const t=this.el.querySelector('[slot="trigger"]');if(!t){this.wiredTrigger?.removeEventListener("click",this.toggleOpen);this.wiredTrigger=null;return}if(t!==this.wiredTrigger){this.wiredTrigger?.removeEventListener("click",this.toggleOpen);t.addEventListener("click",this.toggleOpen);this.wiredTrigger=t}if(!t.id)t.id=this.triggerId;else if(t.id!==this.triggerId)this.triggerId=t.id;t.setAttribute("aria-haspopup","listbox");this.fieldEl=t}formResetCallback(){this.value=[...this.defaultValue]}syncFormValue(){this.updateSelectedLabels();this.updateValidity();this.liveMessage=this.value.length?`${this.value.length} selected`:"None selected";this._needsReposition=true;if(!this.value.length){u(this.internals,null);return}const t=new FormData;const i=this.name||"";for(const e of this.value)t.append(i,e);u(this.internals,t)}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.value.length===0){this.internals.setValidity({valueMissing:true},this.errorText||this.valueMissingLabel,this.fieldEl??this.el)}else{this.internals.setValidity({})}this.emitValidityChange()}async getValidity(){return p(this.internals)}emitValidityChange(){const t=p(this.internals);const i=`${t.valid}|${t.validationMessage}`;if(this.lastValidityKey===i)return;const e=this.lastValidityKey!==null;this.lastValidityKey=i;if(e)this.mdValidityChange.emit(t)}async checkValidity(){return f(this.internals)}async reportValidity(){return g(this.internals)}async setCustomValidity(t){this.customValidityMessage=t;this.updateValidity()}refreshOptions(){const t=m(this.el,this.optionList);const i=this.virtualize==="always"||this.virtualize==="auto"&&t.length>O;if(i&&c()&&t.length>0){const i=++this.loadSeq;this.optionsData=[];this.vc.setFixedRowHeight(this.rowHeight);this.vc.setFilterMode(this.filterMode);void this.vc.load(t).then((e=>{if(i!==this.loadSeq)return;if(!e){this.optionsData=t;s(this)}else{this.updateSelectedLabels()}}))}else{this.loadSeq++;this.vc.reset();this.optionsData=t}}updateSelectedLabels(){if(this.vc.active&&this.value.length){this.selectedLabelMap=this.vc.getLabels(this.value)}else{this.selectedLabelMap=new Map}s(this)}onOptionChange(t){t.stopPropagation();this.refreshOptions()}syncMenu(t){if(this._syncGuard||!this.menuEl)return;if(t)this.menuEl.show?.({autoFocus:!this.filterable});else this.menuEl.close?.()}handleKeyDown(t){if(this.isDisabled)return;if(!this.open&&(t.key==="ArrowDown"||t.key==="ArrowUp"||t.key==="Enter"||t.key===" ")){t.preventDefault();this.open=true}else if(this.open&&t.key==="Escape"){t.preventDefault();this.open=false;this.fieldEl?.focus?.()}}wireViewport(){void(async()=>{const t=await(this.menuEl?.getScrollViewport?.())??null;if(!t||this.vpWired)return;this.vpWired=true;await this.vc.attachViewport((async()=>t))})()}componentDidRender(){this.syncSearchField();if(!this.menuEl)return;if(this.vc.active&&!this.providerSet){void this.menuEl.setVirtualProvider?.(this.vc.provider);this.providerSet=true;if(this.open&&this.filterable){const t=this.el.shadowRoot?.querySelector(".md-multi-select__search");void this.menuEl?.setComboboxElement?.(t)}}else if(!this.vc.active&&this.providerSet){void this.menuEl.setVirtualProvider?.(null);this.providerSet=false}if(this.open&&this.vc.active&&!this.vpWired)this.wireViewport();if(this._needsReposition){this._needsReposition=false;if(this.open)requestAnimationFrame((()=>void this.menuEl?.reposition?.()))}if(this._focusChipAfterRender!==null){const t=this._focusChipAfterRender;this._focusChipAfterRender=null;requestAnimationFrame((()=>{if(t==="trigger"){this.fieldEl?.focus?.();return}const i=this.el.shadowRoot?.querySelectorAll(".md-multi-select__chips md-chip, .md-multi-select__inline-chips > md-chip");const e=i?.[t];const s=e?.shadowRoot?.querySelector('[part="remove"]');(s??e??this.fieldEl)?.focus?.()}))}if(this.trigger==="field"&&this.displayMode==="chips-inline"&&this.chipOverflow==="count"){if(typeof ResizeObserver!=="undefined"){if(!this._inlineRO)this._inlineRO=new ResizeObserver(this.recomputeInlineOverflow);this._inlineRO.disconnect();if(this.inlineDisplayEl)this._inlineRO.observe(this.inlineDisplayEl);if(this.inlineMeasureEl)this._inlineRO.observe(this.inlineMeasureEl)}requestAnimationFrame(this.recomputeInlineOverflow)}else{this._inlineRO?.disconnect()}}disconnectedCallback(){this.wiredTrigger?.removeEventListener("click",this.toggleOpen);this.wiredTrigger=null;clearTimeout(this.searchDebounce);this.vc.detachViewport();this._frameRO?.disconnect();this._frameRO=undefined;this._inlineRO?.disconnect();this._inlineRO=undefined}selectedOptions(){if(this.vc.active){return this.value.map((t=>({value:t,label:this.selectedLabelMap.get(t)??t,disabled:false})))}return this.value.map((t=>this.optionsData.find((i=>i.value===t)))).filter((t=>!!t))}countText(){const t=this.value.length;if(t===0)return"";return this.countFormatter?this.countFormatter(t):`${t} selected`}renderTrigger(){return[l("slot",{name:"trigger",onSlotchange:this.onTriggerSlotChange}),this.hasSlottedTrigger?this.renderTriggerMessage():this.trigger==="button"?this.renderButtonTrigger():this.renderFieldTrigger()]}renderFieldTrigger(){const t=this.selectedOptions();const i=t.length>0;const e=this.displayMode==="chips-inline";const s=e?"":this.displayMode==="text"&&i?t.map((t=>t.label)).join(", "):i?this.countText():"";return l("md-text-field",{ref:t=>this.fieldEl=t,id:this.triggerId,class:"md-multi-select__field",part:"field",exportparts:"container:field-container,input:field-input,label:field-label",variant:this.variant,label:this.label,placeholder:i?"":this.placeholder,value:s,readOnly:true,disabled:this.disabled,error:this.error,errorText:this.errorText,reserveSupportingSpace:this.reserveSupportingSpace,supportingText:this.supportingText,required:this.required,density:this.chipPosition==="left"||this.chipPosition==="right"?-3:this.density,appearFocused:this.open,chipsWrap:e&&this.chipOverflow==="wrap",onClick:this.toggleOpen},this.hasTriggerLeading&&l("slot",{name:"trigger-leading",slot:"leading-icon"}),e&&this.renderInlineChips(),this.hasTriggerTrailing&&l("slot",{name:"trigger-trailing",slot:"trailing-icon"}),this.loading?l("span",{slot:"trailing-icon",class:"md-multi-select__loader",part:"loading-spinner"},l("slot",{name:"loader"},l(n,{label:this.loadingText}))):[this.clearable&&i&&!this.isDisabled&&l("button",{type:"button",slot:"trailing-icon",class:"md-multi-select__clear",part:"clear","aria-label":this.clearLabel,onClick:this.clearValue},l("span",{class:"material-symbols-outlined","aria-hidden":"true"},this.clearIcon)),l("span",{slot:"trailing-icon",class:"md-multi-select__caret-box",part:"caret-box","aria-hidden":"true"},l("span",{class:"md-multi-select__caret material-symbols-outlined",part:"caret"},l("slot",{name:"dropdown-icon"},this.dropdownIcon)))])}renderButtonTrigger(){const t=this.error&&this.errorText?this.errorText:this.supportingText;const i=t?`${this.triggerId}-desc`:undefined;return[l("md-button",{ref:t=>this.fieldEl=t,id:this.triggerId,class:"md-multi-select__button",part:"field button",variant:"outlined",size:"xs",icon:this.triggerIcon,loading:this.loading,disabled:this.isDisabled,"aria-haspopup":"listbox","aria-expanded":String(this.open),"aria-controls":this.listboxRendered?`${this.triggerId}-listbox`:undefined,"aria-invalid":this.error?"true":undefined,"aria-describedby":i,onMdClick:this.toggleOpen},this.triggerLabel||this.label),this.renderTriggerMessage()]}renderTriggerMessage(){const t=this.error&&this.errorText?this.errorText:this.supportingText;if(!t)return null;return l("div",{id:this.hasSlottedTrigger?undefined:`${this.triggerId}-desc`,class:{"md-multi-select__button-desc":true,"md-multi-select__button-desc--error":this.error&&!!this.errorText},part:"button-desc",role:this.error?"alert":undefined},t)}get listboxRendered(){return this.open&&!this.loading&&(this.vc.active||this.optionsData.length>0)}renderInlineChips(){const t=this.selectedOptions();if(t.length===0)return null;const i=this.chipOverflow==="wrap";const e=i?t.length:Math.min(t.length,this.inlineVisibleCount);const s=i?0:t.length-e;return l("div",{slot:"chips",class:{"md-multi-select__inline-chips":true,"md-multi-select__inline-chips--wrap":i},part:"chips",role:"group","aria-label":this.label?`${this.label} — selected`:"Selected",ref:t=>this.inlineDisplayEl=t},t.slice(0,e).map(this.renderValueChip),s>0&&l("button",{type:"button",class:"md-multi-select__overflow-chip",part:"overflow-chip","aria-label":`${s} more selected — open to manage`,onClick:t=>{t.stopPropagation();this.toggleOpen()}},"+",s))}renderInlineMeasure(){if(this.trigger!=="field"||this.displayMode!=="chips-inline"||this.chipOverflow!=="count")return null;const t=this.selectedOptions();if(t.length===0)return null;return l("div",{class:"md-multi-select__measure-clip","aria-hidden":"true"},l("div",{class:"md-multi-select__inline-measure",ref:t=>this.inlineMeasureEl=t},t.map(this.renderValueChip),l("span",{class:"md-multi-select__overflow-chip"},"+",t.length)))}renderChips(){if(this.trigger!=="button"&&!this.hasSlottedTrigger&&this.displayMode!=="chips")return null;const t=this.selectedOptions();if(t.length===0)return null;return l("div",{class:"md-multi-select__chips",part:"chips",role:"group","aria-label":this.label?`${this.label} — selected`:"Selected"},t.map((t=>l("md-chip",{key:t.value,part:"chip",exportparts:"remove:chip-remove,label:chip-label",variant:"input",selectable:false,label:t.label,disabled:this.isDisabled,removable:!this.isDisabled,onMdRemove:this.removeValue(t.value),onClick:t=>t.stopPropagation()}))))}renderVirtualOptions(){return l("div",{class:"md-multi-select__listbox",part:"listbox",role:"listbox",id:`${this.triggerId}-listbox`,"aria-multiselectable":"true","aria-label":this.label||"Options"},l("div",{class:"md-multi-select__vspacer",style:{height:`${this.vc.topPad}px`},"aria-hidden":"true"}),this.vc.windowRows.map(((t,i)=>{const e=this.vc.windowStart+i;const s=this.isSelected(t.value);return l("md-menu-item",{key:t.index,id:`${this.triggerId}-opt-${e}`,"data-vindex":e,presentation:"option",type:"checkbox","check-position":"start","keep-open":true,part:s?"option option-selected":"option",disabled:t.disabled,selected:s,headline:t.label,"supporting-text":t.supportingText||"","aria-setsize":this.vc.filteredLength,"aria-posinset":e+1,onMdClick:i=>this.toggleValue(t.value,i)},t.icon?l("span",{slot:"leading-icon",part:"option-icon",class:"material-symbols-outlined md-multi-select__option-icon","aria-hidden":"true"},t.icon):null)})),l("div",{class:"md-multi-select__vspacer",style:{height:`${this.vc.bottomPad}px`},"aria-hidden":"true"}))}renderEmpty(t,i){return l("div",{class:"md-multi-select__empty",part:"empty",role:"status"},l("slot",{name:t},i))}renderMenu(){const t=this.vc.active;const i=this.optionsData.filter((t=>!t.disabled));const e=i.length>0&&i.every((t=>this.value.includes(t.value)));const s=!e&&i.some((t=>this.value.includes(t.value)));const r=this.filterable&&!t?this.query.trim().toLowerCase():"";const a=r?this.optionsData.filter((t=>t.label.toLowerCase().includes(r)||(t.supportingText||"").toLowerCase().includes(r))):this.optionsData;const o=!this.loading&&(t&&this.vc.filteredLength===0||!t&&!!r&&a.length===0);const c=!this.loading&&!t&&!r&&this.optionsData.length===0;const h=t?this.maxHeight??320:this.maxHeight;return l("md-menu",{ref:t=>this.menuEl=t,anchor:this.triggerId,placement:this.placement,"match-anchor-width":this.matchTriggerWidth,"max-height":h,"auto-focus":!this.filterable,"empty-text":"",listbox:true,"list-label":this.label||"Options",part:"menu",exportparts:"surface:menu-surface,empty-text",onMdOpen:this.handleMenuOpen,onMdClose:this.handleMenuClose},l("div",{slot:"header",part:"menu-header",class:"md-multi-select__menu-header"},l("slot",{name:"menu-header"})),this.filterable&&!this.loading&&l("div",{slot:"header",class:"md-multi-select__search-wrap",part:"search-wrap"},l("input",{class:"md-multi-select__search",part:"search",type:"text",role:"combobox","aria-haspopup":"listbox","aria-expanded":String(this.open),"aria-controls":`${this.triggerId}-listbox`,"aria-autocomplete":"list",autocomplete:"off",placeholder:this.searchPlaceholder,"aria-label":this.filterLabel||(this.label?`Filter ${this.label}`:"Filter options"),onInput:this.onSearchInput,onClick:t=>t.stopPropagation()}),this.searching&&l(n,{class:"md-multi-select__search-spinner",part:"search-spinner",label:this.searchingLabel,"aria-hidden":"true"})),this.showSelectAll&&!t&&!this.loading&&this.optionsData.length>0&&l("div",{slot:"header",class:"md-multi-select__select-all",part:"select-all"},l("md-menu-item",{type:"checkbox","check-position":"start",part:"select-all-item","role-override":"checkbox","keep-open":true,headline:this.selectAllLabel,selected:e,indeterminate:s,disabled:this.isDisabled,onMdClick:t=>this.toggleSelectAll(t)})),this.loading?l("div",{class:"md-multi-select__loading",part:"loading-bar",role:"status","aria-label":this.loadingText},l("slot",{name:"menu-loader"},l("md-progress-indicator",{variant:"linear",indeterminate:true,wave:true,part:"loading-progress",label:this.loadingText}))):t?[this.renderVirtualOptions(),o?this.renderEmpty("no-results",this.noResultsText):null]:c?this.renderEmpty("no-options",this.noOptionsText):[l("div",{class:"md-multi-select__listbox",part:"listbox",role:"listbox",id:`${this.triggerId}-listbox`,"aria-multiselectable":"true","aria-label":this.label||"Options"},a.map(((t,i)=>{const e=this.isSelected(t.value);return l("md-menu-item",{key:t.value,id:`${this.triggerId}-opt-${i}`,presentation:"option",type:"checkbox","check-position":"start","keep-open":true,part:e?"option option-selected":"option",disabled:t.disabled,selected:e,headline:t.label,"supporting-text":t.supportingText||"",onMdClick:i=>this.toggleValue(t.value,i)},t.icon?l("span",{slot:"leading-icon",part:"option-icon",class:"material-symbols-outlined md-multi-select__option-icon",style:t.iconColor?{color:t.iconColor}:undefined,"aria-hidden":"true"},t.icon):null)}))),o?this.renderEmpty("no-results",this.noResultsText):null])}render(){return l(r,{key:"340580884c03ad9817ca77aecc04ab49e8108e42",class:{"md-multi-select":true,[`md-multi-select--${this.variant}`]:true,"md-multi-select--open":this.open,"md-multi-select--disabled":this.disabled,"md-multi-select--soft-disabled":this.softDisabled,"md-multi-select--loading":this.loading,[`md-multi-select--display-${this.displayMode}`]:true,"md-multi-select--button":this.trigger==="button"&&!this.hasSlottedTrigger,"md-multi-select--slotted-trigger":this.hasSlottedTrigger,[`md-multi-select--chips-${this.chipPosition}`]:this.trigger==="button"||this.hasSlottedTrigger||this.displayMode==="chips"},"aria-haspopup":"listbox","aria-busy":this.loading?"true":undefined},l("div",{key:"bd96c948ea08429dd636f58cc1fb949b980e26b7",class:"md-multi-select__frame",part:"frame",ref:t=>this.frameEl=t},this.renderTrigger(),this.renderChips()),this.renderInlineMeasure(),this.renderMenu(),l("div",{key:"17c3bd82b3a85653da1a4495b7bd92cd59821778",class:"md-multi-select__sr-live",part:"live-region",role:"status","aria-live":"polite","aria-atomic":"true"},this.liveMessage),l("div",{key:"418afbc111ce7f06a1f661fd1a94769b84f662f3",class:"md-multi-select__options",hidden:true},l("slot",{key:"e7901f07ba5f532fab0906d748a7ad94a83e5014",onSlotchange:()=>this.refreshOptions()})))}static get formAssociated(){return true}get el(){return this}static get watchers(){return{value:[{syncFormValue:0}],required:[{updateValidity:0}],valueMissingLabel:[{updateValidity:0}],options:[{refreshOptions:0}],open:[{syncMenu:0}]}}static get style(){return C()}},[321,"md-multi-select",{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],virtualize:[1],filterable:[4],filterMode:[1,"filter-mode"],rowHeight:[2,"row-height"],value:[1040],maxSelected:[2,"max-selected"],showSelectAll:[516,"show-select-all"],selectAllLabel:[1,"select-all-label"],placement:[1],maxHeight:[2,"max-height"],matchTriggerWidth:[516,"match-trigger-width"],displayMode:[513,"display-mode"],chipOverflow:[513,"chip-overflow"],chipPosition:[513,"chip-position"],trigger:[513],triggerIcon:[1,"trigger-icon"],triggerLabel:[1,"trigger-label"],countFormatter:[16],searchPlaceholder:[1,"search-placeholder"],filterLabel:[1,"filter-label"],noResultsText:[1,"no-results-text"],noOptionsText:[1,"no-options-text"],searchingLabel:[1,"searching-label"],loadingText:[1,"loading-text"],loading:[516],clearable:[516],clearIcon:[1,"clear-icon"],clearLabel:[1,"clear-label"],dropdownIcon:[1,"dropdown-icon"],name:[513],open:[1540],optionsData:[32],triggerId:[32],hasTriggerLeading:[32],hasTriggerTrailing:[32],liveMessage:[32],hasSlottedTrigger:[32],query:[32],inlineVisibleCount:[32],inlineOverflowCount:[32],show:[64],close:[64],focusTrigger:[64],reset:[64],loadOptions:[64],setQuery:[64],getLabels:[64],getValidity:[64],checkValidity:[64],reportValidity:[64],setCustomValidity:[64]},[[0,"mdSelectOptionChange","onOptionChange"],[0,"keydown","handleKeyDown"]],{value:[{syncFormValue:0}],required:[{updateValidity:0}],valueMissingLabel:[{updateValidity:0}],options:[{refreshOptions:0}],open:[{syncMenu:0}]}]);function $(){if(typeof customElements==="undefined"){return}const t=["md-multi-select","md-button","md-chip","md-menu","md-menu-item","md-progress-indicator","md-ripple","md-text-field"];t.forEach((t=>{switch(t){case"md-multi-select":if(!customElements.get(a(t))){customElements.define(a(t),S)}break;case"md-button":if(!customElements.get(a(t))){v()}break;case"md-chip":if(!customElements.get(a(t))){_()}break;case"md-menu":if(!customElements.get(a(t))){y()}break;case"md-menu-item":if(!customElements.get(a(t))){x()}break;case"md-progress-indicator":if(!customElements.get(a(t))){w()}break;case"md-ripple":if(!customElements.get(a(t))){k()}break;case"md-text-field":if(!customElements.get(a(t))){z()}break}}))}$();const j=S;const V=$;export{j as MdMultiSelect,V as defineCustomElement};
|
|
1
|
+
import{p as t,H as i,c as e,f as s,h as l,d as r,t as a}from"./p-CB5yqdO-.js";import{L as n}from"./p-AILMdNGi.js";import{V as o,i as c,n as h,r as d,c as m}from"./p-Bz-JaJcA.js";import{s as u,g as p,c as f,r as g}from"./p-DWxN44zD.js";import{p as b}from"./p-CxhZdOPw.js";import{d as v}from"./p-BTgac9TA.js";import{d as _}from"./p-D9iSpQOZ.js";import{d as y}from"./p-wDoz_U2w.js";import{d as x}from"./p-7H7RuKzd.js";import{d as w}from"./p--hajGo6a.js";import{d as k}from"./p-CvxKUiKT.js";import{d as z}from"./p-CwwjCemf.js";const C=()=>`:host{--md-text-field-padding-inline-end:var(--md-sys-spacing-inset-lg, 16px);--_min-width:var(--md-multi-select-min-width, 200px);--_chip-gap:var(--md-multi-select-chip-gap, var(--md-sys-spacing-gap-xs, 4px));--_chip-radius:var(--md-multi-select-chip-radius, 8px);--_caret-color:var(--md-multi-select-caret-color, var(--md-sys-color-on-surface-variant));--_clear-color:var(--md-multi-select-clear-color, var(--md-sys-color-on-surface-variant));--_option-icon-size:var(--md-multi-select-option-icon-size, 20px);font-family:var(--md-sys-typescale-body-large-font-family, Roboto, sans-serif);display:inline-block;inline-size:var(--md-multi-select-width, 100%);min-inline-size:var(--_min-width);box-sizing:border-box;vertical-align:bottom;position:relative}.md-multi-select__field{display:block;inline-size:100%;cursor:pointer;--md-text-field-cursor:pointer}.md-multi-select__field::part(input){cursor:pointer}:host(.md-multi-select--display-text) .md-multi-select__field::part(input){text-overflow:ellipsis}:host(.md-multi-select--disabled) .md-multi-select__field,:host(.md-multi-select--soft-disabled) .md-multi-select__field{cursor:not-allowed;--md-text-field-cursor:not-allowed}:host(.md-multi-select--disabled) .md-multi-select__field::part(input),:host(.md-multi-select--soft-disabled) .md-multi-select__field::part(input){cursor:not-allowed}.md-multi-select__frame{display:flex;flex-direction:column;gap:var(--md-multi-select-frame-gap, max(6px, calc(8px + var(--md-sys-density-scale, 0) * 0.5px)))}:host(.md-multi-select--chips-top) .md-multi-select__frame{flex-direction:column-reverse;gap:var(--md-multi-select-frame-gap, max(6px, calc(16px + var(--md-sys-density-scale, 0) * 2.5px)))}:host(.md-multi-select--chips-left) .md-multi-select__frame,:host(.md-multi-select--chips-right) .md-multi-select__frame{flex-flow:row nowrap;align-items:center;justify-content:flex-start}:host(.md-multi-select--chips-left) .md-multi-select__chips{order:-1}:host(.md-multi-select--chips-left) .md-multi-select__field,:host(.md-multi-select--chips-right) .md-multi-select__field{inline-size:var(--md-multi-select-trigger-width, max-content);flex:0 0 auto}:host(.md-multi-select--chips-left) ::slotted([slot='trigger']),:host(.md-multi-select--chips-right) ::slotted([slot='trigger']){inline-size:var(--md-multi-select-trigger-width, max-content);flex:0 0 auto}:host(.md-multi-select--chips-left) .md-multi-select__chips,:host(.md-multi-select--chips-right) .md-multi-select__chips{flex:0 1 auto;min-inline-size:0}.md-multi-select__chips{display:flex;flex-wrap:wrap;align-items:center;gap:var(--_chip-gap);max-inline-size:100%}:host(.md-multi-select--chips-bottom) .md-multi-select__chips,:host(.md-multi-select--chips-top) .md-multi-select__chips{contain:inline-size}.md-multi-select__chips md-chip{--md-chip-container-shape:var(--_chip-radius)}.md-multi-select__button{flex:0 0 auto}.md-multi-select__button-desc{padding-block-start:4px;padding-inline:16px;font:var(--md-sys-typescale-body-small, 400 12px/16px Roboto, sans-serif);color:var(--md-sys-color-on-surface-variant, #49454f)}.md-multi-select__button-desc--error{color:var(--md-sys-color-error, #b3261e)}.md-multi-select__sr-live{position:absolute;inline-size:1px;block-size:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.md-multi-select__inline-chips{display:flex;flex-wrap:nowrap;align-items:center;gap:var(--_chip-gap);min-inline-size:0;max-inline-size:100%;flex:1 1 auto;position:relative;overflow:hidden;}.md-multi-select__inline-chips--wrap{flex-wrap:wrap;overflow:visible;padding-block-start:var(--md-multi-select-inline-chips-block-start, var(--md-sys-spacing-gap-xs, 4px));row-gap:var(--_chip-gap)}.md-multi-select__inline-chips md-chip,.md-multi-select__inline-measure md-chip{--md-chip-container-shape:var(--_chip-radius);flex-shrink:0}.md-multi-select__measure-clip{position:absolute;inline-size:0;block-size:0;overflow:hidden;pointer-events:none}.md-multi-select__inline-measure{position:absolute;inset-block-start:0;inset-inline-start:0;display:flex;flex-wrap:nowrap;align-items:center;gap:var(--_chip-gap);inline-size:max-content;visibility:hidden;pointer-events:none;white-space:nowrap}.md-multi-select__overflow-chip{flex-shrink:0;display:inline-flex;align-items:center;block-size:var(--md-multi-select-chip-height, 32px);padding-inline:12px;border:1px solid var(--md-multi-select-chip-outline, var(--md-sys-color-outline-variant, #CAC4D0));border-radius:var(--_chip-radius);background:transparent;color:var(--md-sys-color-on-surface-variant, #49454F);font:500 var(--md-sys-typescale-label-large-size, 14px) / var(--md-sys-typescale-label-large-line-height, 20px) var(--md-sys-typescale-label-large-font, Roboto, sans-serif);white-space:nowrap;cursor:pointer}.md-multi-select__overflow-chip:hover:not(:disabled){background:color-mix(in srgb, var(--md-sys-color-on-surface, #1C1B1F) 8%, transparent)}.md-multi-select__overflow-chip:focus-visible{outline:2px solid var(--md-sys-color-primary, #6750A4);outline-offset:2px}.md-multi-select__clear{display:inline-flex;align-items:center;justify-content:center;inline-size:var(--md-multi-select-clear-size, 28px);block-size:var(--md-multi-select-clear-size, 28px);padding:0;background:var(--md-multi-select-clear-bg, transparent);border:0;border-radius:var(--md-multi-select-clear-radius, 50%);color:var(--_clear-color);cursor:pointer;font-size:var(--md-multi-select-clear-icon-size, 18px);transition:background var(--md-sys-motion-duration-short2, 100ms) ease}.md-multi-select__clear:hover{background:var(--md-multi-select-clear-hover-bg, color-mix(in srgb, var(--md-sys-color-on-surface) 8%, transparent))}.md-multi-select__clear:focus-visible{outline-width:var(--md-multi-select-clear-focus-ring-width, 2px);outline-style:solid;outline-color:var(--md-multi-select-clear-focus-ring-color, var(--md-sys-color-primary));outline-offset:var(--md-multi-select-clear-focus-ring-offset, 1px)}.md-multi-select__clear .material-symbols-outlined{font-size:var(--md-multi-select-clear-icon-size, 18px)}.md-multi-select__field .md-multi-select__caret-box{display:inline-flex;align-items:center;justify-content:center;width:auto;height:auto}.md-multi-select__caret{color:var(--_caret-color);font-size:var(--md-multi-select-caret-size, 24px);line-height:1;transition:transform var(--md-sys-motion-duration-short4, 200ms) var(--md-sys-motion-easing-standard, cubic-bezier(0.2, 0, 0, 1));display:inline-flex;align-items:center;justify-content:center;inline-size:var(--md-multi-select-caret-box-size, 24px);block-size:var(--md-multi-select-caret-box-size, 24px)}:host(.md-multi-select--open) .md-multi-select__caret{transform:rotate(180deg)}.md-multi-select__loader{display:inline-flex;align-items:center;justify-content:center;inline-size:var(--md-multi-select-loader-size, 24px);block-size:var(--md-multi-select-loader-size, 24px);--md-loading-indicator-size:var(--md-multi-select-spinner-size, 22px);--md-loading-indicator-shape-size:var(--md-multi-select-spinner-size, 22px)}.md-multi-select__loading{display:flex;align-items:center;padding-block:var(--md-multi-select-loading-padding, var(--md-sys-spacing-inset-lg, 16px));padding-inline:var(--md-multi-select-loading-padding, var(--md-sys-spacing-inset-lg, 16px))}.md-multi-select__loading md-progress-indicator{inline-size:100%}.md-multi-select__empty{display:flex;justify-content:center;padding:var(--md-multi-select-empty-padding, var(--md-sys-spacing-inset-md, 12px) var(--md-sys-spacing-inset-lg, 16px));color:var(--md-multi-select-empty-color, var(--md-sys-color-on-surface-variant, #49454f));text-align:center;font:var(--md-multi-select-empty-font, var(--md-sys-typescale-body-medium, 400 14px/20px Roboto, sans-serif))}.md-multi-select__select-all{display:block;border-block-end:var(--md-multi-select-select-all-divider-width, 1px) solid var(--md-multi-select-select-all-divider-color, var(--md-sys-color-outline-variant, #cac4d0))}md-menu::part(empty-text){display:block;padding:var(--md-multi-select-empty-padding, var(--md-sys-spacing-inset-md, 12px) var(--md-sys-spacing-inset-lg, 16px));color:var(--md-multi-select-empty-color, var(--md-sys-color-on-surface-variant));text-align:center}.md-multi-select__option-icon{display:inline-flex;align-items:center;justify-content:center;color:var(--md-multi-select-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);line-height:1}@media (prefers-reduced-motion: reduce){.md-multi-select__caret,.md-multi-select__clear{transition:none}}@media (forced-colors: active){.md-multi-select__caret{color:CanvasText}.md-multi-select__clear:focus-visible{outline-color:Highlight}}.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}.md-multi-select__vspacer{display:block;flex:none;pointer-events:none}.md-multi-select__search-wrap{position:relative;display:block}.md-multi-select__search{box-sizing:border-box;width:100%;border:none;outline:none;padding:var(--md-multi-select-search-padding, 12px 44px 12px 16px);font:inherit;color:var(--md-multi-select-search-color, var(--md-sys-color-on-surface, #1d1b20));background:var(--md-multi-select-search-bg, var(--md-sys-color-surface-container, #f3edf7));border-bottom:var(--md-multi-select-search-border-width, 1px) solid var(--md-multi-select-search-border-color, var(--md-sys-color-outline-variant, #cac4d0))}.md-multi-select__search::placeholder{color:var(--md-multi-select-search-placeholder-color, var(--md-sys-color-on-surface-variant, #49454f))}.md-multi-select__search-spinner{position:absolute;inset-block-start:50%;inset-inline-end:12px;margin-block-start:-12px;--md-loading-indicator-size:var(--md-multi-select-search-spinner-size, 24px);--md-loading-indicator-shape-size:18px;pointer-events:none}:host([density='-1']){--md-sys-density-scale:-1}:host([density='-2']){--md-sys-density-scale:-2}:host([density='-3']){--md-sys-density-scale:-3}:host([density='-4']){--md-sys-density-scale:-4}:host([hidden]){display:none !important}`;let M=0;const O=200;const T=180;const S=t(class t extends i{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.mdChange=e(this,"mdChange",7);this.mdOpen=e(this,"mdOpen",7);this.mdClose=e(this,"mdClose",7);this.mdRemove=e(this,"mdRemove",7);this.mdClear=e(this,"mdClear",7);this.mdValidityChange=e(this,"mdValidityChange",5);this.internals=this.attachInternals();this.valueMissingLabel="Please select at least one option";this.reserveSupportingSpace=false;this.customValidityMessage="";this.variant="outlined";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.virtualize="auto";this.filterable=false;this.filterMode="substring";this.value=[];this.maxSelected=0;this.showSelectAll=false;this.selectAllLabel="Select all";this.placement="bottom-start";this.matchTriggerWidth=true;this.displayMode="chips";this.chipOverflow="count";this.chipPosition="bottom";this.trigger="field";this.triggerIcon="add";this.triggerLabel="";this.searchPlaceholder="Search…";this.filterLabel="";this.noResultsText="No results";this.noOptionsText="No options";this.searchingLabel="Searching";this.loadingText="Loading…";this.loading=false;this.clearable=false;this.clearIcon="close";this.clearLabel="Clear selection";this.dropdownIcon="arrow_drop_down";this.name="";this.open=false;this.optionsData=[];this.triggerId=`md-multi-select-${++M}`;this.hasTriggerLeading=false;this.hasTriggerTrailing=false;this.liveMessage="";this.hasSlottedTrigger=false;this.query="";this.inlineVisibleCount=Number.POSITIVE_INFINITY;this.inlineOverflowCount=0;this.wiredTrigger=null;this._needsReposition=false;this._focusChipAfterRender=null;this.vc=new o({queryItem:t=>this.el.shadowRoot?.querySelector(`md-menu-item[data-vindex="${t}"]`)??null,requestRender:()=>s(this)});this.providerSet=false;this.selectedLabelMap=new Map;this.searching=false;this.queryText=null;this.defaultValue=[];this.onTriggerSlotChange=()=>{this.computeSlottedTrigger();this.wireSlottedTrigger()};this.lastValidityKey=null;this.loadSeq=0;this._syncGuard=false;this._lastEmit=null;this.toggleOpen=()=>{if(this.isDisabled)return;this.open=!this.open};this.isSelected=t=>this.value.includes(t);this.toggleValue=(t,i)=>{i?.stopPropagation();if(this.isDisabled)return;const e=this.isSelected(t);const s=!e&&this.maxSelected>0&&this.value.length>=this.maxSelected;if(s){const t=i?.target;if(t)t.selected=false;return}const l=e?this.value.filter((i=>i!==t)):[...this.value,t];this.value=l;this.mdChange.emit([...l])};this.removeValue=t=>i=>{i.stopPropagation();if("preventDefault"in i)i.preventDefault();if(this.isDisabled||!this.isSelected(t))return;const e=this.selectedOptions().findIndex((i=>i.value===t));this.value=this.value.filter((i=>i!==t));this.mdRemove.emit(t);this.mdChange.emit([...this.value]);const s=this.selectedOptions().length;this._focusChipAfterRender=s===0?"trigger":Math.min(e,s-1)};this.clearValue=t=>{t.stopPropagation();if(this.isDisabled||this.value.length===0)return;this.value=[];this.mdChange.emit([]);this.mdClear.emit();this.fieldEl?.focus?.()};this.toggleSelectAll=t=>{t?.stopPropagation();if(this.isDisabled)return;const i=this.optionsData.filter((t=>!t.disabled)).map((t=>t.value));const e=i.length>0&&i.every((t=>this.value.includes(t)));this.value=e?[]:i.slice(0,this.maxSelected>0?this.maxSelected:undefined);this.mdChange.emit([...this.value]);const s=t?.target;if(s){const t=i.length>0&&i.every((t=>this.value.includes(t)));s.selected=t;s.indeterminate=!t&&i.some((t=>this.value.includes(t)))}};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.wireViewport()}if(this.filterable){requestAnimationFrame((()=>{const t=this.el.shadowRoot?.querySelector(".md-multi-select__search");t?.focus();void this.menuEl?.setComboboxElement?.(t)}))}};this.handleMenuClose=()=>{this._syncGuard=true;this.open=false;this._syncGuard=false;if(this._lastEmit!=="close"){this._lastEmit="close";this.mdClose.emit()}void this.menuEl?.setComboboxElement?.(null);this.vc.detachViewport();this.vpWired=false;if(this.query){this.query="";const t=this.el.shadowRoot?.querySelector(".md-multi-select__search");if(t)t.value=""}};this.onSearchInput=t=>{const i=t.target.value;this.queryText=null;if(!this.vc.active){this.query=i;return}if(!this.searching){this.searching=true;s(this)}clearTimeout(this.searchDebounce);this.searchDebounce=setTimeout((()=>{this.vc.setQuery(i);this.searching=false;s(this)}),T)};this.renderValueChip=t=>l("md-chip",{key:t.value,part:"chip",exportparts:"remove:chip-remove,label:chip-label",variant:"input",selectable:false,label:t.label,disabled:this.isDisabled,removable:!this.isDisabled,onMdRemove:this.removeValue(t.value),onClick:t=>t.stopPropagation()});this.recomputeInlineOverflow=()=>{if(this.trigger!=="field"||this.displayMode!=="chips-inline"||this.chipOverflow!=="count")return;const t=this.inlineDisplayEl;const i=this.inlineMeasureEl;const e=this.selectedOptions().length;if(!t||!i||e===0)return;const s=t.clientWidth;if(s<=0)return;const l=getComputedStyle(i).columnGap||getComputedStyle(i).gap;const r=parseFloat(l)||4;const a=Array.from(i.querySelectorAll("md-chip"));const n=a.slice(0,e).map((t=>t.getBoundingClientRect().width));if(n.some((t=>t<=0)))return;const o=i.querySelector(".md-multi-select__overflow-chip");const c=o?o.getBoundingClientRect().width:44;let h=0;for(let t=0;t<e;t++)h+=n[t]+(t>0?r:0);let d;if(h<=s+.5){d=e}else{const t=s-c-r;let i=0;d=0;for(let s=0;s<e;s++){const e=n[s]+(s>0?r:0);if(i+e<=t){i+=e;d++}else break}}if(d!==this.inlineVisibleCount||e-d!==this.inlineOverflowCount){this.inlineVisibleCount=d;this.inlineOverflowCount=e-d}}}get optionList(){return b(this.options,"md-multi-select","options")}get isDisabled(){return this.disabled||this.softDisabled}async show(){if(this.isDisabled)return;this.open=true}async close(){this.open=false}async focusTrigger(){this.fieldEl?.focus?.()}async reset(){if(this.value.length===0)return;this.value=[];this.mdChange.emit([])}async loadOptions(t){if(this.virtualize==="never"||!c()){this.loadSeq++;this.vc.reset();this.optionsData=h(d(t));return}const i=++this.loadSeq;this.optionsData=[];this.vc.setFixedRowHeight(this.rowHeight);this.vc.setFilterMode(this.filterMode);const e=await this.vc.load(t);if(i!==this.loadSeq)return;if(!e){this.vc.reset();this.optionsData=h(d(t))}else{this.updateSelectedLabels()}s(this)}async setQuery(t){this.vc.setQuery(t);if(!this.vc.active)this.query=t;this.queryText=t;this.syncSearchField();s(this)}syncSearchField(){if(this.queryText===null)return;const t=this.el.shadowRoot?.querySelector(".md-multi-select__search");if(!t)return;t.value=this.queryText;this.queryText=null}async getLabels(t){return Object.fromEntries(this.vc.getLabels(t))}componentDidLoad(){this.wireSlottedTrigger();if(this.open&&!this.isDisabled){this.menuEl?.show?.({autoFocus:false})}if(typeof ResizeObserver!=="undefined"&&this.frameEl){this._frameRO=new ResizeObserver((()=>{if(this.open)void this.menuEl?.reposition?.()}));this._frameRO.observe(this.frameEl)}}componentWillLoad(){this.refreshOptions();if(this.value.length===0){const t=this.optionsData.filter((t=>t.selected&&!t.disabled)).map((t=>t.value));if(t.length)this.value=t}this.defaultValue=[...this.value];this.syncFormValue();this.hasTriggerLeading=!!this.el.querySelector('[slot="trigger-leading"]');this.hasTriggerTrailing=!!this.el.querySelector('[slot="trigger-trailing"]');this.computeSlottedTrigger()}computeSlottedTrigger(){this.hasSlottedTrigger=this.el.querySelector('[slot="trigger"]')!==null}wireSlottedTrigger(){const t=this.el.querySelector('[slot="trigger"]');if(!t){this.wiredTrigger?.removeEventListener("click",this.toggleOpen);this.wiredTrigger=null;return}if(t!==this.wiredTrigger){this.wiredTrigger?.removeEventListener("click",this.toggleOpen);t.addEventListener("click",this.toggleOpen);this.wiredTrigger=t}if(!t.id)t.id=this.triggerId;else if(t.id!==this.triggerId)this.triggerId=t.id;t.setAttribute("aria-haspopup","listbox");this.fieldEl=t}formResetCallback(){this.value=[...this.defaultValue]}syncFormValue(){this.updateSelectedLabels();this.updateValidity();this.liveMessage=this.value.length?`${this.value.length} selected`:"None selected";this._needsReposition=true;if(!this.value.length){u(this.internals,null);return}const t=new FormData;const i=this.name||"";for(const e of this.value)t.append(i,e);u(this.internals,t)}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.value.length===0){this.internals.setValidity({valueMissing:true},this.errorText||this.valueMissingLabel,this.fieldEl??this.el)}else{this.internals.setValidity({})}this.emitValidityChange()}async getValidity(){return p(this.internals)}emitValidityChange(){const t=p(this.internals);const i=`${t.valid}|${t.validationMessage}`;if(this.lastValidityKey===i)return;const e=this.lastValidityKey!==null;this.lastValidityKey=i;if(e)this.mdValidityChange.emit(t)}async checkValidity(){return f(this.internals)}async reportValidity(){return g(this.internals)}async setCustomValidity(t){this.customValidityMessage=t;this.updateValidity()}refreshOptions(){const t=m(this.el,this.optionList);const i=this.virtualize==="always"||this.virtualize==="auto"&&t.length>O;if(i&&c()&&t.length>0){const i=++this.loadSeq;this.optionsData=[];this.vc.setFixedRowHeight(this.rowHeight);this.vc.setFilterMode(this.filterMode);void this.vc.load(t).then((e=>{if(i!==this.loadSeq)return;if(!e){this.optionsData=t;s(this)}else{this.updateSelectedLabels()}}))}else{this.loadSeq++;this.vc.reset();this.optionsData=t}}updateSelectedLabels(){if(this.vc.active&&this.value.length){this.selectedLabelMap=this.vc.getLabels(this.value)}else{this.selectedLabelMap=new Map}s(this)}onOptionChange(t){t.stopPropagation();this.refreshOptions()}syncMenu(t){if(this._syncGuard||!this.menuEl)return;if(t)this.menuEl.show?.({autoFocus:!this.filterable});else this.menuEl.close?.()}handleKeyDown(t){if(this.isDisabled)return;if(!this.open&&(t.key==="ArrowDown"||t.key==="ArrowUp"||t.key==="Enter"||t.key===" ")){t.preventDefault();this.open=true}else if(this.open&&t.key==="Escape"){t.preventDefault();this.open=false;this.fieldEl?.focus?.()}}wireViewport(){void(async()=>{const t=await(this.menuEl?.getScrollViewport?.())??null;if(!t||this.vpWired)return;this.vpWired=true;await this.vc.attachViewport((async()=>t))})()}componentDidRender(){this.syncSearchField();if(!this.menuEl)return;if(this.vc.active&&!this.providerSet){void this.menuEl.setVirtualProvider?.(this.vc.provider);this.providerSet=true;if(this.open&&this.filterable){const t=this.el.shadowRoot?.querySelector(".md-multi-select__search");void this.menuEl?.setComboboxElement?.(t)}}else if(!this.vc.active&&this.providerSet){void this.menuEl.setVirtualProvider?.(null);this.providerSet=false}if(this.open&&this.vc.active&&!this.vpWired)this.wireViewport();if(this._needsReposition){this._needsReposition=false;if(this.open)requestAnimationFrame((()=>void this.menuEl?.reposition?.()))}if(this._focusChipAfterRender!==null){const t=this._focusChipAfterRender;this._focusChipAfterRender=null;requestAnimationFrame((()=>{if(t==="trigger"){this.fieldEl?.focus?.();return}const i=this.el.shadowRoot?.querySelectorAll(".md-multi-select__chips md-chip, .md-multi-select__inline-chips > md-chip");const e=i?.[t];const s=e?.shadowRoot?.querySelector('[part="remove"]');(s??e??this.fieldEl)?.focus?.()}))}if(this.trigger==="field"&&this.displayMode==="chips-inline"&&this.chipOverflow==="count"){if(typeof ResizeObserver!=="undefined"){if(!this._inlineRO)this._inlineRO=new ResizeObserver(this.recomputeInlineOverflow);this._inlineRO.disconnect();if(this.inlineDisplayEl)this._inlineRO.observe(this.inlineDisplayEl);if(this.inlineMeasureEl)this._inlineRO.observe(this.inlineMeasureEl)}requestAnimationFrame(this.recomputeInlineOverflow)}else{this._inlineRO?.disconnect()}}disconnectedCallback(){this.wiredTrigger?.removeEventListener("click",this.toggleOpen);this.wiredTrigger=null;clearTimeout(this.searchDebounce);this.vc.detachViewport();this._frameRO?.disconnect();this._frameRO=undefined;this._inlineRO?.disconnect();this._inlineRO=undefined}selectedOptions(){if(this.vc.active){return this.value.map((t=>({value:t,label:this.selectedLabelMap.get(t)??t,disabled:false})))}return this.value.map((t=>this.optionsData.find((i=>i.value===t)))).filter((t=>!!t))}countText(){const t=this.value.length;if(t===0)return"";return this.countFormatter?this.countFormatter(t):`${t} selected`}renderTrigger(){return[l("slot",{name:"trigger",onSlotchange:this.onTriggerSlotChange}),this.hasSlottedTrigger?this.renderTriggerMessage():this.trigger==="button"?this.renderButtonTrigger():this.renderFieldTrigger()]}renderFieldTrigger(){const t=this.selectedOptions();const i=t.length>0;const e=this.displayMode==="chips-inline";const s=e?"":this.displayMode==="text"&&i?t.map((t=>t.label)).join(", "):i?this.countText():"";return l("md-text-field",{ref:t=>this.fieldEl=t,id:this.triggerId,class:"md-multi-select__field",part:"field",exportparts:"container:field-container,input:field-input,label:field-label",variant:this.variant,label:this.label,placeholder:i?"":this.placeholder,value:s,readOnly:true,disabled:this.disabled,error:this.error,errorText:this.errorText,reserveSupportingSpace:this.reserveSupportingSpace,supportingText:this.supportingText,required:this.required,density:this.chipPosition==="left"||this.chipPosition==="right"?-3:this.density,appearFocused:this.open,chipsWrap:e&&this.chipOverflow==="wrap",onClick:this.toggleOpen},this.hasTriggerLeading&&l("slot",{name:"trigger-leading",slot:"leading-icon"}),e&&this.renderInlineChips(),this.hasTriggerTrailing&&l("slot",{name:"trigger-trailing",slot:"trailing-icon"}),this.loading?l("span",{slot:"trailing-icon",class:"md-multi-select__loader",part:"loading-spinner"},l("slot",{name:"loader"},l(n,{label:this.loadingText}))):[this.clearable&&i&&!this.isDisabled&&l("button",{type:"button",slot:"trailing-icon",class:"md-multi-select__clear",part:"clear","aria-label":this.clearLabel,onClick:this.clearValue},l("span",{class:"material-symbols-outlined","aria-hidden":"true"},this.clearIcon)),l("span",{slot:"trailing-icon",class:"md-multi-select__caret-box",part:"caret-box","aria-hidden":"true"},l("span",{class:"md-multi-select__caret material-symbols-outlined",part:"caret"},l("slot",{name:"dropdown-icon"},this.dropdownIcon)))])}renderButtonTrigger(){const t=this.error&&this.errorText?this.errorText:this.supportingText;const i=t?`${this.triggerId}-desc`:undefined;return[l("md-button",{ref:t=>this.fieldEl=t,id:this.triggerId,class:"md-multi-select__button",part:"field button",variant:"outlined",size:"xs",icon:this.triggerIcon,loading:this.loading,disabled:this.isDisabled,"aria-haspopup":"listbox","aria-expanded":String(this.open),"aria-controls":this.listboxRendered?`${this.triggerId}-listbox`:undefined,"aria-invalid":this.error?"true":undefined,"aria-describedby":i,onMdClick:this.toggleOpen},this.triggerLabel||this.label),this.renderTriggerMessage()]}renderTriggerMessage(){const t=this.error&&this.errorText?this.errorText:this.supportingText;if(!t)return null;return l("div",{id:this.hasSlottedTrigger?undefined:`${this.triggerId}-desc`,class:{"md-multi-select__button-desc":true,"md-multi-select__button-desc--error":this.error&&!!this.errorText},part:"button-desc",role:this.error?"alert":undefined},t)}get listboxRendered(){return this.open&&!this.loading&&(this.vc.active||this.optionsData.length>0)}renderInlineChips(){const t=this.selectedOptions();if(t.length===0)return null;const i=this.chipOverflow==="wrap";const e=i?t.length:Math.min(t.length,this.inlineVisibleCount);const s=i?0:t.length-e;return l("div",{slot:"chips",class:{"md-multi-select__inline-chips":true,"md-multi-select__inline-chips--wrap":i},part:"chips",role:"group","aria-label":this.label?`${this.label} — selected`:"Selected",ref:t=>this.inlineDisplayEl=t},t.slice(0,e).map(this.renderValueChip),s>0&&l("button",{type:"button",class:"md-multi-select__overflow-chip",part:"overflow-chip","aria-label":`${s} more selected — open to manage`,onClick:t=>{t.stopPropagation();this.toggleOpen()}},"+",s))}renderInlineMeasure(){if(this.trigger!=="field"||this.displayMode!=="chips-inline"||this.chipOverflow!=="count")return null;const t=this.selectedOptions();if(t.length===0)return null;return l("div",{class:"md-multi-select__measure-clip","aria-hidden":"true"},l("div",{class:"md-multi-select__inline-measure",ref:t=>this.inlineMeasureEl=t},t.map(this.renderValueChip),l("span",{class:"md-multi-select__overflow-chip"},"+",t.length)))}renderChips(){if(this.trigger!=="button"&&!this.hasSlottedTrigger&&this.displayMode!=="chips")return null;const t=this.selectedOptions();if(t.length===0)return null;return l("div",{class:"md-multi-select__chips",part:"chips",role:"group","aria-label":this.label?`${this.label} — selected`:"Selected"},t.map((t=>l("md-chip",{key:t.value,part:"chip",exportparts:"remove:chip-remove,label:chip-label",variant:"input",selectable:false,label:t.label,disabled:this.isDisabled,removable:!this.isDisabled,onMdRemove:this.removeValue(t.value),onClick:t=>t.stopPropagation()}))))}renderVirtualOptions(){return l("div",{class:"md-multi-select__listbox",part:"listbox",role:"listbox",id:`${this.triggerId}-listbox`,"aria-multiselectable":"true","aria-label":this.label||"Options"},l("div",{class:"md-multi-select__vspacer",style:{height:`${this.vc.topPad}px`},"aria-hidden":"true"}),this.vc.windowRows.map(((t,i)=>{const e=this.vc.windowStart+i;const s=this.isSelected(t.value);return l("md-menu-item",{key:t.index,id:`${this.triggerId}-opt-${e}`,"data-vindex":e,presentation:"option",type:"checkbox","check-position":"start","keep-open":true,part:s?"option option-selected":"option",disabled:t.disabled,selected:s,headline:t.label,"supporting-text":t.supportingText||"","aria-setsize":this.vc.filteredLength,"aria-posinset":e+1,onMdClick:i=>this.toggleValue(t.value,i)},t.icon?l("span",{slot:"leading-icon",part:"option-icon",class:"material-symbols-outlined md-multi-select__option-icon","aria-hidden":"true"},t.icon):null)})),l("div",{class:"md-multi-select__vspacer",style:{height:`${this.vc.bottomPad}px`},"aria-hidden":"true"}))}renderEmpty(t,i){return l("div",{class:"md-multi-select__empty",part:"empty",role:"status"},l("slot",{name:t},i))}renderMenu(){const t=this.vc.active;const i=this.optionsData.filter((t=>!t.disabled));const e=i.length>0&&i.every((t=>this.value.includes(t.value)));const s=!e&&i.some((t=>this.value.includes(t.value)));const r=this.filterable&&!t?this.query.trim().toLowerCase():"";const a=r?this.optionsData.filter((t=>t.label.toLowerCase().includes(r)||(t.supportingText||"").toLowerCase().includes(r))):this.optionsData;const o=!this.loading&&(t&&this.vc.filteredLength===0||!t&&!!r&&a.length===0);const c=!this.loading&&!t&&!r&&this.optionsData.length===0;const h=t?this.maxHeight??320:this.maxHeight;return l("md-menu",{ref:t=>this.menuEl=t,anchor:this.triggerId,placement:this.placement,"match-anchor-width":this.matchTriggerWidth,"max-height":h,"auto-focus":!this.filterable,"empty-text":"",listbox:true,"list-label":this.label||"Options",part:"menu",exportparts:"surface:menu-surface,empty-text",onMdOpen:this.handleMenuOpen,onMdClose:this.handleMenuClose},l("div",{slot:"header",part:"menu-header",class:"md-multi-select__menu-header"},l("slot",{name:"menu-header"})),this.filterable&&!this.loading&&l("div",{slot:"header",class:"md-multi-select__search-wrap",part:"search-wrap"},l("input",{class:"md-multi-select__search",part:"search",type:"text",role:"combobox","aria-haspopup":"listbox","aria-expanded":String(this.open),"aria-controls":`${this.triggerId}-listbox`,"aria-autocomplete":"list",autocomplete:"off",placeholder:this.searchPlaceholder,"aria-label":this.filterLabel||(this.label?`Filter ${this.label}`:"Filter options"),onInput:this.onSearchInput,onClick:t=>t.stopPropagation()}),this.searching&&l(n,{class:"md-multi-select__search-spinner",part:"search-spinner",label:this.searchingLabel,"aria-hidden":"true"})),this.showSelectAll&&!t&&!this.loading&&this.optionsData.length>0&&l("div",{slot:"header",class:"md-multi-select__select-all",part:"select-all"},l("md-menu-item",{type:"checkbox","check-position":"start",part:"select-all-item","role-override":"checkbox","keep-open":true,headline:this.selectAllLabel,selected:e,indeterminate:s,disabled:this.isDisabled,onMdClick:t=>this.toggleSelectAll(t)})),this.loading?l("div",{class:"md-multi-select__loading",part:"loading-bar",role:"status","aria-label":this.loadingText},l("slot",{name:"menu-loader"},l("md-progress-indicator",{variant:"linear",indeterminate:true,wave:true,part:"loading-progress",label:this.loadingText}))):t?[this.renderVirtualOptions(),o?this.renderEmpty("no-results",this.noResultsText):null]:c?this.renderEmpty("no-options",this.noOptionsText):[l("div",{class:"md-multi-select__listbox",part:"listbox",role:"listbox",id:`${this.triggerId}-listbox`,"aria-multiselectable":"true","aria-label":this.label||"Options"},a.map(((t,i)=>{const e=this.isSelected(t.value);return l("md-menu-item",{key:t.value,id:`${this.triggerId}-opt-${i}`,presentation:"option",type:"checkbox","check-position":"start","keep-open":true,part:e?"option option-selected":"option",disabled:t.disabled,selected:e,headline:t.label,"supporting-text":t.supportingText||"",onMdClick:i=>this.toggleValue(t.value,i)},t.icon?l("span",{slot:"leading-icon",part:"option-icon",class:"material-symbols-outlined md-multi-select__option-icon",style:t.iconColor?{color:t.iconColor}:undefined,"aria-hidden":"true"},t.icon):null)}))),o?this.renderEmpty("no-results",this.noResultsText):null])}render(){return l(r,{key:"340580884c03ad9817ca77aecc04ab49e8108e42",class:{"md-multi-select":true,[`md-multi-select--${this.variant}`]:true,"md-multi-select--open":this.open,"md-multi-select--disabled":this.disabled,"md-multi-select--soft-disabled":this.softDisabled,"md-multi-select--loading":this.loading,[`md-multi-select--display-${this.displayMode}`]:true,"md-multi-select--button":this.trigger==="button"&&!this.hasSlottedTrigger,"md-multi-select--slotted-trigger":this.hasSlottedTrigger,[`md-multi-select--chips-${this.chipPosition}`]:this.trigger==="button"||this.hasSlottedTrigger||this.displayMode==="chips"},"aria-haspopup":"listbox","aria-busy":this.loading?"true":undefined},l("div",{key:"bd96c948ea08429dd636f58cc1fb949b980e26b7",class:"md-multi-select__frame",part:"frame",ref:t=>this.frameEl=t},this.renderTrigger(),this.renderChips()),this.renderInlineMeasure(),this.renderMenu(),l("div",{key:"17c3bd82b3a85653da1a4495b7bd92cd59821778",class:"md-multi-select__sr-live",part:"live-region",role:"status","aria-live":"polite","aria-atomic":"true"},this.liveMessage),l("div",{key:"418afbc111ce7f06a1f661fd1a94769b84f662f3",class:"md-multi-select__options",hidden:true},l("slot",{key:"e7901f07ba5f532fab0906d748a7ad94a83e5014",onSlotchange:()=>this.refreshOptions()})))}static get formAssociated(){return true}get el(){return this}static get watchers(){return{value:[{syncFormValue:0}],required:[{updateValidity:0}],valueMissingLabel:[{updateValidity:0}],options:[{refreshOptions:0}],open:[{syncMenu:0}]}}static get style(){return C()}},[321,"md-multi-select",{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],virtualize:[1],filterable:[4],filterMode:[1,"filter-mode"],rowHeight:[2,"row-height"],value:[1040],maxSelected:[2,"max-selected"],showSelectAll:[516,"show-select-all"],selectAllLabel:[1,"select-all-label"],placement:[1],maxHeight:[2,"max-height"],matchTriggerWidth:[516,"match-trigger-width"],displayMode:[513,"display-mode"],chipOverflow:[513,"chip-overflow"],chipPosition:[513,"chip-position"],trigger:[513],triggerIcon:[1,"trigger-icon"],triggerLabel:[1,"trigger-label"],countFormatter:[16],searchPlaceholder:[1,"search-placeholder"],filterLabel:[1,"filter-label"],noResultsText:[1,"no-results-text"],noOptionsText:[1,"no-options-text"],searchingLabel:[1,"searching-label"],loadingText:[1,"loading-text"],loading:[516],clearable:[516],clearIcon:[1,"clear-icon"],clearLabel:[1,"clear-label"],dropdownIcon:[1,"dropdown-icon"],name:[513],open:[1540],optionsData:[32],triggerId:[32],hasTriggerLeading:[32],hasTriggerTrailing:[32],liveMessage:[32],hasSlottedTrigger:[32],query:[32],inlineVisibleCount:[32],inlineOverflowCount:[32],show:[64],close:[64],focusTrigger:[64],reset:[64],loadOptions:[64],setQuery:[64],getLabels:[64],getValidity:[64],checkValidity:[64],reportValidity:[64],setCustomValidity:[64]},[[0,"mdSelectOptionChange","onOptionChange"],[0,"keydown","handleKeyDown"]],{value:[{syncFormValue:0}],required:[{updateValidity:0}],valueMissingLabel:[{updateValidity:0}],options:[{refreshOptions:0}],open:[{syncMenu:0}]}]);function $(){if(typeof customElements==="undefined"){return}const t=["md-multi-select","md-button","md-chip","md-menu","md-menu-item","md-progress-indicator","md-ripple","md-text-field"];t.forEach((t=>{switch(t){case"md-multi-select":if(!customElements.get(a(t))){customElements.define(a(t),S)}break;case"md-button":if(!customElements.get(a(t))){v()}break;case"md-chip":if(!customElements.get(a(t))){_()}break;case"md-menu":if(!customElements.get(a(t))){y()}break;case"md-menu-item":if(!customElements.get(a(t))){x()}break;case"md-progress-indicator":if(!customElements.get(a(t))){w()}break;case"md-ripple":if(!customElements.get(a(t))){k()}break;case"md-text-field":if(!customElements.get(a(t))){z()}break}}))}$();const j=S;const V=$;export{j as MdMultiSelect,V as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=md-multi-select.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as t,H as e,c as s,h as n,d as o,t as i}from"./p-CB5yqdO-.js";const
|
|
1
|
+
import{p as t,H as e,c as s,h as n,d as o,t as i}from"./p-CB5yqdO-.js";const d=()=>`:host{display:inline-grid;grid-auto-flow:column;grid-auto-columns:1fr;box-sizing:border-box;vertical-align:middle}@media (prefers-reduced-motion: reduce){:host{transition:none}}@media (forced-colors: active){:host{forced-color-adjust:none}}:host([hidden]){display:none !important}`;const r=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.mdChange=s(this,"mdChange",7);this.multiselect=false;this.density=0;this.handleSlotChange=()=>{this.syncSegments()}}onPropsChange(){this.syncSegments()}componentDidLoad(){this.syncSegments()}handleSegmentClick(t){t.stopPropagation();const e=this.getSegments();const s=t.target;if(!s)return;const{selected:n}=t.detail;if(this.multiselect){s.selected=n}else{for(const t of e){t.selected=t===s}}this.mdChange.emit(e.filter((t=>t.selected)).map((t=>t.value)))}getSegments(){return Array.from(this.el.querySelectorAll("md-segmented-button"))}syncSegments(){const t=this.getSegments();const e=t.length;for(let s=0;s<e;s++){const n=t[s];n.segmentIndex=s;n.segmentTotal=e;n.segmentDensity=this.density;n.segmentMultiselect=this.multiselect}}render(){return n(o,{key:"2a8bf244149352d69dfb03dd32ef0dcc24487dc4",class:{"md-segmented-button-set":true,[`md-segmented-button-set--density-${Math.abs(this.density)}`]:this.density!==0},role:this.multiselect?"group":"radiogroup"},n("slot",{key:"2d6cfc8e5a79bf9dc7d4cf92d0a087b9401bff46",onSlotchange:this.handleSlotChange}))}get el(){return this}static get watchers(){return{multiselect:[{onPropsChange:0}],density:[{onPropsChange:0}]}}static get style(){return d()}},[257,"md-segmented-button-set",{multiselect:[4],density:[514]},[[0,"mdSegmentClick","handleSegmentClick"]],{multiselect:[{onPropsChange:0}],density:[{onPropsChange:0}]}]);function c(){if(typeof customElements==="undefined"){return}const t=["md-segmented-button-set"];t.forEach((t=>{switch(t){case"md-segmented-button-set":if(!customElements.get(i(t))){customElements.define(i(t),r)}break}}))}c();const a=r;const h=c;export{a as MdSegmentedButtonSet,h as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=md-segmented-button-set.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["mdSegmentedButtonSetCss","MdSegmentedButtonSet","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","multiselect","density","
|
|
1
|
+
{"version":3,"names":["mdSegmentedButtonSetCss","MdSegmentedButtonSet","__stencil_proxyCustomElement","HTMLElement","constructor","registerHost","this","multiselect","density","handleSlotChange","syncSegments","onPropsChange","componentDidLoad","handleSegmentClick","event","stopPropagation","segments","getSegments","clicked","target","selected","detail","seg","mdChange","emit","filter","s","map","value","Array","from","el","querySelectorAll","total","length","i","segmentIndex","segmentTotal","segmentDensity","segmentMultiselect","render","h","Host","key","class","Math","abs","role","onSlotchange"],"sources":["src/components/md-segmented-button-set/md-segmented-button-set.css?tag=md-segmented-button-set&encapsulation=shadow","src/components/md-segmented-button-set/md-segmented-button-set.tsx"],"sourcesContent":["/* ==========================================================\n md-segmented-button-set — Container for segmented buttons\n Spec: https://m3.material.io/components/segmented-buttons/specs\n ========================================================== */\n\n:host {\n display: inline-grid;\n grid-auto-flow: column;\n grid-auto-columns: 1fr;\n box-sizing: border-box;\n vertical-align: middle;\n}\n\n@media (prefers-reduced-motion: reduce) {\n :host {\n transition: none;\n }\n}\n\n@media (forced-colors: active) {\n :host {\n forced-color-adjust: none;\n }\n}\n\n/* ==========================================================\n HIDDEN\n `[hidden]` is a UA-stylesheet rule, and every `:host` display\n declaration above is an AUTHOR rule — author origin beats UA, so without\n this guard `el.hidden = true` left the component fully laid out.\n `!important` because state rules in this file set `display` at equal or\n higher specificity than `:host([hidden])`.\n ========================================================== */\n:host([hidden]) {\n display: none !important;\n}\n","import { Component, Host, h, Prop, Element, Event, EventEmitter, Listen, Watch } from '@stencil/core';\nimport { SegmentElement } from '../../utils/types';\n\n@Component({\n tag: 'md-segmented-button-set',\n styleUrl: 'md-segmented-button-set.css',\n shadow: true,\n})\nexport class MdSegmentedButtonSet {\n @Element() el!: HTMLElement;\n\n /** Single-select or multi-select mode */\n @Prop() multiselect: boolean = false;\n\n /** Density: 0 = 40px, -1 = 36px, -2 = 32px, -3 = 28px, -4 = 24px */\n @Prop({ reflect: true }) density: 0 | -1 | -2 | -3 | -4 = 0;\n\n /** Fires when the set of selected segment values changes */\n @Event() mdChange: EventEmitter<string[]>;\n\n @Watch('multiselect')\n @Watch('density')\n onPropsChange() {\n this.syncSegments();\n }\n\n componentDidLoad() {\n this.syncSegments();\n }\n\n @Listen('mdSegmentClick')\n handleSegmentClick(event: CustomEvent<{ value: string; selected: boolean }>) {\n event.stopPropagation();\n const segments = this.getSegments();\n // Match by element identity, not by `.value`. The child segment\n // emits `mdSegmentClick` from its own host, and the event re-targets\n // to that <md-segmented-button> as it crosses the shadow boundary\n // into this set. Matching by value would break whenever segments\n // share the default value of '' (which is the common case when\n // consumers omit the `value` prop — every segment would toggle\n // together because every `'' === ''` is true).\n const clicked = event.target as SegmentElement | null;\n if (!clicked) return;\n\n const { selected } = event.detail;\n\n if (this.multiselect) {\n clicked.selected = selected;\n } else {\n for (const seg of segments) {\n seg.selected = seg === clicked;\n }\n }\n\n this.mdChange.emit(\n segments.filter(s => s.selected).map(s => s.value),\n );\n }\n\n private getSegments(): SegmentElement[] {\n return Array.from(this.el.querySelectorAll('md-segmented-button')) as unknown as SegmentElement[];\n }\n\n /**\n * Re-assign positions whenever the slotted segments change.\n *\n * `componentDidLoad` alone is not enough, and the gap is visible rather than\n * theoretical. A segment defaults to `segmentIndex: 0` of `segmentTotal: 1`,\n * which makes it BOTH first and last — so an unsynced segment renders fully\n * rounded on every edge. Replace a set's children after it has loaded and\n * every segment in it becomes a lone pill: the joined bar visibly falls apart,\n * and nothing about it looks like a stale index.\n *\n * Any consumer that renders segments dynamically hits this — a set whose\n * options come from state, a framework re-render, or `replaceChildren()`. The\n * showcase dock rebuilds its controls that way and shows the bug on the first\n * re-render after navigation.\n */\n private handleSlotChange = () => {\n this.syncSegments();\n };\n\n private syncSegments() {\n const segments = this.getSegments();\n const total = segments.length;\n\n for (let i = 0; i < total; i++) {\n const seg = segments[i];\n seg.segmentIndex = i;\n seg.segmentTotal = total;\n seg.segmentDensity = this.density;\n seg.segmentMultiselect = this.multiselect;\n }\n }\n\n render() {\n return (\n <Host\n class={{\n 'md-segmented-button-set': true,\n [`md-segmented-button-set--density-${Math.abs(this.density)}`]: this.density !== 0,\n }}\n role={this.multiselect ? 'group' : 'radiogroup'}\n >\n <slot onSlotchange={this.handleSlotChange}></slot>\n </Host>\n );\n }\n}\n"],"mappings":"uEAAA,MAAMA,EAA0B,IAAM,2R,MCQzBC,EAAoBC,EAAA,MAAAD,UAAAE,EALjC,WAAAC,CAAAC,G,qGASUC,KAAAC,YAAuB,MAGND,KAAAE,QAAiC,EA+DlDF,KAAAG,iBAAmB,KACzBH,KAAKI,cAAc,CA6BtB,CAtFC,aAAAC,GACEL,KAAKI,c,CAGP,gBAAAE,GACEN,KAAKI,c,CAIP,kBAAAG,CAAmBC,GACjBA,EAAMC,kBACN,MAAMC,EAAWV,KAAKW,cAQtB,MAAMC,EAAUJ,EAAMK,OACtB,IAAKD,EAAS,OAEd,MAAME,SAAEA,GAAaN,EAAMO,OAE3B,GAAIf,KAAKC,YAAa,CACpBW,EAAQE,SAAWA,C,KACd,CACL,IAAK,MAAME,KAAON,EAAU,CAC1BM,EAAIF,SAAWE,IAAQJ,C,EAI3BZ,KAAKiB,SAASC,KACZR,EAASS,QAAOC,GAAKA,EAAEN,WAAUO,KAAID,GAAKA,EAAEE,Q,CAIxC,WAAAX,GACN,OAAOY,MAAMC,KAAKxB,KAAKyB,GAAGC,iBAAiB,uB,CAsBrC,YAAAtB,GACN,MAAMM,EAAWV,KAAKW,cACtB,MAAMgB,EAAQjB,EAASkB,OAEvB,IAAK,IAAIC,EAAI,EAAGA,EAAIF,EAAOE,IAAK,CAC9B,MAAMb,EAAMN,EAASmB,GACrBb,EAAIc,aAAeD,EACnBb,EAAIe,aAAeJ,EACnBX,EAAIgB,eAAiBhC,KAAKE,QAC1Bc,EAAIiB,mBAAqBjC,KAAKC,W,EAIlC,MAAAiC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHC,MAAO,CACL,0BAA2B,KAC3B,CAAC,oCAAoCC,KAAKC,IAAIxC,KAAKE,YAAaF,KAAKE,UAAY,GAEnFuC,KAAMzC,KAAKC,YAAc,QAAU,cAEnCkC,EAAA,QAAAE,IAAA,2CAAMK,aAAc1C,KAAKG,mB","ignoreList":[]}
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as s,H as t,c as a,h as e,d as i,t as n}from"./p-CB5yqdO-.js";import{d as o}from"./p-C1RN8YA1.js";import{d as c}from"./p-DbKoLpkd.js";import{d as r}from"./p-CvxKUiKT.js";const d=()=>`:host{--_container-color:var(--md-snackbar-container-color, var(--md-sys-color-inverse-surface, #313033));--_message-color:var(--md-snackbar-message-color, var(--md-sys-color-inverse-on-surface, #F4EFF4));--_action-color:var(--md-snackbar-action-color, var(--md-sys-color-inverse-primary, #D0BCFF));--_close-color:var(--md-snackbar-close-color, var(--md-sys-color-inverse-on-surface, #F4EFF4));--_container-shape:var(--md-snackbar-container-shape, var(--md-sys-shape-corner-extra-small, 4px));--_min-width:var(--md-snackbar-min-width, 288px);--_max-width:var(--md-snackbar-max-width, 568px);--_slide-from:translateY(100%);display:flex;position:fixed;inset-block-start:0;inset-block-end:0;inset-inline-start:0;inset-inline-end:0;padding:var(--md-sys-spacing-inset-xl, 24px);align-items:flex-end;justify-content:center;z-index:calc(var(--md-sys-z-index-snackbar, 2000) + var(--_stack-order, 0));pointer-events:none;visibility:hidden;opacity:0;transform:var(--_slide-from);transition:opacity var(--md-sys-motion-duration-short4, 200ms) var(--md-sys-motion-easing-emphasized-accelerate, cubic-bezier(0.3, 0, 0.8, 0.15)), transform var(--md-sys-motion-duration-short4, 200ms) var(--md-sys-motion-easing-emphasized-accelerate, cubic-bezier(0.3, 0, 0.8, 0.15)), visibility 0ms linear var(--md-sys-motion-duration-short4, 200ms)}:host(.md-snackbar--open){visibility:visible;opacity:1;transform:translate(0, 0);transition:opacity var(--md-sys-motion-duration-medium1, 250ms) var(--md-sys-motion-easing-emphasized-decelerate, cubic-bezier(0.05, 0.7, 0.1, 1)), transform var(--md-sys-motion-duration-medium1, 250ms) var(--md-sys-motion-easing-emphasized-decelerate, cubic-bezier(0.05, 0.7, 0.1, 1)), visibility 0ms linear 0ms}:host(.md-snackbar--open) .md-snackbar__surface{pointer-events:auto}:host(.md-snackbar--bottom){align-items:flex-end;justify-content:center}:host(.md-snackbar--bottom-start){align-items:flex-end;justify-content:flex-start}:host(.md-snackbar--bottom-end){align-items:flex-end;justify-content:flex-end}:host(.md-snackbar--top),:host(.md-snackbar--top-start),:host(.md-snackbar--top-end){--_slide-from:translateY(-100%)}:host(.md-snackbar--top){align-items:flex-start;justify-content:center}:host(.md-snackbar--top-start){align-items:flex-start;justify-content:flex-start}:host(.md-snackbar--top-end){align-items:flex-start;justify-content:flex-end}:host(.md-snackbar--start),:host(.md-snackbar--end),:host(.md-snackbar--center){--_slide-from:translate(0, 0)}:host(.md-snackbar--start){align-items:center;justify-content:flex-start}:host(.md-snackbar--end){align-items:center;justify-content:flex-end}:host(.md-snackbar--center){align-items:center;justify-content:center}.md-snackbar__surface{display:flex;align-items:center;min-inline-size:var(--_min-width);max-inline-size:var(--_max-width);min-block-size:max(36px, calc(48px + var(--md-sys-density-scale, 0) * 3px));padding-inline-start:max(8px, calc(16px + var(--md-sys-density-scale, 0) * 2px));padding-inline-end:max(8px, calc(16px + var(--md-sys-density-scale, 0) * 2px));background-color:var(--_container-color);color:var(--_message-color);border-radius:var(--_container-shape);box-shadow:var(--md-sys-elevation-3);box-sizing:border-box}:host(.md-snackbar--with-action:not(.md-snackbar--with-close)) .md-snackbar__surface{padding-inline-end:var(--md-sys-spacing-inset-sm, 8px)}:host(.md-snackbar--with-close) .md-snackbar__surface{padding-inline-end:var(--md-sys-spacing-inset-md, 12px)}@media (max-width: 599px){:host{padding:var(--md-sys-spacing-inset-lg, 16px)}.md-snackbar__surface{inline-size:100%;min-inline-size:0;max-inline-size:100%}}.md-snackbar__message{flex:1;padding-block:max(6px, calc(14px + var(--md-sys-density-scale, 0) * 2px));font-family:var(--md-sys-typescale-body-medium-font-family, Roboto, sans-serif);font-size:max(12px, calc(14px + var(--md-sys-density-scale, 0) * 0.5px));font-weight:var(--md-sys-typescale-body-medium-font-weight, 400);line-height:max(16px, calc(20px + var(--md-sys-density-scale, 0) * 1px));letter-spacing:var(--md-sys-typescale-body-medium-letter-spacing, 0.25px);color:inherit}.md-snackbar__actions{display:flex;align-items:center;flex-shrink:0}.md-snackbar__action-btn{flex-shrink:0;--md-button-label-color:var(--_action-color);--md-button-icon-color:var(--_action-color);--md-ripple-color:var(--_action-color)}.md-snackbar__close{display:flex;align-items:center;flex-shrink:0;outline:none;-webkit-tap-highlight-color:transparent}.md-snackbar__close md-icon-button{--md-icon-button-icon-color:var(--_close-color);--md-icon-button-container-width:max(32px, calc(40px + var(--md-sys-density-scale, 0) * 4px));--md-icon-button-container-height:max(32px, calc(40px + var(--md-sys-density-scale, 0) * 4px));--md-icon-button-icon-size:max(18px, calc(24px + var(--md-sys-density-scale, 0) * 1px))}:host(.md-snackbar--stacked) .md-snackbar__surface{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;align-items:start;column-gap:var(--md-sys-spacing-gap-md, 12px);row-gap:6px;min-block-size:68px;padding-block-start:var(--md-sys-spacing-inset-sm, 8px);padding-block-end:var(--md-sys-spacing-inset-sm, 8px)}:host(.md-snackbar--stacked) .md-snackbar__message{grid-column:1;grid-row:1;padding-block-end:var(--md-sys-spacing-inset-xs, 4px)}:host(.md-snackbar--stacked) .md-snackbar__close{grid-column:2;grid-row:1;align-self:start;margin-inline-start:0;margin-block-start:var(--md-sys-spacing-inset-xs, 4px);padding-block-start:0}:host(.md-snackbar--stacked) .md-snackbar__actions{grid-column:1 / -1;grid-row:2;justify-self:end}::slotted([slot="action"]){color:var(--_action-color)}::slotted([slot="close"]){color:var(--_close-color)}@media (prefers-reduced-motion: reduce){:host,:host(.md-snackbar--open){transition:none}}@media (forced-colors: active){.md-snackbar__surface{border:1px solid CanvasText}.md-snackbar__action-btn{color:LinkText}.md-snackbar__action-btn:focus-visible{outline-color:Highlight}}:host([density='-1']){--md-sys-density-scale:-1}:host([density='-2']){--md-sys-density-scale:-2}:host([density='-3']){--md-sys-density-scale:-3}:host([density='-4']){--md-sys-density-scale:-4}:host([hidden]){display:none !important}`;const m=s(class s extends t{constructor(s){super();if(s!==false){this.__registerHost()}this.__attachShadow();this.mdOpen=a(this,"mdOpen",7);this.mdClose=a(this,"mdClose",7);this.mdAction=a(this,"mdAction",7);this.open=false;this.message="";this.action="";this.closeable=false;this.autoHide=true;this.autoHideDuration=4e3;this.position="bottom";this.stacked=false;this.politeness="polite";this.dismissLabel="Dismiss";this.density=0;this.hasSlottedAction=false;this.hasSlottedClose=false;this.hasSlottedDefault=false;this.timerPaused=false;this.handleActionClick=()=>{this.mdAction.emit();this.startAutoHide()};this.handleCloseClick=()=>{this.dismissAfterRipple("close")};this.handleEscape=s=>{if(s.key==="Escape"&&this.open&&this.closeable){s.preventDefault();this.handleCloseClick()}};this.pauseAutoHide=()=>{if(this.autoHideTimer!=null&&this.open){this.timerPaused=true;this.clearAutoHide()}};this.resumeAutoHide=()=>{if(this.timerPaused&&this.open){this.timerPaused=false;this.startAutoHide()}};this.handleSurfaceFocusOut=s=>{const t=s.currentTarget;if(s.relatedTarget&&t.contains(s.relatedTarget)){return}this.resumeAutoHide()}}get isAutoHide(){return this.autoHide!==false&&this.autoHide!=="false"}componentDidLoad(){const s=this.el.shadowRoot;if(!s)return;const t=s.querySelector("slot:not([name])");const a=s.querySelector('slot[name="action"]');const e=s.querySelector('slot[name="close"]');t?.addEventListener("slotchange",(()=>{this.hasSlottedDefault=t.assignedNodes().some((s=>s.nodeType===Node.ELEMENT_NODE||s.nodeType===Node.TEXT_NODE&&s.textContent?.trim()!==""))}));a?.addEventListener("slotchange",(()=>{this.hasSlottedAction=a.assignedElements().length>0}));e?.addEventListener("slotchange",(()=>{this.hasSlottedClose=e.assignedElements().length>0}));if(this.open){this.onOpenChange(true,false)}}disconnectedCallback(){this.clearAutoHide();if(this.rippleDismissTimer!=null){clearTimeout(this.rippleDismissTimer);this.rippleDismissTimer=undefined}window.removeEventListener("keydown",this.handleEscape)}raiseAboveOpenPeers(){const s=Array.from(document.querySelectorAll("md-snackbar")).filter((s=>s!==this.el&&s.open));const t=s.reduce(((s,t)=>Math.max(s,Number(t.style.getPropertyValue("--_stack-order"))||0)),0);this.el.style.setProperty("--_stack-order",String(t+1))}onOpenChange(s,t){if(s){this.raiseAboveOpenPeers();this.mdOpen.emit();if(this.isAutoHide){this.startAutoHide()}window.addEventListener("keydown",this.handleEscape)}else{this.clearAutoHide();this.timerPaused=false;window.removeEventListener("keydown",this.handleEscape)}}async show(){this.open=true}async hide(s="close"){if(!this.open)return;this.open=false;this.mdClose.emit({reason:s})}startAutoHide(){this.clearAutoHide();this.autoHideTimer=setTimeout((()=>{if(this.open){this.open=false;this.mdClose.emit({reason:"auto"})}}),this.autoHideDuration)}clearAutoHide(){if(this.autoHideTimer!=null){clearTimeout(this.autoHideTimer);this.autoHideTimer=undefined}}dismissAfterRipple(s){this.rippleDismissTimer=setTimeout((()=>{this.rippleDismissTimer=undefined;if(this.open){this.open=false;this.mdClose.emit({reason:s})}}),150)}render(){const s=!!this.action||this.hasSlottedAction;const t=this.closeable||this.hasSlottedClose;return e(i,{key:"b21c0e24229eaaae583da0799cb0591505e0fc10",class:{"md-snackbar":true,"md-snackbar--open":this.open,"md-snackbar--stacked":this.stacked,[`md-snackbar--${this.position}`]:true,"md-snackbar--with-action":s,"md-snackbar--with-close":t},role:this.politeness==="assertive"?"alert":"status","aria-live":this.politeness,"aria-atomic":"true"},e("div",{key:"a80231dbf94d0208dfdb40bd3dbe7d92668c6925",class:"md-snackbar__surface",part:"surface",onMouseEnter:this.pauseAutoHide,onMouseLeave:this.resumeAutoHide,onFocusin:this.pauseAutoHide,onFocusout:this.handleSurfaceFocusOut},e("span",{key:"d016f33d36ee1290430a6ec36b9a489e7e42b659",class:"md-snackbar__message",part:"message"},e("slot",{key:"809e86decc48b8b51f39bb0a716aa79ed5998f9a"},this.message)),s&&e("div",{key:"412c704bd5480acdc1d3e871ab1653dd4bd92594",class:"md-snackbar__actions",part:"actions"},e("slot",{key:"f6cd845c9b2dd94f2d5d523beebc88bf650358d1",name:"action"},this.action&&e("md-button",{key:"706f0c0a08b2ea9dc0c644dcfbb1124362686a6c",variant:"text",size:"sm",class:"md-snackbar__action-btn",onClick:this.handleActionClick},this.action))),t&&e("div",{key:"d060f9ffc1677ec955108b36b4bb17c6f230b165",class:"md-snackbar__close",part:"close"},e("slot",{key:"cd198a6e370655f8ec788cb8c429e702866edb5a",name:"close"},this.closeable&&e("md-icon-button",{key:"297b2eb6c651e07d55a53c4569c4cd3fbb472c3d",variant:"standard",icon:"close","aria-label":this.dismissLabel,onClick:this.handleCloseClick,exportparts:"icon:close-icon"})))))}get el(){return this}static get watchers(){return{open:[{onOpenChange:0}]}}static get style(){return d()}},[257,"md-snackbar",{open:[1540],message:[1],action:[1],closeable:[516],autoHide:[4,"auto-hide"],autoHideDuration:[2,"auto-hide-duration"],position:[513],stacked:[516],politeness:[513],dismissLabel:[1,"dismiss-label"],density:[514],hasSlottedAction:[32],hasSlottedClose:[32],hasSlottedDefault:[32],show:[64],hide:[64]},undefined,{open:[{onOpenChange:0}]}]);function l(){if(typeof customElements==="undefined"){return}const s=["md-snackbar","md-button","md-icon-button","md-ripple"];s.forEach((s=>{switch(s){case"md-snackbar":if(!customElements.get(n(s))){customElements.define(n(s),m)}break;case"md-button":if(!customElements.get(n(s))){o()}break;case"md-icon-button":if(!customElements.get(n(s))){c()}break;case"md-ripple":if(!customElements.get(n(s))){r()}break}}))}l();const h=m;const b=l;export{h as MdSnackbar,b as defineCustomElement};
|
|
1
|
+
import{p as s,H as t,c as a,h as e,d as i,t as n}from"./p-CB5yqdO-.js";import{d as o}from"./p-BTgac9TA.js";import{d as c}from"./p-DbKoLpkd.js";import{d as r}from"./p-CvxKUiKT.js";const d=()=>`:host{--_container-color:var(--md-snackbar-container-color, var(--md-sys-color-inverse-surface, #313033));--_message-color:var(--md-snackbar-message-color, var(--md-sys-color-inverse-on-surface, #F4EFF4));--_action-color:var(--md-snackbar-action-color, var(--md-sys-color-inverse-primary, #D0BCFF));--_close-color:var(--md-snackbar-close-color, var(--md-sys-color-inverse-on-surface, #F4EFF4));--_container-shape:var(--md-snackbar-container-shape, var(--md-sys-shape-corner-extra-small, 4px));--_min-width:var(--md-snackbar-min-width, 288px);--_max-width:var(--md-snackbar-max-width, 568px);--_slide-from:translateY(100%);display:flex;position:fixed;inset-block-start:0;inset-block-end:0;inset-inline-start:0;inset-inline-end:0;padding:var(--md-sys-spacing-inset-xl, 24px);align-items:flex-end;justify-content:center;z-index:calc(var(--md-sys-z-index-snackbar, 2000) + var(--_stack-order, 0));pointer-events:none;visibility:hidden;opacity:0;transform:var(--_slide-from);transition:opacity var(--md-sys-motion-duration-short4, 200ms) var(--md-sys-motion-easing-emphasized-accelerate, cubic-bezier(0.3, 0, 0.8, 0.15)), transform var(--md-sys-motion-duration-short4, 200ms) var(--md-sys-motion-easing-emphasized-accelerate, cubic-bezier(0.3, 0, 0.8, 0.15)), visibility 0ms linear var(--md-sys-motion-duration-short4, 200ms)}:host(.md-snackbar--open){visibility:visible;opacity:1;transform:translate(0, 0);transition:opacity var(--md-sys-motion-duration-medium1, 250ms) var(--md-sys-motion-easing-emphasized-decelerate, cubic-bezier(0.05, 0.7, 0.1, 1)), transform var(--md-sys-motion-duration-medium1, 250ms) var(--md-sys-motion-easing-emphasized-decelerate, cubic-bezier(0.05, 0.7, 0.1, 1)), visibility 0ms linear 0ms}:host(.md-snackbar--open) .md-snackbar__surface{pointer-events:auto}:host(.md-snackbar--bottom){align-items:flex-end;justify-content:center}:host(.md-snackbar--bottom-start){align-items:flex-end;justify-content:flex-start}:host(.md-snackbar--bottom-end){align-items:flex-end;justify-content:flex-end}:host(.md-snackbar--top),:host(.md-snackbar--top-start),:host(.md-snackbar--top-end){--_slide-from:translateY(-100%)}:host(.md-snackbar--top){align-items:flex-start;justify-content:center}:host(.md-snackbar--top-start){align-items:flex-start;justify-content:flex-start}:host(.md-snackbar--top-end){align-items:flex-start;justify-content:flex-end}:host(.md-snackbar--start),:host(.md-snackbar--end),:host(.md-snackbar--center){--_slide-from:translate(0, 0)}:host(.md-snackbar--start){align-items:center;justify-content:flex-start}:host(.md-snackbar--end){align-items:center;justify-content:flex-end}:host(.md-snackbar--center){align-items:center;justify-content:center}.md-snackbar__surface{display:flex;align-items:center;min-inline-size:var(--_min-width);max-inline-size:var(--_max-width);min-block-size:max(36px, calc(48px + var(--md-sys-density-scale, 0) * 3px));padding-inline-start:max(8px, calc(16px + var(--md-sys-density-scale, 0) * 2px));padding-inline-end:max(8px, calc(16px + var(--md-sys-density-scale, 0) * 2px));background-color:var(--_container-color);color:var(--_message-color);border-radius:var(--_container-shape);box-shadow:var(--md-sys-elevation-3);box-sizing:border-box}:host(.md-snackbar--with-action:not(.md-snackbar--with-close)) .md-snackbar__surface{padding-inline-end:var(--md-sys-spacing-inset-sm, 8px)}:host(.md-snackbar--with-close) .md-snackbar__surface{padding-inline-end:var(--md-sys-spacing-inset-md, 12px)}@media (max-width: 599px){:host{padding:var(--md-sys-spacing-inset-lg, 16px)}.md-snackbar__surface{inline-size:100%;min-inline-size:0;max-inline-size:100%}}.md-snackbar__message{flex:1;padding-block:max(6px, calc(14px + var(--md-sys-density-scale, 0) * 2px));font-family:var(--md-sys-typescale-body-medium-font-family, Roboto, sans-serif);font-size:max(12px, calc(14px + var(--md-sys-density-scale, 0) * 0.5px));font-weight:var(--md-sys-typescale-body-medium-font-weight, 400);line-height:max(16px, calc(20px + var(--md-sys-density-scale, 0) * 1px));letter-spacing:var(--md-sys-typescale-body-medium-letter-spacing, 0.25px);color:inherit}.md-snackbar__actions{display:flex;align-items:center;flex-shrink:0}.md-snackbar__action-btn{flex-shrink:0;--md-button-label-color:var(--_action-color);--md-button-icon-color:var(--_action-color);--md-ripple-color:var(--_action-color)}.md-snackbar__close{display:flex;align-items:center;flex-shrink:0;outline:none;-webkit-tap-highlight-color:transparent}.md-snackbar__close md-icon-button{--md-icon-button-icon-color:var(--_close-color);--md-icon-button-container-width:max(32px, calc(40px + var(--md-sys-density-scale, 0) * 4px));--md-icon-button-container-height:max(32px, calc(40px + var(--md-sys-density-scale, 0) * 4px));--md-icon-button-icon-size:max(18px, calc(24px + var(--md-sys-density-scale, 0) * 1px))}:host(.md-snackbar--stacked) .md-snackbar__surface{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;align-items:start;column-gap:var(--md-sys-spacing-gap-md, 12px);row-gap:6px;min-block-size:68px;padding-block-start:var(--md-sys-spacing-inset-sm, 8px);padding-block-end:var(--md-sys-spacing-inset-sm, 8px)}:host(.md-snackbar--stacked) .md-snackbar__message{grid-column:1;grid-row:1;padding-block-end:var(--md-sys-spacing-inset-xs, 4px)}:host(.md-snackbar--stacked) .md-snackbar__close{grid-column:2;grid-row:1;align-self:start;margin-inline-start:0;margin-block-start:var(--md-sys-spacing-inset-xs, 4px);padding-block-start:0}:host(.md-snackbar--stacked) .md-snackbar__actions{grid-column:1 / -1;grid-row:2;justify-self:end}::slotted([slot="action"]){color:var(--_action-color)}::slotted([slot="close"]){color:var(--_close-color)}@media (prefers-reduced-motion: reduce){:host,:host(.md-snackbar--open){transition:none}}@media (forced-colors: active){.md-snackbar__surface{border:1px solid CanvasText}.md-snackbar__action-btn{color:LinkText}.md-snackbar__action-btn:focus-visible{outline-color:Highlight}}:host([density='-1']){--md-sys-density-scale:-1}:host([density='-2']){--md-sys-density-scale:-2}:host([density='-3']){--md-sys-density-scale:-3}:host([density='-4']){--md-sys-density-scale:-4}:host([hidden]){display:none !important}`;const m=s(class s extends t{constructor(s){super();if(s!==false){this.__registerHost()}this.__attachShadow();this.mdOpen=a(this,"mdOpen",7);this.mdClose=a(this,"mdClose",7);this.mdAction=a(this,"mdAction",7);this.open=false;this.message="";this.action="";this.closeable=false;this.autoHide=true;this.autoHideDuration=4e3;this.position="bottom";this.stacked=false;this.politeness="polite";this.dismissLabel="Dismiss";this.density=0;this.hasSlottedAction=false;this.hasSlottedClose=false;this.hasSlottedDefault=false;this.timerPaused=false;this.handleActionClick=()=>{this.mdAction.emit();this.startAutoHide()};this.handleCloseClick=()=>{this.dismissAfterRipple("close")};this.handleEscape=s=>{if(s.key==="Escape"&&this.open&&this.closeable){s.preventDefault();this.handleCloseClick()}};this.pauseAutoHide=()=>{if(this.autoHideTimer!=null&&this.open){this.timerPaused=true;this.clearAutoHide()}};this.resumeAutoHide=()=>{if(this.timerPaused&&this.open){this.timerPaused=false;this.startAutoHide()}};this.handleSurfaceFocusOut=s=>{const t=s.currentTarget;if(s.relatedTarget&&t.contains(s.relatedTarget)){return}this.resumeAutoHide()}}get isAutoHide(){return this.autoHide!==false&&this.autoHide!=="false"}componentDidLoad(){const s=this.el.shadowRoot;if(!s)return;const t=s.querySelector("slot:not([name])");const a=s.querySelector('slot[name="action"]');const e=s.querySelector('slot[name="close"]');t?.addEventListener("slotchange",(()=>{this.hasSlottedDefault=t.assignedNodes().some((s=>s.nodeType===Node.ELEMENT_NODE||s.nodeType===Node.TEXT_NODE&&s.textContent?.trim()!==""))}));a?.addEventListener("slotchange",(()=>{this.hasSlottedAction=a.assignedElements().length>0}));e?.addEventListener("slotchange",(()=>{this.hasSlottedClose=e.assignedElements().length>0}));if(this.open){this.onOpenChange(true,false)}}disconnectedCallback(){this.clearAutoHide();if(this.rippleDismissTimer!=null){clearTimeout(this.rippleDismissTimer);this.rippleDismissTimer=undefined}window.removeEventListener("keydown",this.handleEscape)}raiseAboveOpenPeers(){const s=Array.from(document.querySelectorAll("md-snackbar")).filter((s=>s!==this.el&&s.open));const t=s.reduce(((s,t)=>Math.max(s,Number(t.style.getPropertyValue("--_stack-order"))||0)),0);this.el.style.setProperty("--_stack-order",String(t+1))}onOpenChange(s,t){if(s){this.raiseAboveOpenPeers();this.mdOpen.emit();if(this.isAutoHide){this.startAutoHide()}window.addEventListener("keydown",this.handleEscape)}else{this.clearAutoHide();this.timerPaused=false;window.removeEventListener("keydown",this.handleEscape)}}async show(){this.open=true}async hide(s="close"){if(!this.open)return;this.open=false;this.mdClose.emit({reason:s})}startAutoHide(){this.clearAutoHide();this.autoHideTimer=setTimeout((()=>{if(this.open){this.open=false;this.mdClose.emit({reason:"auto"})}}),this.autoHideDuration)}clearAutoHide(){if(this.autoHideTimer!=null){clearTimeout(this.autoHideTimer);this.autoHideTimer=undefined}}dismissAfterRipple(s){this.rippleDismissTimer=setTimeout((()=>{this.rippleDismissTimer=undefined;if(this.open){this.open=false;this.mdClose.emit({reason:s})}}),150)}render(){const s=!!this.action||this.hasSlottedAction;const t=this.closeable||this.hasSlottedClose;return e(i,{key:"b21c0e24229eaaae583da0799cb0591505e0fc10",class:{"md-snackbar":true,"md-snackbar--open":this.open,"md-snackbar--stacked":this.stacked,[`md-snackbar--${this.position}`]:true,"md-snackbar--with-action":s,"md-snackbar--with-close":t},role:this.politeness==="assertive"?"alert":"status","aria-live":this.politeness,"aria-atomic":"true"},e("div",{key:"a80231dbf94d0208dfdb40bd3dbe7d92668c6925",class:"md-snackbar__surface",part:"surface",onMouseEnter:this.pauseAutoHide,onMouseLeave:this.resumeAutoHide,onFocusin:this.pauseAutoHide,onFocusout:this.handleSurfaceFocusOut},e("span",{key:"d016f33d36ee1290430a6ec36b9a489e7e42b659",class:"md-snackbar__message",part:"message"},e("slot",{key:"809e86decc48b8b51f39bb0a716aa79ed5998f9a"},this.message)),s&&e("div",{key:"412c704bd5480acdc1d3e871ab1653dd4bd92594",class:"md-snackbar__actions",part:"actions"},e("slot",{key:"f6cd845c9b2dd94f2d5d523beebc88bf650358d1",name:"action"},this.action&&e("md-button",{key:"706f0c0a08b2ea9dc0c644dcfbb1124362686a6c",variant:"text",size:"sm",class:"md-snackbar__action-btn",onClick:this.handleActionClick},this.action))),t&&e("div",{key:"d060f9ffc1677ec955108b36b4bb17c6f230b165",class:"md-snackbar__close",part:"close"},e("slot",{key:"cd198a6e370655f8ec788cb8c429e702866edb5a",name:"close"},this.closeable&&e("md-icon-button",{key:"297b2eb6c651e07d55a53c4569c4cd3fbb472c3d",variant:"standard",icon:"close","aria-label":this.dismissLabel,onClick:this.handleCloseClick,exportparts:"icon:close-icon"})))))}get el(){return this}static get watchers(){return{open:[{onOpenChange:0}]}}static get style(){return d()}},[257,"md-snackbar",{open:[1540],message:[1],action:[1],closeable:[516],autoHide:[4,"auto-hide"],autoHideDuration:[2,"auto-hide-duration"],position:[513],stacked:[516],politeness:[513],dismissLabel:[1,"dismiss-label"],density:[514],hasSlottedAction:[32],hasSlottedClose:[32],hasSlottedDefault:[32],show:[64],hide:[64]},undefined,{open:[{onOpenChange:0}]}]);function l(){if(typeof customElements==="undefined"){return}const s=["md-snackbar","md-button","md-icon-button","md-ripple"];s.forEach((s=>{switch(s){case"md-snackbar":if(!customElements.get(n(s))){customElements.define(n(s),m)}break;case"md-button":if(!customElements.get(n(s))){o()}break;case"md-icon-button":if(!customElements.get(n(s))){c()}break;case"md-ripple":if(!customElements.get(n(s))){r()}break}}))}l();const h=m;const b=l;export{h as MdSnackbar,b as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=md-snackbar.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as t,H as e,c as s,h as a,d as i,t as r}from"./p-CB5yqdO-.js";import{t as o}from"./p-DYBUr7K_.js";import{d as n}from"./p-C1RN8YA1.js";import{d}from"./p-CvxKUiKT.js";const l=()=>`:host{--_size:var(--md-step-indicator-size, max(24px, calc(32px + var(--md-sys-density-scale, 0) * 2px)));--_indicator-h:var(--_size);--_indicator-ring:var(--md-step-indicator-ring, max(4px, calc(8px + var(--md-sys-density-scale, 0) * 1px)));--_color:var(--md-step-indicator-color, var(--md-sys-color-surface-container-highest, #E6E0E9));--_text:var(--md-step-indicator-text, var(--md-sys-color-on-surface-variant, #49454F));--_active-color:var(--md-step-active-color, var(--md-sys-color-primary, #6750A4));--_active-text:var(--md-step-active-text, var(--md-sys-color-on-primary, #FFFFFF));--_active-halo:var(--md-step-active-halo-color, var(--md-sys-color-primary, #6750A4));--_completed-color:var(--md-step-completed-color, var(--md-sys-color-primary, #6750A4));--_completed-text:var(--md-step-completed-text, var(--md-sys-color-on-primary, #FFFFFF));--_error-color:var(--md-step-error-color, var(--md-sys-color-error, #B3261E));--_error-text:var(--md-step-error-text, var(--md-sys-color-on-error, #FFFFFF));--_connector:var(--md-step-connector-color, var(--md-sys-color-outline-variant, #CAC4D0));--_connector-filled:var(--md-step-connector-filled-color, var(--md-sys-color-primary, #6750A4));--_connector-thickness:var(--md-step-connector-thickness, max(2px, calc(4px + var(--md-sys-density-scale, 0) * 0.5px)));--_label-color:var(--md-step-label-color, var(--md-sys-color-on-surface-variant, #49454F));--_label-active-color:var(--md-step-label-active-color, var(--md-sys-color-on-surface, #1C1B1F));--_description-color:var(--md-step-description-color, var(--md-sys-color-on-surface-variant, #49454F));--_state-layer-color:var(--md-step-state-layer-color, var(--md-sys-color-on-surface, #1C1B1F));--_spring-duration:var(--md-sys-motion-spring-spatial-default-duration, 500ms);--_spring-easing:var(--md-sys-motion-spring-spatial-default-easing, cubic-bezier(0.38, 1.21, 0.22, 1.00));--_state-duration:var(--md-sys-motion-spring-effects-default-duration, 200ms);--_state-easing:var(--md-sys-motion-spring-effects-default-easing, cubic-bezier(0.34, 0.80, 0.34, 1.00));--_expand-duration:var(--md-step-expand-duration, var(--md-sys-motion-spring-spatial-default-duration, 500ms));--_expand-easing:var(--md-sys-motion-spring-spatial-default-easing, cubic-bezier(0.38, 1.21, 0.22, 1.00));--_collapse-duration:var(--md-step-collapse-duration, var(--md-sys-motion-duration-short4, 200ms));--_collapse-easing:var(--md-sys-motion-easing-emphasized-accelerate, cubic-bezier(0.3, 0, 0.8, 0.15));--_connector-duration:var(--md-step-connector-duration, var(--md-sys-motion-duration-medium3, 350ms));--_connector-easing:linear;--_active-halo-size:3px;display:flex;box-sizing:border-box;position:relative;font-family:var(--md-sys-typescale-body-large-font-family, Roboto, sans-serif);animation:md-step-enter var(--md-sys-motion-spring-effects-slow-duration, 300ms) var(--_state-easing) backwards;animation-delay:calc(var(--md-step-idx, 0) * 40ms)}@keyframes md-step-enter{from{opacity:0}}:host(.md-step--indicator-dot){--_indicator-h:10px;--_color:var(--md-step-indicator-color, var(--md-sys-color-outline, #79747E))}:host(.md-step--horizontal){--_indicator-pad:max(0px, calc(4px + var(--md-sys-density-scale, 0) * 1px));--_connector-gap:max(4px, calc(10px + var(--md-sys-density-scale, 0) * 1px));flex:1 1 0;min-inline-size:0;justify-content:center;align-items:flex-start}:host(.md-step--horizontal.md-step--panel-step){display:contents}:host(.md-step--horizontal.md-step--panel-step) .md-step__header{grid-row:1;display:flex;flex:1 1 0;min-inline-size:0;justify-content:center;align-items:flex-start;position:relative}:host(.md-step--horizontal.md-step--panel-step) .md-step__content{grid-row:2;grid-column:1 / -1;margin-inline-start:0}:host(.md-step--vertical){flex:initial;flex-direction:row;align-items:flex-start;flex-wrap:wrap;--_connector-gap:6px;padding-block-end:var(--md-sys-spacing-inset-lg, 16px)}:host(.md-step--vertical.md-step--last){padding-block-end:0}.md-step__inner{position:relative;display:inline-flex;align-items:center;gap:var(--md-sys-spacing-gap-md, 12px);padding:0;background:transparent;border:none;cursor:pointer;text-align:start;color:inherit;font:inherit;-webkit-tap-highlight-color:transparent}:host(.md-step--horizontal) .md-step__inner{flex-direction:column;align-items:center;gap:max(2px, calc(6px + var(--md-sys-density-scale, 0) * 1px));padding-block-start:var(--_indicator-pad);padding-inline:var(--md-sys-spacing-inset-sm, 8px);max-inline-size:100%;min-inline-size:0;z-index:1}:host(.md-step--vertical) .md-step__inner{padding-inline-start:8px;z-index:1}.md-step__indicator{position:relative;display:inline-flex;align-items:center;justify-content:center;inline-size:calc(var(--_indicator-h) + 2 * var(--_indicator-ring));block-size:calc(var(--_indicator-h) + 2 * var(--_indicator-ring));border-radius:50%;flex-shrink:0;color:var(--_state-layer-color)}.md-step__indicator md-ripple{border-radius:50%}.md-step__state-layer{position:absolute;inset:0;border-radius:50%;background-color:var(--_state-layer-color);opacity:0;pointer-events:none;transition:opacity var(--_state-duration) var(--_state-easing)}.md-step__inner:hover:not([aria-disabled="true"]) .md-step__state-layer{opacity:var(--md-sys-state-hover-state-layer-opacity, 0.08)}.md-step__inner:focus-visible .md-step__state-layer{opacity:var(--md-sys-state-focus-state-layer-opacity, 0.12)}.md-step__inner:active:not([aria-disabled="true"]) .md-step__state-layer{opacity:var(--md-sys-state-pressed-state-layer-opacity, 0.12)}.md-step__inner:focus-visible{outline:none}.md-step__inner:focus-visible .md-step__indicator{box-shadow:0 0 0 2px var(--md-sys-color-surface, #FEF7FF), 0 0 0 5px var(--md-sys-color-secondary, #625B71)}:host(.md-step--disabled) .md-step__inner{cursor:not-allowed}:host(.md-step--disabled) .md-step__indicator{opacity:0.38}:host(.md-step--disabled) md-ripple,:host(.md-step--disabled) .md-step__state-layer{display:none}.md-step__bubble{position:relative;display:inline-flex;align-items:center;justify-content:center;inline-size:var(--_size);block-size:var(--_size);border-radius:var(--md-sys-shape-corner-full, 9999px);background-color:var(--_color);color:var(--_text);font-family:var(--md-sys-typescale-label-large-font-family, Roboto, sans-serif);font-size:var(--md-sys-typescale-label-large-font-size, 14px);font-weight:var(--md-sys-typescale-label-large-font-weight, 500);line-height:var(--md-sys-typescale-label-large-line-height, 20px);flex-shrink:0;transition:background-color var(--_state-duration) var(--_state-easing), color var(--_state-duration) var(--_state-easing), transform var(--_spring-duration) var(--_spring-easing), box-shadow var(--_spring-duration) var(--_spring-easing)}.md-step__bubble .material-symbols-outlined{font-family:var(--md-sys-icon-font-family, 'Material Symbols Outlined', 'Material Icons');font-size:calc(var(--_size) * 0.56);line-height:1;font-weight:normal;font-style:normal;letter-spacing:normal;text-transform:none;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;font-variation-settings:'FILL' 0, 'wght' 500, 'GRAD' 0, 'opsz' 24}:host(.md-step--active) .md-step__bubble .material-symbols-outlined,:host(.md-step--completed) .md-step__bubble .material-symbols-outlined,:host(.md-step--error) .md-step__bubble .material-symbols-outlined{font-variation-settings:'FILL' 1, 'wght' 600, 'GRAD' 0, 'opsz' 24}@keyframes md-step-glyph-in{0%{transform:scale(0);opacity:0}60%{transform:scale(1.18);opacity:1}100%{transform:scale(1);opacity:1}}:host(.md-step--completed) .md-step__bubble .material-symbols-outlined,:host(.md-step--error) .md-step__bubble .material-symbols-outlined{animation:md-step-glyph-in var(--_spring-duration) var(--_spring-easing) both}:host(.md-step--active) .md-step__bubble{background-color:var(--_active-color);color:var(--_active-text);transform:scale(1.12);box-shadow:0 0 0 var(--_active-halo-size) color-mix(in srgb, var(--_active-halo) 14%, transparent)}:host(.md-step--completed) .md-step__bubble{background-color:var(--_completed-color);color:var(--_completed-text)}:host(.md-step--error) .md-step__bubble{background-color:var(--_error-color);color:var(--_error-text);animation:md-step-error-pulse var(--md-sys-motion-duration-medium2, 300ms) var(--_state-easing) both}@keyframes md-step-error-pulse{0%{transform:scale(1)}40%{transform:scale(1.08)}100%{transform:scale(1)}}.md-step__dot{display:inline-block;inline-size:var(--_indicator-h);block-size:var(--_indicator-h);border-radius:var(--md-sys-shape-corner-full, 9999px);background-color:var(--_color);flex-shrink:0;transition:background-color var(--_state-duration) var(--_state-easing), box-shadow var(--_spring-duration) var(--_spring-easing), transform var(--_spring-duration) var(--_spring-easing)}:host(.md-step--active) .md-step__dot{background-color:var(--_active-color);transform:scale(1.4);box-shadow:0 0 0 var(--_active-halo-size) color-mix(in srgb, var(--_active-halo) 18%, transparent)}:host(.md-step--completed) .md-step__dot{background-color:var(--_completed-color)}:host(.md-step--error) .md-step__dot{background-color:var(--_error-color)}.md-step__text{display:flex;flex-direction:column;gap:2px;min-inline-size:0}:host(.md-step--horizontal) .md-step__text{align-items:center;text-align:center;max-inline-size:100%}.md-step__label{color:var(--_label-color);font-family:var(--md-sys-typescale-label-large-font-family, Roboto, sans-serif);font-size:max(11px, calc(14px + var(--md-sys-density-scale, 0) * 0.5px));font-weight:var(--md-sys-typescale-label-large-font-weight, 500);line-height:max(16px, calc(20px + var(--md-sys-density-scale, 0) * 1px));transition:color var(--_state-duration) var(--_state-easing), font-variation-settings var(--_state-duration) var(--_state-easing)}:host(.md-step--horizontal) .md-step__label{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}:host(.md-step--active) .md-step__label{color:var(--_label-active-color);font-weight:600;font-variation-settings:'wght' 600}:host(.md-step--error) .md-step__label{color:var(--_error-color)}:host(.md-step--disabled) .md-step__text{opacity:0.38}.md-step__optional,.md-step__description{color:var(--_description-color);font-family:var(--md-sys-typescale-body-small-font-family, Roboto, sans-serif);font-size:max(10px, calc(12px + var(--md-sys-density-scale, 0) * 0.5px));font-weight:var(--md-sys-typescale-body-small-font-weight, 400);line-height:max(14px, calc(16px + var(--md-sys-density-scale, 0) * 0.5px))}.md-step__optional{font-style:italic}:host(.md-step--error) .md-step__description{color:var(--_error-color)}.md-step__connector{position:relative;flex:1;align-self:center;background-color:var(--_connector);overflow:hidden;border-radius:var(--md-sys-shape-corner-full, 9999px)}.md-step__connector::after{content:'';position:absolute;inset:0;background-color:var(--_connector-filled);border-radius:inherit;transform-origin:left center;transform:scaleX(0);transition:transform var(--_connector-duration) var(--_connector-easing)}.md-step__connector--filled::after{transform:scaleX(1)}:host([dir="rtl"]) .md-step__connector::after,:host-context([dir="rtl"]) .md-step__connector::after{transform-origin:right center}:host(.md-step--horizontal) .md-step__connector--trailing{position:absolute;inset-block-start:calc(var(--_indicator-pad) + var(--_indicator-ring) + var(--_indicator-h) / 2);transform:translateY(-50%);block-size:var(--_connector-thickness);inset-inline-start:calc(50% + var(--_indicator-h) / 2 + var(--_connector-gap));inline-size:calc(100% - var(--_indicator-h) - 2 * var(--_connector-gap));flex:none;align-self:auto;z-index:0}:host(.md-step--vertical) .md-step__connector{position:absolute;flex:none;align-self:auto;z-index:0;inline-size:var(--_connector-thickness);inset-inline-start:calc(8px + var(--_indicator-ring) + (var(--_indicator-h) - var(--_connector-thickness)) / 2)}:host(.md-step--vertical) .md-step__connector--leading{display:none}:host(.md-step--vertical) .md-step__connector--trailing{inset-block-start:calc(var(--_indicator-ring) + var(--_indicator-h) + var(--_connector-gap));inset-block-end:calc(var(--_connector-gap) - var(--_indicator-ring))}:host(.md-step--vertical) .md-step__connector::after{transform-origin:center top;transform:scaleY(0)}:host(.md-step--vertical) .md-step__connector--filled::after{transform:scaleY(1)}.md-step__content{flex:1 1 100%;display:grid;grid-template-rows:0fr;opacity:0;visibility:hidden;margin-inline-start:calc(8px + var(--_indicator-h) + 2 * var(--_indicator-ring) + var(--md-sys-spacing-gap-md, 12px));color:var(--md-sys-color-on-surface, #1C1B1F);transition:grid-template-rows var(--_collapse-duration) var(--_collapse-easing), opacity var(--_collapse-duration) var(--_collapse-easing), visibility 0s linear var(--_collapse-duration)}.md-step__content--open{grid-template-rows:1fr;opacity:1;visibility:visible;transition:grid-template-rows var(--_expand-duration) var(--_expand-easing), opacity var(--_state-duration) var(--_state-easing), visibility 0s}.md-step__content-sizer{min-block-size:0;overflow:hidden}.md-step__content-inner{padding-block-start:var(--md-sys-spacing-inset-xs, 4px);padding-block-end:var(--md-sys-spacing-inset-lg, 16px)}.md-step__content--lazy{display:block;grid-template-rows:none;opacity:1;visibility:visible;transition:none;animation:md-step-content-enter var(--_expand-duration) var(--_expand-easing) both}.md-step__content--lazy .md-step__content-sizer{overflow:visible}@keyframes md-step-content-enter{from{opacity:0;transform:translateY(-6px)}}.md-step__actions{display:flex;gap:var(--md-sys-spacing-gap-sm, 8px);margin-block-start:var(--md-sys-spacing-gap-lg, 16px)}@media (max-width: 599px){:host(.md-step--horizontal){--_size:var(--md-step-indicator-size, 28px);--_connector-gap:8px}:host(.md-step--horizontal) .md-step__inner{gap:var(--md-sys-spacing-gap-xs, 4px);padding-inline:var(--md-sys-spacing-inset-xs, 4px)}:host(.md-step--horizontal) .md-step__label{font-size:var(--md-sys-typescale-label-medium-font-size, 12px);line-height:var(--md-sys-typescale-label-medium-line-height, 16px)}:host(.md-step--horizontal) .md-step__optional,:host(.md-step--horizontal) .md-step__description{display:none}}@media (prefers-reduced-motion: reduce){:host{animation:none !important}.md-step__bubble,.md-step__dot,.md-step__connector,.md-step__connector::after,.md-step__state-layer,.md-step__label,.md-step__content,.md-step__bubble .material-symbols-outlined{transition-duration:0.01ms !important;transition-delay:0s !important;animation:none !important}:host(.md-step--active) .md-step__bubble,:host(.md-step--active) .md-step__dot{transform:none;box-shadow:0 0 0 3px color-mix(in srgb, var(--_active-halo) 25%, transparent)}}@media (forced-colors: active){.md-step__bubble,.md-step__dot{background-color:Canvas;border:2px solid CanvasText;forced-color-adjust:none}:host(.md-step--active) .md-step__bubble,:host(.md-step--completed) .md-step__bubble{background-color:Highlight;color:HighlightText}.md-step__connector{background-color:GrayText;forced-color-adjust:none}.md-step__connector::after{background-color:Highlight}.md-step__state-layer{display:none}.md-step__inner:focus-visible .md-step__indicator{box-shadow:0 0 0 3px Highlight}}:host([density='-1']){--md-sys-density-scale:-1}:host([density='-2']){--md-sys-density-scale:-2}:host([density='-3']){--md-sys-density-scale:-3}:host([density='-4']){--md-sys-density-scale:-4}:host([hidden]){display:none !important}`;const c=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.mdStepClick=s(this,"mdStepClick",5);this.mdStepNext=s(this,"mdStepNext",5);this.mdStepBack=s(this,"mdStepBack",5);this.label="";this.description="";this.completed=false;this.active=false;this.error=false;this.errorText="";this.disabled=false;this.optional=false;this.editable=false;this.icon="";this.completedIcon="check";this.errorIcon="priority_high";this.hideActions=false;this.density=0;this.hasSlottedContent=false;this.handleClick=t=>{if(this.effectivelyDisabled)return;t.preventDefault();this.mdStepClick.emit({index:this.index})};this.handleKeyDown=t=>{if(this.effectivelyDisabled)return;if(t.key==="Enter"||t.key===" "){t.preventDefault();o(this.el);this.mdStepClick.emit({index:this.index})}};this.emitNext=()=>this.mdStepNext.emit({index:this.index});this.emitBack=()=>this.mdStepBack.emit({index:this.index})}attr(t,e=""){const s=this.el.getAttribute(t);return s!=null&&s!==""?s:e}get index(){return Number(this.attr("data-index","0"))}get total(){return Number(this.attr("data-total","0"))}get activeIndex(){return Number(this.attr("data-active","0"))}get position(){return this.el.getAttribute("data-position")??"first"}get orientation(){return this.el.getAttribute("data-orientation")??"horizontal"}get indicatorKind(){return this.el.getAttribute("data-indicator")??"numbered"}get linearMode(){return this.el.getAttribute("data-mode")==="linear"}connectedCallback(){this.computeSlottedContent();if(typeof MutationObserver!=="undefined"){this.contentObserver=new MutationObserver((()=>this.computeSlottedContent()));this.contentObserver.observe(this.el,{childList:true})}}disconnectedCallback(){this.contentObserver?.disconnect();this.contentObserver=undefined}computeSlottedContent(){this.hasSlottedContent=Array.from(this.el.childNodes).some((t=>t.nodeType===Node.ELEMENT_NODE||t.nodeType===Node.TEXT_NODE&&(t.textContent??"").trim()!==""))}stepSiblings(){const t=this.el.parentElement;if(!t)return[];return Array.from(t.children).filter((t=>t.tagName.toLowerCase()==="md-step"))}allPriorPassable(){const t=this.stepSiblings();for(let e=0;e<this.index;e++){const s=t[e];if(!s?.completed&&!s?.optional)return false}return true}get reachable(){if(!this.linearMode)return true;return this.index<=this.activeIndex||this.completed||this.allPriorPassable()}get effectivelyDisabled(){return this.disabled||!this.reachable}onInternalMdClick(t){if(t.target===this.el)t.stopPropagation()}glyph(t){return a("span",{class:"md-step__bubble",part:"bubble","aria-hidden":"true"},a("span",{class:"material-symbols-outlined"},t))}renderIndicator(){if(this.indicatorKind==="dot"){return a("span",{class:"md-step__dot",part:"dot","aria-hidden":"true"})}if(this.error)return this.glyph(this.errorIcon);if(this.icon)return this.glyph(this.icon);if(this.completed)return this.glyph(this.editable?"edit":this.completedIcon);return a("span",{class:"md-step__bubble",part:"bubble","aria-hidden":"true"},this.index+1)}composeA11yLabel(){if(this.accessibleName?.trim())return this.accessibleName;const t=(t,e)=>this.attr(t,e);let e=`${t("data-step-word","Step")} ${this.index+1} ${t("data-of-word","of")} ${this.total}`;if(this.label)e+=`: ${this.label}`;if(this.optional)e+=`, ${t("data-optional-word","optional")}`;if(this.completed)e+=`, ${t("data-completed-word","completed")}`;if(this.active)e+=`, ${t("data-current-word","current")}`;if(this.error)e+=`, ${t("data-error-word","error")}${this.errorText?`: ${this.errorText}`:""}`;return e}render(){const t=this.position==="first";const e=this.position==="last";const s=this.orientation==="vertical";const r=this.effectivelyDisabled;const o=this.error&&this.errorText?this.errorText:this.description;const n=this.optional?this.attr("data-optional-word","Optional"):"";const d=this.attr("data-nav","true")!=="false"&&!this.hideActions;const l=this.attr("data-loading","false")==="true";const c=this.attr("data-next-disabled","false")==="true";const p=this.attr("data-lazy","false")==="true";const m=this.attr("data-panel-mode","shared");const _=s?this.hasSlottedContent||d:m==="step"&&this.hasSlottedContent;const h=_&&(!p||this.active);const v=[!t&&s&&a("span",{key:"1b11ef300c7e3a6a10a88e4d381d671fab4452b0",class:{"md-step__connector":true,"md-step__connector--leading":true,"md-step__connector--filled":this.index<=this.activeIndex},part:"connector connector-leading","aria-hidden":"true"}),a("div",{key:"fbd77cd1307d4b39f22c4d057762751ef9cc2d3c",class:"md-step__inner",part:"inner",tabindex:r?-1:0,role:"button","aria-label":this.composeA11yLabel(),"aria-disabled":r?"true":undefined,"aria-current":this.active?"step":undefined,"aria-expanded":_?this.active?"true":"false":undefined,"aria-controls":h?"md-step-panel":undefined,onClick:this.handleClick,onKeyDown:this.handleKeyDown},a("span",{key:"39982e61c1d19148851c685165a5c1ae779598f7",class:"md-step__indicator",part:"indicator"},a("md-ripple",{key:"6abca487aaebe721a66710c18b8e348dde382af5",disabled:r}),a("span",{key:"501e2c4896f89d5ed101de6f6a9bf0ddc6e06313",class:"md-step__state-layer",part:"state-layer","aria-hidden":"true"}),this.renderIndicator()),(this.label||o||n)&&a("span",{key:"d91905dc67ccfa16cc9d6c9cec7d8f017b70291d",class:"md-step__text",part:"text"},this.label&&a("span",{key:"62f2f968cabf2850dddae7de188a686990d1b307",class:"md-step__label",part:"label"},this.label),n&&a("span",{key:"6e5ffc06d7a45ffe3c452d181dc988a6df8f779b",class:"md-step__optional",part:"optional"},n),o&&a("span",{key:"a87cba9672984bf2e21f80b712c9381e9991b4d0",class:"md-step__description",part:"description"},o))),!e&&a("span",{key:"c31636170a77ec54727897e958539eaa19d21089",class:{"md-step__connector":true,"md-step__connector--trailing":true,"md-step__connector--filled":this.index<this.activeIndex},part:"connector connector-trailing","aria-hidden":"true"})];const f=!s&&_;return a(i,{key:"7727315d99eb8e9224de4bb7fd4c82460e65466e",class:{"md-step":true,[`md-step--${this.orientation}`]:true,[`md-step--indicator-${this.indicatorKind}`]:true,"md-step--active":this.active,"md-step--completed":this.completed,"md-step--error":this.error,"md-step--optional":this.optional,"md-step--editable":this.editable,"md-step--disabled":r,"md-step--first":t,"md-step--last":e,"md-step--panel-step":!s&&_},role:"listitem","aria-current":this.active?"step":undefined,"aria-disabled":r?"true":undefined},f?a("div",{class:"md-step__header"},v):v,h&&a("div",{key:"1ef0c0e80197a25d55fd4cd6a554278d99f40029",id:"md-step-panel",class:{"md-step__content":true,"md-step__content--open":this.active,"md-step__content--lazy":p},part:"content",role:"region","aria-label":this.label||this.composeA11yLabel()},a("div",{key:"81978d423d3b98f3fa04ab3a99b8c46e8e522184",class:"md-step__content-sizer"},a("div",{key:"fa2f439127d914dbd6aaef0d844819f0e3fd13a5",class:"md-step__content-inner"},a("slot",{key:"13eba3fb64b6ddaf4acdd369e88cb2fb847a4b7e"}),d&&s&&a("div",{key:"c5c0852ed5722c3eec2d1aec4cc39dc4adc03cf6",class:"md-step__actions",part:"actions"},a("md-button",{key:"d0583c8a714a0e484546f809f627e114d1afae75",variant:"text",size:"sm",disabled:t||l,onClick:this.emitBack},this.attr("data-back-label","Back")),a("md-button",{key:"3f95fff1451d2385399fd0301b69b5022c45fd99",variant:"filled",size:"sm",loading:l,disabled:c||l,onClick:this.emitNext},e?this.attr("data-finish-label","Finish"):this.attr("data-next-label","Continue")))))))}get el(){return this}static get style(){return l()}},[257,"md-step",{label:[1],description:[1],completed:[516],active:[1540],error:[516],errorText:[1,"error-text"],disabled:[516],optional:[516],editable:[516],icon:[1],completedIcon:[1,"completed-icon"],errorIcon:[1,"error-icon"],accessibleName:[1,"accessible-name"],hideActions:[516,"hide-actions"],density:[514],hasSlottedContent:[32]},[[0,"mdClick","onInternalMdClick"]]]);function p(){if(typeof customElements==="undefined"){return}const t=["md-step","md-button","md-ripple"];t.forEach((t=>{switch(t){case"md-step":if(!customElements.get(r(t))){customElements.define(r(t),c)}break;case"md-button":if(!customElements.get(r(t))){n()}break;case"md-ripple":if(!customElements.get(r(t))){d()}break}}))}p();const m=c;const _=p;export{m as MdStep,_ as defineCustomElement};
|
|
1
|
+
import{p as t,H as e,c as s,h as a,d as i,t as r}from"./p-CB5yqdO-.js";import{t as o}from"./p-DYBUr7K_.js";import{d as n}from"./p-BTgac9TA.js";import{d}from"./p-CvxKUiKT.js";const l=()=>`:host{--_size:var(--md-step-indicator-size, max(24px, calc(32px + var(--md-sys-density-scale, 0) * 2px)));--_indicator-h:var(--_size);--_indicator-ring:var(--md-step-indicator-ring, max(4px, calc(8px + var(--md-sys-density-scale, 0) * 1px)));--_color:var(--md-step-indicator-color, var(--md-sys-color-surface-container-highest, #E6E0E9));--_text:var(--md-step-indicator-text, var(--md-sys-color-on-surface-variant, #49454F));--_active-color:var(--md-step-active-color, var(--md-sys-color-primary, #6750A4));--_active-text:var(--md-step-active-text, var(--md-sys-color-on-primary, #FFFFFF));--_active-halo:var(--md-step-active-halo-color, var(--md-sys-color-primary, #6750A4));--_completed-color:var(--md-step-completed-color, var(--md-sys-color-primary, #6750A4));--_completed-text:var(--md-step-completed-text, var(--md-sys-color-on-primary, #FFFFFF));--_error-color:var(--md-step-error-color, var(--md-sys-color-error, #B3261E));--_error-text:var(--md-step-error-text, var(--md-sys-color-on-error, #FFFFFF));--_connector:var(--md-step-connector-color, var(--md-sys-color-outline-variant, #CAC4D0));--_connector-filled:var(--md-step-connector-filled-color, var(--md-sys-color-primary, #6750A4));--_connector-thickness:var(--md-step-connector-thickness, max(2px, calc(4px + var(--md-sys-density-scale, 0) * 0.5px)));--_label-color:var(--md-step-label-color, var(--md-sys-color-on-surface-variant, #49454F));--_label-active-color:var(--md-step-label-active-color, var(--md-sys-color-on-surface, #1C1B1F));--_description-color:var(--md-step-description-color, var(--md-sys-color-on-surface-variant, #49454F));--_state-layer-color:var(--md-step-state-layer-color, var(--md-sys-color-on-surface, #1C1B1F));--_spring-duration:var(--md-sys-motion-spring-spatial-default-duration, 500ms);--_spring-easing:var(--md-sys-motion-spring-spatial-default-easing, cubic-bezier(0.38, 1.21, 0.22, 1.00));--_state-duration:var(--md-sys-motion-spring-effects-default-duration, 200ms);--_state-easing:var(--md-sys-motion-spring-effects-default-easing, cubic-bezier(0.34, 0.80, 0.34, 1.00));--_expand-duration:var(--md-step-expand-duration, var(--md-sys-motion-spring-spatial-default-duration, 500ms));--_expand-easing:var(--md-sys-motion-spring-spatial-default-easing, cubic-bezier(0.38, 1.21, 0.22, 1.00));--_collapse-duration:var(--md-step-collapse-duration, var(--md-sys-motion-duration-short4, 200ms));--_collapse-easing:var(--md-sys-motion-easing-emphasized-accelerate, cubic-bezier(0.3, 0, 0.8, 0.15));--_connector-duration:var(--md-step-connector-duration, var(--md-sys-motion-duration-medium3, 350ms));--_connector-easing:linear;--_active-halo-size:3px;display:flex;box-sizing:border-box;position:relative;font-family:var(--md-sys-typescale-body-large-font-family, Roboto, sans-serif);animation:md-step-enter var(--md-sys-motion-spring-effects-slow-duration, 300ms) var(--_state-easing) backwards;animation-delay:calc(var(--md-step-idx, 0) * 40ms)}@keyframes md-step-enter{from{opacity:0}}:host(.md-step--indicator-dot){--_indicator-h:10px;--_color:var(--md-step-indicator-color, var(--md-sys-color-outline, #79747E))}:host(.md-step--horizontal){--_indicator-pad:max(0px, calc(4px + var(--md-sys-density-scale, 0) * 1px));--_connector-gap:max(4px, calc(10px + var(--md-sys-density-scale, 0) * 1px));flex:1 1 0;min-inline-size:0;justify-content:center;align-items:flex-start}:host(.md-step--horizontal.md-step--panel-step){display:contents}:host(.md-step--horizontal.md-step--panel-step) .md-step__header{grid-row:1;display:flex;flex:1 1 0;min-inline-size:0;justify-content:center;align-items:flex-start;position:relative}:host(.md-step--horizontal.md-step--panel-step) .md-step__content{grid-row:2;grid-column:1 / -1;margin-inline-start:0}:host(.md-step--vertical){flex:initial;flex-direction:row;align-items:flex-start;flex-wrap:wrap;--_connector-gap:6px;padding-block-end:var(--md-sys-spacing-inset-lg, 16px)}:host(.md-step--vertical.md-step--last){padding-block-end:0}.md-step__inner{position:relative;display:inline-flex;align-items:center;gap:var(--md-sys-spacing-gap-md, 12px);padding:0;background:transparent;border:none;cursor:pointer;text-align:start;color:inherit;font:inherit;-webkit-tap-highlight-color:transparent}:host(.md-step--horizontal) .md-step__inner{flex-direction:column;align-items:center;gap:max(2px, calc(6px + var(--md-sys-density-scale, 0) * 1px));padding-block-start:var(--_indicator-pad);padding-inline:var(--md-sys-spacing-inset-sm, 8px);max-inline-size:100%;min-inline-size:0;z-index:1}:host(.md-step--vertical) .md-step__inner{padding-inline-start:8px;z-index:1}.md-step__indicator{position:relative;display:inline-flex;align-items:center;justify-content:center;inline-size:calc(var(--_indicator-h) + 2 * var(--_indicator-ring));block-size:calc(var(--_indicator-h) + 2 * var(--_indicator-ring));border-radius:50%;flex-shrink:0;color:var(--_state-layer-color)}.md-step__indicator md-ripple{border-radius:50%}.md-step__state-layer{position:absolute;inset:0;border-radius:50%;background-color:var(--_state-layer-color);opacity:0;pointer-events:none;transition:opacity var(--_state-duration) var(--_state-easing)}.md-step__inner:hover:not([aria-disabled="true"]) .md-step__state-layer{opacity:var(--md-sys-state-hover-state-layer-opacity, 0.08)}.md-step__inner:focus-visible .md-step__state-layer{opacity:var(--md-sys-state-focus-state-layer-opacity, 0.12)}.md-step__inner:active:not([aria-disabled="true"]) .md-step__state-layer{opacity:var(--md-sys-state-pressed-state-layer-opacity, 0.12)}.md-step__inner:focus-visible{outline:none}.md-step__inner:focus-visible .md-step__indicator{box-shadow:0 0 0 2px var(--md-sys-color-surface, #FEF7FF), 0 0 0 5px var(--md-sys-color-secondary, #625B71)}:host(.md-step--disabled) .md-step__inner{cursor:not-allowed}:host(.md-step--disabled) .md-step__indicator{opacity:0.38}:host(.md-step--disabled) md-ripple,:host(.md-step--disabled) .md-step__state-layer{display:none}.md-step__bubble{position:relative;display:inline-flex;align-items:center;justify-content:center;inline-size:var(--_size);block-size:var(--_size);border-radius:var(--md-sys-shape-corner-full, 9999px);background-color:var(--_color);color:var(--_text);font-family:var(--md-sys-typescale-label-large-font-family, Roboto, sans-serif);font-size:var(--md-sys-typescale-label-large-font-size, 14px);font-weight:var(--md-sys-typescale-label-large-font-weight, 500);line-height:var(--md-sys-typescale-label-large-line-height, 20px);flex-shrink:0;transition:background-color var(--_state-duration) var(--_state-easing), color var(--_state-duration) var(--_state-easing), transform var(--_spring-duration) var(--_spring-easing), box-shadow var(--_spring-duration) var(--_spring-easing)}.md-step__bubble .material-symbols-outlined{font-family:var(--md-sys-icon-font-family, 'Material Symbols Outlined', 'Material Icons');font-size:calc(var(--_size) * 0.56);line-height:1;font-weight:normal;font-style:normal;letter-spacing:normal;text-transform:none;white-space:nowrap;direction:ltr;-webkit-font-smoothing:antialiased;font-variation-settings:'FILL' 0, 'wght' 500, 'GRAD' 0, 'opsz' 24}:host(.md-step--active) .md-step__bubble .material-symbols-outlined,:host(.md-step--completed) .md-step__bubble .material-symbols-outlined,:host(.md-step--error) .md-step__bubble .material-symbols-outlined{font-variation-settings:'FILL' 1, 'wght' 600, 'GRAD' 0, 'opsz' 24}@keyframes md-step-glyph-in{0%{transform:scale(0);opacity:0}60%{transform:scale(1.18);opacity:1}100%{transform:scale(1);opacity:1}}:host(.md-step--completed) .md-step__bubble .material-symbols-outlined,:host(.md-step--error) .md-step__bubble .material-symbols-outlined{animation:md-step-glyph-in var(--_spring-duration) var(--_spring-easing) both}:host(.md-step--active) .md-step__bubble{background-color:var(--_active-color);color:var(--_active-text);transform:scale(1.12);box-shadow:0 0 0 var(--_active-halo-size) color-mix(in srgb, var(--_active-halo) 14%, transparent)}:host(.md-step--completed) .md-step__bubble{background-color:var(--_completed-color);color:var(--_completed-text)}:host(.md-step--error) .md-step__bubble{background-color:var(--_error-color);color:var(--_error-text);animation:md-step-error-pulse var(--md-sys-motion-duration-medium2, 300ms) var(--_state-easing) both}@keyframes md-step-error-pulse{0%{transform:scale(1)}40%{transform:scale(1.08)}100%{transform:scale(1)}}.md-step__dot{display:inline-block;inline-size:var(--_indicator-h);block-size:var(--_indicator-h);border-radius:var(--md-sys-shape-corner-full, 9999px);background-color:var(--_color);flex-shrink:0;transition:background-color var(--_state-duration) var(--_state-easing), box-shadow var(--_spring-duration) var(--_spring-easing), transform var(--_spring-duration) var(--_spring-easing)}:host(.md-step--active) .md-step__dot{background-color:var(--_active-color);transform:scale(1.4);box-shadow:0 0 0 var(--_active-halo-size) color-mix(in srgb, var(--_active-halo) 18%, transparent)}:host(.md-step--completed) .md-step__dot{background-color:var(--_completed-color)}:host(.md-step--error) .md-step__dot{background-color:var(--_error-color)}.md-step__text{display:flex;flex-direction:column;gap:2px;min-inline-size:0}:host(.md-step--horizontal) .md-step__text{align-items:center;text-align:center;max-inline-size:100%}.md-step__label{color:var(--_label-color);font-family:var(--md-sys-typescale-label-large-font-family, Roboto, sans-serif);font-size:max(11px, calc(14px + var(--md-sys-density-scale, 0) * 0.5px));font-weight:var(--md-sys-typescale-label-large-font-weight, 500);line-height:max(16px, calc(20px + var(--md-sys-density-scale, 0) * 1px));transition:color var(--_state-duration) var(--_state-easing), font-variation-settings var(--_state-duration) var(--_state-easing)}:host(.md-step--horizontal) .md-step__label{white-space:normal;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}:host(.md-step--active) .md-step__label{color:var(--_label-active-color);font-weight:600;font-variation-settings:'wght' 600}:host(.md-step--error) .md-step__label{color:var(--_error-color)}:host(.md-step--disabled) .md-step__text{opacity:0.38}.md-step__optional,.md-step__description{color:var(--_description-color);font-family:var(--md-sys-typescale-body-small-font-family, Roboto, sans-serif);font-size:max(10px, calc(12px + var(--md-sys-density-scale, 0) * 0.5px));font-weight:var(--md-sys-typescale-body-small-font-weight, 400);line-height:max(14px, calc(16px + var(--md-sys-density-scale, 0) * 0.5px))}.md-step__optional{font-style:italic}:host(.md-step--error) .md-step__description{color:var(--_error-color)}.md-step__connector{position:relative;flex:1;align-self:center;background-color:var(--_connector);overflow:hidden;border-radius:var(--md-sys-shape-corner-full, 9999px)}.md-step__connector::after{content:'';position:absolute;inset:0;background-color:var(--_connector-filled);border-radius:inherit;transform-origin:left center;transform:scaleX(0);transition:transform var(--_connector-duration) var(--_connector-easing)}.md-step__connector--filled::after{transform:scaleX(1)}:host([dir="rtl"]) .md-step__connector::after,:host-context([dir="rtl"]) .md-step__connector::after{transform-origin:right center}:host(.md-step--horizontal) .md-step__connector--trailing{position:absolute;inset-block-start:calc(var(--_indicator-pad) + var(--_indicator-ring) + var(--_indicator-h) / 2);transform:translateY(-50%);block-size:var(--_connector-thickness);inset-inline-start:calc(50% + var(--_indicator-h) / 2 + var(--_connector-gap));inline-size:calc(100% - var(--_indicator-h) - 2 * var(--_connector-gap));flex:none;align-self:auto;z-index:0}:host(.md-step--vertical) .md-step__connector{position:absolute;flex:none;align-self:auto;z-index:0;inline-size:var(--_connector-thickness);inset-inline-start:calc(8px + var(--_indicator-ring) + (var(--_indicator-h) - var(--_connector-thickness)) / 2)}:host(.md-step--vertical) .md-step__connector--leading{display:none}:host(.md-step--vertical) .md-step__connector--trailing{inset-block-start:calc(var(--_indicator-ring) + var(--_indicator-h) + var(--_connector-gap));inset-block-end:calc(var(--_connector-gap) - var(--_indicator-ring))}:host(.md-step--vertical) .md-step__connector::after{transform-origin:center top;transform:scaleY(0)}:host(.md-step--vertical) .md-step__connector--filled::after{transform:scaleY(1)}.md-step__content{flex:1 1 100%;display:grid;grid-template-rows:0fr;opacity:0;visibility:hidden;margin-inline-start:calc(8px + var(--_indicator-h) + 2 * var(--_indicator-ring) + var(--md-sys-spacing-gap-md, 12px));color:var(--md-sys-color-on-surface, #1C1B1F);transition:grid-template-rows var(--_collapse-duration) var(--_collapse-easing), opacity var(--_collapse-duration) var(--_collapse-easing), visibility 0s linear var(--_collapse-duration)}.md-step__content--open{grid-template-rows:1fr;opacity:1;visibility:visible;transition:grid-template-rows var(--_expand-duration) var(--_expand-easing), opacity var(--_state-duration) var(--_state-easing), visibility 0s}.md-step__content-sizer{min-block-size:0;overflow:hidden}.md-step__content-inner{padding-block-start:var(--md-sys-spacing-inset-xs, 4px);padding-block-end:var(--md-sys-spacing-inset-lg, 16px)}.md-step__content--lazy{display:block;grid-template-rows:none;opacity:1;visibility:visible;transition:none;animation:md-step-content-enter var(--_expand-duration) var(--_expand-easing) both}.md-step__content--lazy .md-step__content-sizer{overflow:visible}@keyframes md-step-content-enter{from{opacity:0;transform:translateY(-6px)}}.md-step__actions{display:flex;gap:var(--md-sys-spacing-gap-sm, 8px);margin-block-start:var(--md-sys-spacing-gap-lg, 16px)}@media (max-width: 599px){:host(.md-step--horizontal){--_size:var(--md-step-indicator-size, 28px);--_connector-gap:8px}:host(.md-step--horizontal) .md-step__inner{gap:var(--md-sys-spacing-gap-xs, 4px);padding-inline:var(--md-sys-spacing-inset-xs, 4px)}:host(.md-step--horizontal) .md-step__label{font-size:var(--md-sys-typescale-label-medium-font-size, 12px);line-height:var(--md-sys-typescale-label-medium-line-height, 16px)}:host(.md-step--horizontal) .md-step__optional,:host(.md-step--horizontal) .md-step__description{display:none}}@media (prefers-reduced-motion: reduce){:host{animation:none !important}.md-step__bubble,.md-step__dot,.md-step__connector,.md-step__connector::after,.md-step__state-layer,.md-step__label,.md-step__content,.md-step__bubble .material-symbols-outlined{transition-duration:0.01ms !important;transition-delay:0s !important;animation:none !important}:host(.md-step--active) .md-step__bubble,:host(.md-step--active) .md-step__dot{transform:none;box-shadow:0 0 0 3px color-mix(in srgb, var(--_active-halo) 25%, transparent)}}@media (forced-colors: active){.md-step__bubble,.md-step__dot{background-color:Canvas;border:2px solid CanvasText;forced-color-adjust:none}:host(.md-step--active) .md-step__bubble,:host(.md-step--completed) .md-step__bubble{background-color:Highlight;color:HighlightText}.md-step__connector{background-color:GrayText;forced-color-adjust:none}.md-step__connector::after{background-color:Highlight}.md-step__state-layer{display:none}.md-step__inner:focus-visible .md-step__indicator{box-shadow:0 0 0 3px Highlight}}:host([density='-1']){--md-sys-density-scale:-1}:host([density='-2']){--md-sys-density-scale:-2}:host([density='-3']){--md-sys-density-scale:-3}:host([density='-4']){--md-sys-density-scale:-4}:host([hidden]){display:none !important}`;const c=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.mdStepClick=s(this,"mdStepClick",5);this.mdStepNext=s(this,"mdStepNext",5);this.mdStepBack=s(this,"mdStepBack",5);this.label="";this.description="";this.completed=false;this.active=false;this.error=false;this.errorText="";this.disabled=false;this.optional=false;this.editable=false;this.icon="";this.completedIcon="check";this.errorIcon="priority_high";this.hideActions=false;this.density=0;this.hasSlottedContent=false;this.handleClick=t=>{if(this.effectivelyDisabled)return;t.preventDefault();this.mdStepClick.emit({index:this.index})};this.handleKeyDown=t=>{if(this.effectivelyDisabled)return;if(t.key==="Enter"||t.key===" "){t.preventDefault();o(this.el);this.mdStepClick.emit({index:this.index})}};this.emitNext=()=>this.mdStepNext.emit({index:this.index});this.emitBack=()=>this.mdStepBack.emit({index:this.index})}attr(t,e=""){const s=this.el.getAttribute(t);return s!=null&&s!==""?s:e}get index(){return Number(this.attr("data-index","0"))}get total(){return Number(this.attr("data-total","0"))}get activeIndex(){return Number(this.attr("data-active","0"))}get position(){return this.el.getAttribute("data-position")??"first"}get orientation(){return this.el.getAttribute("data-orientation")??"horizontal"}get indicatorKind(){return this.el.getAttribute("data-indicator")??"numbered"}get linearMode(){return this.el.getAttribute("data-mode")==="linear"}connectedCallback(){this.computeSlottedContent();if(typeof MutationObserver!=="undefined"){this.contentObserver=new MutationObserver((()=>this.computeSlottedContent()));this.contentObserver.observe(this.el,{childList:true})}}disconnectedCallback(){this.contentObserver?.disconnect();this.contentObserver=undefined}computeSlottedContent(){this.hasSlottedContent=Array.from(this.el.childNodes).some((t=>t.nodeType===Node.ELEMENT_NODE||t.nodeType===Node.TEXT_NODE&&(t.textContent??"").trim()!==""))}stepSiblings(){const t=this.el.parentElement;if(!t)return[];return Array.from(t.children).filter((t=>t.tagName.toLowerCase()==="md-step"))}allPriorPassable(){const t=this.stepSiblings();for(let e=0;e<this.index;e++){const s=t[e];if(!s?.completed&&!s?.optional)return false}return true}get reachable(){if(!this.linearMode)return true;return this.index<=this.activeIndex||this.completed||this.allPriorPassable()}get effectivelyDisabled(){return this.disabled||!this.reachable}onInternalMdClick(t){if(t.target===this.el)t.stopPropagation()}glyph(t){return a("span",{class:"md-step__bubble",part:"bubble","aria-hidden":"true"},a("span",{class:"material-symbols-outlined"},t))}renderIndicator(){if(this.indicatorKind==="dot"){return a("span",{class:"md-step__dot",part:"dot","aria-hidden":"true"})}if(this.error)return this.glyph(this.errorIcon);if(this.icon)return this.glyph(this.icon);if(this.completed)return this.glyph(this.editable?"edit":this.completedIcon);return a("span",{class:"md-step__bubble",part:"bubble","aria-hidden":"true"},this.index+1)}composeA11yLabel(){if(this.accessibleName?.trim())return this.accessibleName;const t=(t,e)=>this.attr(t,e);let e=`${t("data-step-word","Step")} ${this.index+1} ${t("data-of-word","of")} ${this.total}`;if(this.label)e+=`: ${this.label}`;if(this.optional)e+=`, ${t("data-optional-word","optional")}`;if(this.completed)e+=`, ${t("data-completed-word","completed")}`;if(this.active)e+=`, ${t("data-current-word","current")}`;if(this.error)e+=`, ${t("data-error-word","error")}${this.errorText?`: ${this.errorText}`:""}`;return e}render(){const t=this.position==="first";const e=this.position==="last";const s=this.orientation==="vertical";const r=this.effectivelyDisabled;const o=this.error&&this.errorText?this.errorText:this.description;const n=this.optional?this.attr("data-optional-word","Optional"):"";const d=this.attr("data-nav","true")!=="false"&&!this.hideActions;const l=this.attr("data-loading","false")==="true";const c=this.attr("data-next-disabled","false")==="true";const p=this.attr("data-lazy","false")==="true";const m=this.attr("data-panel-mode","shared");const _=s?this.hasSlottedContent||d:m==="step"&&this.hasSlottedContent;const h=_&&(!p||this.active);const v=[!t&&s&&a("span",{key:"1b11ef300c7e3a6a10a88e4d381d671fab4452b0",class:{"md-step__connector":true,"md-step__connector--leading":true,"md-step__connector--filled":this.index<=this.activeIndex},part:"connector connector-leading","aria-hidden":"true"}),a("div",{key:"fbd77cd1307d4b39f22c4d057762751ef9cc2d3c",class:"md-step__inner",part:"inner",tabindex:r?-1:0,role:"button","aria-label":this.composeA11yLabel(),"aria-disabled":r?"true":undefined,"aria-current":this.active?"step":undefined,"aria-expanded":_?this.active?"true":"false":undefined,"aria-controls":h?"md-step-panel":undefined,onClick:this.handleClick,onKeyDown:this.handleKeyDown},a("span",{key:"39982e61c1d19148851c685165a5c1ae779598f7",class:"md-step__indicator",part:"indicator"},a("md-ripple",{key:"6abca487aaebe721a66710c18b8e348dde382af5",disabled:r}),a("span",{key:"501e2c4896f89d5ed101de6f6a9bf0ddc6e06313",class:"md-step__state-layer",part:"state-layer","aria-hidden":"true"}),this.renderIndicator()),(this.label||o||n)&&a("span",{key:"d91905dc67ccfa16cc9d6c9cec7d8f017b70291d",class:"md-step__text",part:"text"},this.label&&a("span",{key:"62f2f968cabf2850dddae7de188a686990d1b307",class:"md-step__label",part:"label"},this.label),n&&a("span",{key:"6e5ffc06d7a45ffe3c452d181dc988a6df8f779b",class:"md-step__optional",part:"optional"},n),o&&a("span",{key:"a87cba9672984bf2e21f80b712c9381e9991b4d0",class:"md-step__description",part:"description"},o))),!e&&a("span",{key:"c31636170a77ec54727897e958539eaa19d21089",class:{"md-step__connector":true,"md-step__connector--trailing":true,"md-step__connector--filled":this.index<this.activeIndex},part:"connector connector-trailing","aria-hidden":"true"})];const f=!s&&_;return a(i,{key:"7727315d99eb8e9224de4bb7fd4c82460e65466e",class:{"md-step":true,[`md-step--${this.orientation}`]:true,[`md-step--indicator-${this.indicatorKind}`]:true,"md-step--active":this.active,"md-step--completed":this.completed,"md-step--error":this.error,"md-step--optional":this.optional,"md-step--editable":this.editable,"md-step--disabled":r,"md-step--first":t,"md-step--last":e,"md-step--panel-step":!s&&_},role:"listitem","aria-current":this.active?"step":undefined,"aria-disabled":r?"true":undefined},f?a("div",{class:"md-step__header"},v):v,h&&a("div",{key:"1ef0c0e80197a25d55fd4cd6a554278d99f40029",id:"md-step-panel",class:{"md-step__content":true,"md-step__content--open":this.active,"md-step__content--lazy":p},part:"content",role:"region","aria-label":this.label||this.composeA11yLabel()},a("div",{key:"81978d423d3b98f3fa04ab3a99b8c46e8e522184",class:"md-step__content-sizer"},a("div",{key:"fa2f439127d914dbd6aaef0d844819f0e3fd13a5",class:"md-step__content-inner"},a("slot",{key:"13eba3fb64b6ddaf4acdd369e88cb2fb847a4b7e"}),d&&s&&a("div",{key:"c5c0852ed5722c3eec2d1aec4cc39dc4adc03cf6",class:"md-step__actions",part:"actions"},a("md-button",{key:"d0583c8a714a0e484546f809f627e114d1afae75",variant:"text",size:"sm",disabled:t||l,onClick:this.emitBack},this.attr("data-back-label","Back")),a("md-button",{key:"3f95fff1451d2385399fd0301b69b5022c45fd99",variant:"filled",size:"sm",loading:l,disabled:c||l,onClick:this.emitNext},e?this.attr("data-finish-label","Finish"):this.attr("data-next-label","Continue")))))))}get el(){return this}static get style(){return l()}},[257,"md-step",{label:[1],description:[1],completed:[516],active:[1540],error:[516],errorText:[1,"error-text"],disabled:[516],optional:[516],editable:[516],icon:[1],completedIcon:[1,"completed-icon"],errorIcon:[1,"error-icon"],accessibleName:[1,"accessible-name"],hideActions:[516,"hide-actions"],density:[514],hasSlottedContent:[32]},[[0,"mdClick","onInternalMdClick"]]]);function p(){if(typeof customElements==="undefined"){return}const t=["md-step","md-button","md-ripple"];t.forEach((t=>{switch(t){case"md-step":if(!customElements.get(r(t))){customElements.define(r(t),c)}break;case"md-button":if(!customElements.get(r(t))){n()}break;case"md-ripple":if(!customElements.get(r(t))){d()}break}}))}p();const m=c;const _=p;export{m as MdStep,_ as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=md-step.js.map
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
import{p as t,H as e,c as i,f as s,h as a,d as n,t as o}from"./p-CB5yqdO-.js";import{d as r}from"./p-C1RN8YA1.js";import{d}from"./p-CvxKUiKT.js";const h=()=>`:host{display:block;inline-size:100%;box-sizing:border-box;font-family:var(--md-sys-typescale-body-large-font-family, Roboto, sans-serif);color:var(--md-sys-color-on-surface, #1C1B1F)}.md-stepper__live{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.md-stepper__list{list-style:none;margin:0;padding:0;display:flex}:host(.md-stepper--horizontal[data-panel-mode='step']) .md-stepper__list{display:grid;grid-template-columns:repeat(var(--md-stepper-step-count, 1), 1fr);align-items:start}:host(.md-stepper--horizontal) .md-stepper__list{flex-direction:row;align-items:flex-start}:host(.md-stepper--vertical) .md-stepper__list{flex-direction:column;gap:var(--md-stepper-gap, 0)}.md-stepper__content ::slotted(*){display:block;margin-block-start:var(--md-sys-spacing-inset-xl, 24px)}.md-stepper__nav{display:flex;gap:var(--md-sys-spacing-gap-sm, 8px);justify-content:flex-end;margin-block-start:max(4px, calc(20px + var(--md-sys-density-scale, 0) * 2px))}:host(.md-stepper--mobile) .md-stepper__list{display:none}.md-stepper__mobile{display:flex;align-items:center;gap:var(--md-sys-spacing-gap-sm, 8px);margin-block-start:var(--md-sys-spacing-gap-lg, 16px)}.md-stepper__mobile-progress{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--md-sys-spacing-gap-sm, 8px);min-inline-size:0}.md-stepper__mobile-text{font-family:var(--md-sys-typescale-label-large-font-family, Roboto, sans-serif);font-size:var(--md-sys-typescale-label-large-font-size, 14px);font-weight:var(--md-sys-typescale-label-large-font-weight, 500);line-height:var(--md-sys-typescale-label-large-line-height, 20px);color:var(--md-sys-color-on-surface-variant, #49454F)}.md-stepper__mobile-dot{inline-size:8px;block-size:8px;border-radius:var(--md-sys-shape-corner-full, 9999px);background-color:var(--md-step-connector-color, var(--md-sys-color-outline, #79747E));transition:background-color var(--md-sys-motion-spring-effects-default-duration, 200ms) var(--md-sys-motion-spring-effects-default-easing, cubic-bezier(0.34, 0.80, 0.34, 1.00)), transform var(--md-sys-motion-spring-spatial-default-duration, 500ms) var(--md-sys-motion-spring-spatial-default-easing, cubic-bezier(0.38, 1.21, 0.22, 1.00))}.md-stepper__mobile-dot.is-done{background-color:var(--md-step-active-color, var(--md-sys-color-primary, #6750A4))}.md-stepper__mobile-dot.is-active{background-color:var(--md-step-active-color, var(--md-sys-color-primary, #6750A4));transform:scale(1.5)}@media (prefers-reduced-motion: reduce){.md-stepper__mobile-dot{transition-duration:0.01ms}.md-stepper__mobile-dot.is-active{transform:none}}@media (forced-colors: active){.md-stepper__mobile-dot{background-color:GrayText;forced-color-adjust:none}.md-stepper__mobile-dot.is-done,.md-stepper__mobile-dot.is-active{background-color:Highlight}}:host([density='-1']){--md-sys-density-scale:-1}:host([density='-2']){--md-sys-density-scale:-2}:host([density='-3']){--md-sys-density-scale:-3}:host([density='-4']){--md-sys-density-scale:-4}:host([hidden]){display:none !important}`;const l=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.mdBeforeChange=i(this,"mdBeforeChange",7);this.mdStepChange=i(this,"mdStepChange",7);this.mdComplete=i(this,"mdComplete",7);this.orientation="horizontal";this.indicator="numbered";this.variant="default";this.mode="linear";this.active=0;this.autoComplete=true;this.nav=true;this.nextDisabled=false;this.loading=false;this.lazy=false;this.label="Progress";this.stepWord="Step";this.ofWord="of";this.completedWord="completed";this.currentWord="current";this.errorWord="error";this.optionalWord="Optional";this.nextLabel="Continue";this.backLabel="Back";this.finishLabel="Finish";this.density=0;this.stepCount=0;this.liveMessage="";this.errorMessage="";this.steps=[];this.lastActive=0;this.handleSlotChange=()=>{this.collectSteps();const t=this.clampToValidStep(this.active);if(t!==this.active){this.active=t}else{this.syncSteps()}};this.handleFooterBack=async()=>{await this.prev();if(this.active===0)this.focusActiveStep()}}componentWillLoad(){this.collectSteps();this.active=this.clampToValidStep(this.active);this.lastActive=this.active;this.syncSteps()}componentDidLoad(){this.syncSteps();this.observeStepState()}disconnectedCallback(){this.stepObserver?.disconnect();this.stepObserver=undefined}onActiveChange(t){this.collectSteps();const e=this.clampToValidStep(t);if(e!==t){this.active=e;return}const i=this.lastActive;if(e===i)return;this.lastActive=e;if(this.autoComplete){this.mutatingSelf((()=>{if(e>i){this.steps.forEach(((t,s)=>{if(s>=i&&s<e&&!t.disabled){t.completed=true;t.error=false}}))}else{const t=this.steps[e];if(!(t?.editable&&t?.completed)){this.steps.forEach(((t,i)=>{if(i>=e)t.completed=false}))}}}))}this.syncSteps();this.mdStepChange.emit({index:e,previous:i});this.announceStep(e)}onConfigChange(){this.syncSteps()}ownsStepEvent(t){const e=t.target;return!!e&&e.parentElement===this.el&&e.tagName.toLowerCase()==="md-step"}onStepClick(t){if(!this.ownsStepEvent(t))return;t.stopPropagation();const e=t.detail.index;if(e===this.active)return;if(this.canNavigateTo(e))this.commitChange(e)}async onStepNext(t){if(!this.ownsStepEvent(t))return;t.stopPropagation();const e=this.active;await this.next();if(this.active!==e)this.focusActiveStep()}async onStepBack(t){if(!this.ownsStepEvent(t))return;t.stopPropagation();const e=this.active;await this.prev();if(this.active!==e)this.focusActiveStep()}onInternalMdClick(t){if(t.target===this.el)t.stopPropagation()}async next(){this.collectSteps();if(this.steps.length===0)return;let t=this.active+1;while(t<this.steps.length&&this.steps[t].disabled)t++;if(t>=this.steps.length){const t=this.steps[this.active];if(this.autoComplete&&t&&!t.disabled){this.mutatingSelf((()=>{t.completed=true;t.error=false}))}this.syncSteps();this.mdComplete.emit();return}this.commitChange(t)}async prev(){this.collectSteps();let t=this.active-1;while(t>=0&&this.steps[t]?.disabled)t--;if(t<0)return;this.commitChange(t)}async goTo(t){this.collectSteps();const e=this.clampToValidStep(t);if(this.canNavigateTo(e))this.commitChange(e)}async reset(){this.collectSteps();this.mutatingSelf((()=>{this.steps.forEach((t=>{t.completed=false;t.error=false}))}));this.active=0;this.syncSteps()}commitChange(t){if(t===this.active)return false;const e=this.mdBeforeChange.emit({index:t,previous:this.active});if(e.defaultPrevented)return false;this.active=t;return true}observeStepState(){if(typeof MutationObserver==="undefined")return;this.stepObserver=new MutationObserver((t=>{let e=null;for(const i of t){if(i.attributeName==="error"){const t=i.target;if(t.error&&t.tagName.toLowerCase()==="md-step")e=t}}this.syncSteps();if(e)this.announceError(e)}));this.attachObserver()}attachObserver(){this.stepObserver?.observe(this.el,{subtree:true,attributes:true,attributeFilter:["completed","error","optional","disabled"]})}mutatingSelf(t){this.stepObserver?.disconnect();try{t()}finally{this.attachObserver()}}announceStep(t){const e=this.steps[t];if(!e)return;let i=`${this.stepWord} ${t+1} ${this.ofWord} ${this.stepCount}`;if(e.label)i+=`: ${e.label}`;if(e.optional)i+=`, ${this.optionalWord}`;if(e.completed)i+=`, ${this.completedWord}`;i+=`, ${this.currentWord}`;this.liveMessage=i}announceError(t){const e=this.steps.indexOf(t);let i=`${this.stepWord} ${e+1} ${this.ofWord} ${this.stepCount}`;if(t.label)i+=`: ${t.label}`;i+=`, ${this.errorWord}`;if(t.errorText)i+=`: ${t.errorText}`;this.errorMessage=i}canNavigateTo(t){this.collectSteps();const e=this.steps[t];if(!e||e.disabled)return false;if(this.mode!=="linear")return true;if(t<=this.active)return true;if(e.completed)return true;return this.steps.slice(0,t).every((t=>t.completed||t.optional))}clampToValidStep(t){if(this.steps.length===0)return 0;return Math.max(0,Math.min(this.steps.length-1,t|0))}collectSteps(){this.steps=Array.from(this.el.children).filter((t=>t.tagName.toLowerCase()==="md-step"))}focusActiveStep(){const t=this.steps[this.active];t?.shadowRoot?.querySelector(".md-step__inner")?.focus()}static hasOwnContent(t){return Array.from(t.childNodes).some((t=>t.nodeType===Node.ELEMENT_NODE||t.nodeType===Node.TEXT_NODE&&(t.textContent??"").trim()!==""))}syncSteps(){this.collectSteps();const e=this.steps.length;this.stepCount=e;const i=this.orientation==="horizontal"&&this.steps.some((e=>t.hasOwnContent(e)))?"step":"shared";if(this.el.getAttribute("data-panel-mode")!==i){this.el.setAttribute("data-panel-mode",i)}this.el.style.setProperty("--md-stepper-step-count",String(e));this.steps.forEach(((t,a)=>{const n=(e,i)=>{if(t.getAttribute(e)!==i)t.setAttribute(e,i)};n("data-index",String(a));n("data-total",String(e));n("data-active",String(this.active));n("data-orientation",this.orientation);n("data-indicator",this.indicator);n("data-mode",this.mode);n("data-position",a===0?"first":a===e-1?"last":"middle");n("data-step-word",this.stepWord);n("data-of-word",this.ofWord);n("data-completed-word",this.completedWord);n("data-current-word",this.currentWord);n("data-error-word",this.errorWord);n("data-optional-word",this.optionalWord);n("data-next-label",this.nextLabel);n("data-back-label",this.backLabel);n("data-finish-label",this.finishLabel);n("data-nav",String(this.nav));n("data-loading",String(this.loading));n("data-next-disabled",String(this.nextDisabled));n("data-lazy",String(this.lazy));n("data-panel-mode",i);t.style.setProperty("--md-step-idx",String(a));const o=a===this.active;if(t.active!==o)t.active=o;s(t)}))}render(){const t=this.variant==="mobile";return a(n,{key:"569f9d044b7e5693025b19e0bff8f68b6379597f",class:{"md-stepper":true,[`md-stepper--${this.orientation}`]:true,[`md-stepper--indicator-${this.indicator}`]:true,[`md-stepper--mode-${this.mode}`]:true,"md-stepper--mobile":t},role:"navigation","aria-label":this.label},a("div",{key:"ea0661506375bfe750cbe58eee1da89031b990b2",class:"md-stepper__live","aria-live":"polite",role:"status"},this.liveMessage),a("div",{key:"5109efa0ac855fad4e193643833a0fdaf95f50a5",class:"md-stepper__live","aria-live":"assertive",role:"alert"},this.errorMessage),a("ol",{key:"65f6e7d001531375308dde02062d6176448ff1b2",class:"md-stepper__list",part:"list"},a("slot",{key:"5d21a8a221e4af58b7cd3496e8e8713f52dd85a7",onSlotchange:this.handleSlotChange})),a("div",{key:"c99327034c1d5238d49cbbd8464cd70860ca5a9c",class:"md-stepper__content",part:"content"},a("slot",{key:"675ff6a75573bb1617315db767bf65269cfa41d8",name:"content"})),this.nav&&!t&&this.orientation==="horizontal"&&this.stepCount>0&&a("div",{key:"03f70ca6b70fe73a241c1f7de05c1f114413b4e5",class:"md-stepper__nav",part:"nav"},a("md-button",{key:"69cbd3e26b6bf93d9cac271e7b3e99081936a356",variant:"text",size:"sm",disabled:this.active<=0||this.loading,onClick:this.handleFooterBack},this.backLabel),a("md-button",{key:"80dc73ee013d3fc627adb25e9602a51954571d37",variant:"filled",size:"sm",loading:this.loading,disabled:this.nextDisabled||this.loading,onClick:()=>this.next()},this.active>=this.stepCount-1?this.finishLabel:this.nextLabel)),this.nav&&t&&this.stepCount>0&&a("div",{key:"ecddf275577b6e0b7101feb53c731d2c568a27cb",class:"md-stepper__mobile",part:"mobile-nav"},a("md-button",{key:"4ef88060e3d6a59adbc9d51779dc9c7ce87f77e1",variant:"text",size:"sm",disabled:this.active<=0||this.loading,onClick:this.handleFooterBack},this.backLabel),a("div",{key:"98e67c3372d60520bfef7991fda5cf876205e993",class:"md-stepper__mobile-progress",part:"mobile-progress","aria-hidden":this.indicator==="dot"?"true":undefined},this.indicator==="dot"?this.steps.map(((t,e)=>a("span",{class:{"md-stepper__mobile-dot":true,"is-active":e===this.active,"is-done":e<this.active||!!t.completed}}))):a("span",{class:"md-stepper__mobile-text"},`${this.stepWord} ${this.active+1} ${this.ofWord} ${this.stepCount}`)),a("md-button",{key:"edbb884f6e7697ae9b5ac30b38f2b00426be7f60",variant:"filled",size:"sm",loading:this.loading,disabled:this.nextDisabled||this.loading,onClick:()=>this.next()},this.active>=this.stepCount-1?this.finishLabel:this.nextLabel)))}get el(){return this}static get watchers(){return{active:[{onActiveChange:0}],orientation:[{onConfigChange:0}],indicator:[{onConfigChange:0}],mode:[{onConfigChange:0}],nav:[{onConfigChange:0}],variant:[{onConfigChange:0}],lazy:[{onConfigChange:0}],loading:[{onConfigChange:0}],nextDisabled:[{onConfigChange:0}],stepWord:[{onConfigChange:0}],ofWord:[{onConfigChange:0}],completedWord:[{onConfigChange:0}],currentWord:[{onConfigChange:0}],errorWord:[{onConfigChange:0}],optionalWord:[{onConfigChange:0}],nextLabel:[{onConfigChange:0}],backLabel:[{onConfigChange:0}],finishLabel:[{onConfigChange:0}]}}static get style(){return h()}},[257,"md-stepper",{orientation:[513],indicator:[513],variant:[513],mode:[513],active:[1538],autoComplete:[4,"auto-complete"],nav:[4],nextDisabled:[4,"next-disabled"],loading:[4],lazy:[4],label:[1],stepWord:[1,"step-word"],ofWord:[1,"of-word"],completedWord:[1,"completed-word"],currentWord:[1,"current-word"],errorWord:[1,"error-word"],optionalWord:[1,"optional-word"],nextLabel:[1,"next-label"],backLabel:[1,"back-label"],finishLabel:[1,"finish-label"],density:[514],stepCount:[32],liveMessage:[32],errorMessage:[32],next:[64],prev:[64],goTo:[64],reset:[64]},[[0,"mdStepClick","onStepClick"],[0,"mdStepNext","onStepNext"],[0,"mdStepBack","onStepBack"],[0,"mdClick","onInternalMdClick"]],{active:[{onActiveChange:0}],orientation:[{onConfigChange:0}],indicator:[{onConfigChange:0}],mode:[{onConfigChange:0}],nav:[{onConfigChange:0}],variant:[{onConfigChange:0}],lazy:[{onConfigChange:0}],loading:[{onConfigChange:0}],nextDisabled:[{onConfigChange:0}],stepWord:[{onConfigChange:0}],ofWord:[{onConfigChange:0}],completedWord:[{onConfigChange:0}],currentWord:[{onConfigChange:0}],errorWord:[{onConfigChange:0}],optionalWord:[{onConfigChange:0}],nextLabel:[{onConfigChange:0}],backLabel:[{onConfigChange:0}],finishLabel:[{onConfigChange:0}]}]);function c(){if(typeof customElements==="undefined"){return}const t=["md-stepper","md-button","md-ripple"];t.forEach((t=>{switch(t){case"md-stepper":if(!customElements.get(o(t))){customElements.define(o(t),l)}break;case"md-button":if(!customElements.get(o(t))){r()}break;case"md-ripple":if(!customElements.get(o(t))){d()}break}}))}c();const p=l;const f=c;export{p as MdStepper,f as defineCustomElement};
|
|
1
|
+
import{p as t,H as e,c as i,f as s,h as a,d as n,t as o}from"./p-CB5yqdO-.js";import{d as r}from"./p-BTgac9TA.js";import{d}from"./p-CvxKUiKT.js";const h=()=>`:host{display:block;inline-size:100%;box-sizing:border-box;font-family:var(--md-sys-typescale-body-large-font-family, Roboto, sans-serif);color:var(--md-sys-color-on-surface, #1C1B1F)}.md-stepper__live{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.md-stepper__list{list-style:none;margin:0;padding:0;display:flex}:host(.md-stepper--horizontal[data-panel-mode='step']) .md-stepper__list{display:grid;grid-template-columns:repeat(var(--md-stepper-step-count, 1), 1fr);align-items:start}:host(.md-stepper--horizontal) .md-stepper__list{flex-direction:row;align-items:flex-start}:host(.md-stepper--vertical) .md-stepper__list{flex-direction:column;gap:var(--md-stepper-gap, 0)}.md-stepper__content ::slotted(*){display:block;margin-block-start:var(--md-sys-spacing-inset-xl, 24px)}.md-stepper__nav{display:flex;gap:var(--md-sys-spacing-gap-sm, 8px);justify-content:flex-end;margin-block-start:max(4px, calc(20px + var(--md-sys-density-scale, 0) * 2px))}:host(.md-stepper--mobile) .md-stepper__list{display:none}.md-stepper__mobile{display:flex;align-items:center;gap:var(--md-sys-spacing-gap-sm, 8px);margin-block-start:var(--md-sys-spacing-gap-lg, 16px)}.md-stepper__mobile-progress{flex:1;display:flex;align-items:center;justify-content:center;gap:var(--md-sys-spacing-gap-sm, 8px);min-inline-size:0}.md-stepper__mobile-text{font-family:var(--md-sys-typescale-label-large-font-family, Roboto, sans-serif);font-size:var(--md-sys-typescale-label-large-font-size, 14px);font-weight:var(--md-sys-typescale-label-large-font-weight, 500);line-height:var(--md-sys-typescale-label-large-line-height, 20px);color:var(--md-sys-color-on-surface-variant, #49454F)}.md-stepper__mobile-dot{inline-size:8px;block-size:8px;border-radius:var(--md-sys-shape-corner-full, 9999px);background-color:var(--md-step-connector-color, var(--md-sys-color-outline, #79747E));transition:background-color var(--md-sys-motion-spring-effects-default-duration, 200ms) var(--md-sys-motion-spring-effects-default-easing, cubic-bezier(0.34, 0.80, 0.34, 1.00)), transform var(--md-sys-motion-spring-spatial-default-duration, 500ms) var(--md-sys-motion-spring-spatial-default-easing, cubic-bezier(0.38, 1.21, 0.22, 1.00))}.md-stepper__mobile-dot.is-done{background-color:var(--md-step-active-color, var(--md-sys-color-primary, #6750A4))}.md-stepper__mobile-dot.is-active{background-color:var(--md-step-active-color, var(--md-sys-color-primary, #6750A4));transform:scale(1.5)}@media (prefers-reduced-motion: reduce){.md-stepper__mobile-dot{transition-duration:0.01ms}.md-stepper__mobile-dot.is-active{transform:none}}@media (forced-colors: active){.md-stepper__mobile-dot{background-color:GrayText;forced-color-adjust:none}.md-stepper__mobile-dot.is-done,.md-stepper__mobile-dot.is-active{background-color:Highlight}}:host([density='-1']){--md-sys-density-scale:-1}:host([density='-2']){--md-sys-density-scale:-2}:host([density='-3']){--md-sys-density-scale:-3}:host([density='-4']){--md-sys-density-scale:-4}:host([hidden]){display:none !important}`;const l=t(class t extends e{constructor(t){super();if(t!==false){this.__registerHost()}this.__attachShadow();this.mdBeforeChange=i(this,"mdBeforeChange",7);this.mdStepChange=i(this,"mdStepChange",7);this.mdComplete=i(this,"mdComplete",7);this.orientation="horizontal";this.indicator="numbered";this.variant="default";this.mode="linear";this.active=0;this.autoComplete=true;this.nav=true;this.nextDisabled=false;this.loading=false;this.lazy=false;this.label="Progress";this.stepWord="Step";this.ofWord="of";this.completedWord="completed";this.currentWord="current";this.errorWord="error";this.optionalWord="Optional";this.nextLabel="Continue";this.backLabel="Back";this.finishLabel="Finish";this.density=0;this.stepCount=0;this.liveMessage="";this.errorMessage="";this.steps=[];this.lastActive=0;this.handleSlotChange=()=>{this.collectSteps();const t=this.clampToValidStep(this.active);if(t!==this.active){this.active=t}else{this.syncSteps()}};this.handleFooterBack=async()=>{await this.prev();if(this.active===0)this.focusActiveStep()}}componentWillLoad(){this.collectSteps();this.active=this.clampToValidStep(this.active);this.lastActive=this.active;this.syncSteps()}componentDidLoad(){this.syncSteps();this.observeStepState()}disconnectedCallback(){this.stepObserver?.disconnect();this.stepObserver=undefined}onActiveChange(t){this.collectSteps();const e=this.clampToValidStep(t);if(e!==t){this.active=e;return}const i=this.lastActive;if(e===i)return;this.lastActive=e;if(this.autoComplete){this.mutatingSelf((()=>{if(e>i){this.steps.forEach(((t,s)=>{if(s>=i&&s<e&&!t.disabled){t.completed=true;t.error=false}}))}else{const t=this.steps[e];if(!(t?.editable&&t?.completed)){this.steps.forEach(((t,i)=>{if(i>=e)t.completed=false}))}}}))}this.syncSteps();this.mdStepChange.emit({index:e,previous:i});this.announceStep(e)}onConfigChange(){this.syncSteps()}ownsStepEvent(t){const e=t.target;return!!e&&e.parentElement===this.el&&e.tagName.toLowerCase()==="md-step"}onStepClick(t){if(!this.ownsStepEvent(t))return;t.stopPropagation();const e=t.detail.index;if(e===this.active)return;if(this.canNavigateTo(e))this.commitChange(e)}async onStepNext(t){if(!this.ownsStepEvent(t))return;t.stopPropagation();const e=this.active;await this.next();if(this.active!==e)this.focusActiveStep()}async onStepBack(t){if(!this.ownsStepEvent(t))return;t.stopPropagation();const e=this.active;await this.prev();if(this.active!==e)this.focusActiveStep()}onInternalMdClick(t){if(t.target===this.el)t.stopPropagation()}async next(){this.collectSteps();if(this.steps.length===0)return;let t=this.active+1;while(t<this.steps.length&&this.steps[t].disabled)t++;if(t>=this.steps.length){const t=this.steps[this.active];if(this.autoComplete&&t&&!t.disabled){this.mutatingSelf((()=>{t.completed=true;t.error=false}))}this.syncSteps();this.mdComplete.emit();return}this.commitChange(t)}async prev(){this.collectSteps();let t=this.active-1;while(t>=0&&this.steps[t]?.disabled)t--;if(t<0)return;this.commitChange(t)}async goTo(t){this.collectSteps();const e=this.clampToValidStep(t);if(this.canNavigateTo(e))this.commitChange(e)}async reset(){this.collectSteps();this.mutatingSelf((()=>{this.steps.forEach((t=>{t.completed=false;t.error=false}))}));this.active=0;this.syncSteps()}commitChange(t){if(t===this.active)return false;const e=this.mdBeforeChange.emit({index:t,previous:this.active});if(e.defaultPrevented)return false;this.active=t;return true}observeStepState(){if(typeof MutationObserver==="undefined")return;this.stepObserver=new MutationObserver((t=>{let e=null;for(const i of t){if(i.attributeName==="error"){const t=i.target;if(t.error&&t.tagName.toLowerCase()==="md-step")e=t}}this.syncSteps();if(e)this.announceError(e)}));this.attachObserver()}attachObserver(){this.stepObserver?.observe(this.el,{subtree:true,attributes:true,attributeFilter:["completed","error","optional","disabled"]})}mutatingSelf(t){this.stepObserver?.disconnect();try{t()}finally{this.attachObserver()}}announceStep(t){const e=this.steps[t];if(!e)return;let i=`${this.stepWord} ${t+1} ${this.ofWord} ${this.stepCount}`;if(e.label)i+=`: ${e.label}`;if(e.optional)i+=`, ${this.optionalWord}`;if(e.completed)i+=`, ${this.completedWord}`;i+=`, ${this.currentWord}`;this.liveMessage=i}announceError(t){const e=this.steps.indexOf(t);let i=`${this.stepWord} ${e+1} ${this.ofWord} ${this.stepCount}`;if(t.label)i+=`: ${t.label}`;i+=`, ${this.errorWord}`;if(t.errorText)i+=`: ${t.errorText}`;this.errorMessage=i}canNavigateTo(t){this.collectSteps();const e=this.steps[t];if(!e||e.disabled)return false;if(this.mode!=="linear")return true;if(t<=this.active)return true;if(e.completed)return true;return this.steps.slice(0,t).every((t=>t.completed||t.optional))}clampToValidStep(t){if(this.steps.length===0)return 0;return Math.max(0,Math.min(this.steps.length-1,t|0))}collectSteps(){this.steps=Array.from(this.el.children).filter((t=>t.tagName.toLowerCase()==="md-step"))}focusActiveStep(){const t=this.steps[this.active];t?.shadowRoot?.querySelector(".md-step__inner")?.focus()}static hasOwnContent(t){return Array.from(t.childNodes).some((t=>t.nodeType===Node.ELEMENT_NODE||t.nodeType===Node.TEXT_NODE&&(t.textContent??"").trim()!==""))}syncSteps(){this.collectSteps();const e=this.steps.length;this.stepCount=e;const i=this.orientation==="horizontal"&&this.steps.some((e=>t.hasOwnContent(e)))?"step":"shared";if(this.el.getAttribute("data-panel-mode")!==i){this.el.setAttribute("data-panel-mode",i)}this.el.style.setProperty("--md-stepper-step-count",String(e));this.steps.forEach(((t,a)=>{const n=(e,i)=>{if(t.getAttribute(e)!==i)t.setAttribute(e,i)};n("data-index",String(a));n("data-total",String(e));n("data-active",String(this.active));n("data-orientation",this.orientation);n("data-indicator",this.indicator);n("data-mode",this.mode);n("data-position",a===0?"first":a===e-1?"last":"middle");n("data-step-word",this.stepWord);n("data-of-word",this.ofWord);n("data-completed-word",this.completedWord);n("data-current-word",this.currentWord);n("data-error-word",this.errorWord);n("data-optional-word",this.optionalWord);n("data-next-label",this.nextLabel);n("data-back-label",this.backLabel);n("data-finish-label",this.finishLabel);n("data-nav",String(this.nav));n("data-loading",String(this.loading));n("data-next-disabled",String(this.nextDisabled));n("data-lazy",String(this.lazy));n("data-panel-mode",i);t.style.setProperty("--md-step-idx",String(a));const o=a===this.active;if(t.active!==o)t.active=o;s(t)}))}render(){const t=this.variant==="mobile";return a(n,{key:"569f9d044b7e5693025b19e0bff8f68b6379597f",class:{"md-stepper":true,[`md-stepper--${this.orientation}`]:true,[`md-stepper--indicator-${this.indicator}`]:true,[`md-stepper--mode-${this.mode}`]:true,"md-stepper--mobile":t},role:"navigation","aria-label":this.label},a("div",{key:"ea0661506375bfe750cbe58eee1da89031b990b2",class:"md-stepper__live","aria-live":"polite",role:"status"},this.liveMessage),a("div",{key:"5109efa0ac855fad4e193643833a0fdaf95f50a5",class:"md-stepper__live","aria-live":"assertive",role:"alert"},this.errorMessage),a("ol",{key:"65f6e7d001531375308dde02062d6176448ff1b2",class:"md-stepper__list",part:"list"},a("slot",{key:"5d21a8a221e4af58b7cd3496e8e8713f52dd85a7",onSlotchange:this.handleSlotChange})),a("div",{key:"c99327034c1d5238d49cbbd8464cd70860ca5a9c",class:"md-stepper__content",part:"content"},a("slot",{key:"675ff6a75573bb1617315db767bf65269cfa41d8",name:"content"})),this.nav&&!t&&this.orientation==="horizontal"&&this.stepCount>0&&a("div",{key:"03f70ca6b70fe73a241c1f7de05c1f114413b4e5",class:"md-stepper__nav",part:"nav"},a("md-button",{key:"69cbd3e26b6bf93d9cac271e7b3e99081936a356",variant:"text",size:"sm",disabled:this.active<=0||this.loading,onClick:this.handleFooterBack},this.backLabel),a("md-button",{key:"80dc73ee013d3fc627adb25e9602a51954571d37",variant:"filled",size:"sm",loading:this.loading,disabled:this.nextDisabled||this.loading,onClick:()=>this.next()},this.active>=this.stepCount-1?this.finishLabel:this.nextLabel)),this.nav&&t&&this.stepCount>0&&a("div",{key:"ecddf275577b6e0b7101feb53c731d2c568a27cb",class:"md-stepper__mobile",part:"mobile-nav"},a("md-button",{key:"4ef88060e3d6a59adbc9d51779dc9c7ce87f77e1",variant:"text",size:"sm",disabled:this.active<=0||this.loading,onClick:this.handleFooterBack},this.backLabel),a("div",{key:"98e67c3372d60520bfef7991fda5cf876205e993",class:"md-stepper__mobile-progress",part:"mobile-progress","aria-hidden":this.indicator==="dot"?"true":undefined},this.indicator==="dot"?this.steps.map(((t,e)=>a("span",{class:{"md-stepper__mobile-dot":true,"is-active":e===this.active,"is-done":e<this.active||!!t.completed}}))):a("span",{class:"md-stepper__mobile-text"},`${this.stepWord} ${this.active+1} ${this.ofWord} ${this.stepCount}`)),a("md-button",{key:"edbb884f6e7697ae9b5ac30b38f2b00426be7f60",variant:"filled",size:"sm",loading:this.loading,disabled:this.nextDisabled||this.loading,onClick:()=>this.next()},this.active>=this.stepCount-1?this.finishLabel:this.nextLabel)))}get el(){return this}static get watchers(){return{active:[{onActiveChange:0}],orientation:[{onConfigChange:0}],indicator:[{onConfigChange:0}],mode:[{onConfigChange:0}],nav:[{onConfigChange:0}],variant:[{onConfigChange:0}],lazy:[{onConfigChange:0}],loading:[{onConfigChange:0}],nextDisabled:[{onConfigChange:0}],stepWord:[{onConfigChange:0}],ofWord:[{onConfigChange:0}],completedWord:[{onConfigChange:0}],currentWord:[{onConfigChange:0}],errorWord:[{onConfigChange:0}],optionalWord:[{onConfigChange:0}],nextLabel:[{onConfigChange:0}],backLabel:[{onConfigChange:0}],finishLabel:[{onConfigChange:0}]}}static get style(){return h()}},[257,"md-stepper",{orientation:[513],indicator:[513],variant:[513],mode:[513],active:[1538],autoComplete:[4,"auto-complete"],nav:[4],nextDisabled:[4,"next-disabled"],loading:[4],lazy:[4],label:[1],stepWord:[1,"step-word"],ofWord:[1,"of-word"],completedWord:[1,"completed-word"],currentWord:[1,"current-word"],errorWord:[1,"error-word"],optionalWord:[1,"optional-word"],nextLabel:[1,"next-label"],backLabel:[1,"back-label"],finishLabel:[1,"finish-label"],density:[514],stepCount:[32],liveMessage:[32],errorMessage:[32],next:[64],prev:[64],goTo:[64],reset:[64]},[[0,"mdStepClick","onStepClick"],[0,"mdStepNext","onStepNext"],[0,"mdStepBack","onStepBack"],[0,"mdClick","onInternalMdClick"]],{active:[{onActiveChange:0}],orientation:[{onConfigChange:0}],indicator:[{onConfigChange:0}],mode:[{onConfigChange:0}],nav:[{onConfigChange:0}],variant:[{onConfigChange:0}],lazy:[{onConfigChange:0}],loading:[{onConfigChange:0}],nextDisabled:[{onConfigChange:0}],stepWord:[{onConfigChange:0}],ofWord:[{onConfigChange:0}],completedWord:[{onConfigChange:0}],currentWord:[{onConfigChange:0}],errorWord:[{onConfigChange:0}],optionalWord:[{onConfigChange:0}],nextLabel:[{onConfigChange:0}],backLabel:[{onConfigChange:0}],finishLabel:[{onConfigChange:0}]}]);function c(){if(typeof customElements==="undefined"){return}const t=["md-stepper","md-button","md-ripple"];t.forEach((t=>{switch(t){case"md-stepper":if(!customElements.get(o(t))){customElements.define(o(t),l)}break;case"md-button":if(!customElements.get(o(t))){r()}break;case"md-ripple":if(!customElements.get(o(t))){d()}break}}))}c();const p=l;const f=c;export{p as MdStepper,f as defineCustomElement};
|
|
2
2
|
//# sourceMappingURL=md-stepper.js.map
|