@momentum-design/components 0.104.3 → 0.104.4
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/browser/index.js
CHANGED
@@ -4709,7 +4709,7 @@
|
|
4709
4709
|
:host([soft-disabled])::part(base-text) {
|
4710
4710
|
color: var(--mdc-select-text-color-disabled);
|
4711
4711
|
}
|
4712
|
-
`,Bf=[rT,...At(!0)];var Pe=class extends Oe(re(Ee)){constructor(){super(...arguments);this.readonly=!1;this.placement=Ut.BOTTOM_START;this.boundary=kt.BOUNDARY;this.strategy=kt.STRATEGY;this.displayPopover=!1;this.initialSelectedOption=null}getAllValidOptions(){var t;return Array.from(((t=this.slottedListboxes[0])==null?void 0:t.querySelectorAll(`${go}:not([disabled])`))||[])}getFirstValidOption(){var t;return(t=this.slottedListboxes[0])==null?void 0:t.querySelector(`${go}:not([disabled])`)}getLastValidOption(){let t=this.getAllValidOptions();return t.length>0?t[t.length-1]:null}getFirstSelectedOption(){var t;return(t=this.slottedListboxes[0])==null?void 0:t.querySelector(`${go}[selected]:not([disabled])`)}async firstUpdated(){await this.updateComplete,this.modifyListBoxWrapper();let t=this.getFirstSelectedOption();if(t)this.initialSelectedOption=t,this.setSelectedOption(t);else if(this.placeholder)this.placeholder&&this.setInputValidity();else{let o=this.getFirstValidOption();this.setSelectedOption(o),this.fireEvents()}}updated(t){super.updated(t),(t.has("disabled")||t.has("softDisabled")||t.has("readonly"))&&(this.disabled||this.softDisabled||this.readonly)&&(this.displayPopover=!1),t.has("dataAriaLabel")&&this.modifyListBoxWrapper()}modifyListBoxWrapper(){let t=this.slottedListboxes[0];t&&(t.setAttribute("id",Od),t.setAttribute("aria-label",this.dataAriaLabel||""),t.setAttribute("aria-labelledby",Oa))}handleOptionsClick(t){let o=t.target;o&&o.tagName===go.toUpperCase()&&!o.hasAttribute("disabled")&&!o.hasAttribute("soft-disabled")&&(this.setSelectedOption(o),this.displayPopover=!1,this.fireEvents())}setSelectedOption(t){var o,a;this.updateSelectedInChildOptions(t),this.updateTabIndexForAllOptions(t),this.selectedOption=t,this.value=(a=(o=this.selectedOption)==null?void 0:o.value)!=null?a:"",this.internals.setFormValue(this.value),this.inputElement.setAttribute("value",this.value),this.setInputValidity()}updateTabIndexForAllOptions(t){let o=this.getAllValidOptions(),a=t||o[0];o.forEach(h=>{h.setAttribute("tabindex",h===a?"0":"-1")})}updateSelectedInChildOptions(t){t==null||t.setAttribute("selected","true"),this.getAllValidOptions().forEach(a=>{a!==t&&a.removeAttribute("selected")})}fireEvents(){this.dispatchInput(this.selectedOption),this.dispatchChange(this.selectedOption)}setInputValidity(){
|
4712
|
+
`,Bf=[rT,...At(!0)];var Pe=class extends Oe(re(Ee)){constructor(){super(...arguments);this.readonly=!1;this.placement=Ut.BOTTOM_START;this.boundary=kt.BOUNDARY;this.strategy=kt.STRATEGY;this.displayPopover=!1;this.initialSelectedOption=null}getAllValidOptions(){var t;return Array.from(((t=this.slottedListboxes[0])==null?void 0:t.querySelectorAll(`${go}:not([disabled])`))||[])}getFirstValidOption(){var t;return(t=this.slottedListboxes[0])==null?void 0:t.querySelector(`${go}:not([disabled])`)}getLastValidOption(){let t=this.getAllValidOptions();return t.length>0?t[t.length-1]:null}getFirstSelectedOption(){var t;return(t=this.slottedListboxes[0])==null?void 0:t.querySelector(`${go}[selected]:not([disabled])`)}async firstUpdated(){await this.updateComplete,this.modifyListBoxWrapper();let t=this.getFirstSelectedOption();if(t)this.initialSelectedOption=t,this.setSelectedOption(t);else if(this.placeholder)this.placeholder&&this.setInputValidity();else{let o=this.getFirstValidOption();this.setSelectedOption(o),this.fireEvents()}}updated(t){super.updated(t),(t.has("disabled")||t.has("softDisabled")||t.has("readonly"))&&(this.disabled||this.softDisabled||this.readonly)&&(this.displayPopover=!1),t.has("dataAriaLabel")&&this.modifyListBoxWrapper()}modifyListBoxWrapper(){let t=this.slottedListboxes[0];t&&(t.setAttribute("id",Od),t.setAttribute("aria-label",this.dataAriaLabel||""),t.setAttribute("aria-labelledby",Oa))}handleOptionsClick(t){let o=t.target;o&&o.tagName===go.toUpperCase()&&!o.hasAttribute("disabled")&&!o.hasAttribute("soft-disabled")&&(this.setSelectedOption(o),this.displayPopover=!1,this.fireEvents())}setSelectedOption(t){var o,a,h;this.updateSelectedInChildOptions(t),this.updateTabIndexForAllOptions(t),this.selectedOption=t,this.value=(a=(o=this.selectedOption)==null?void 0:o.value)!=null?a:"",this.internals.setFormValue(this.value),(h=this.inputElement)==null||h.setAttribute("value",this.value),this.setInputValidity()}updateTabIndexForAllOptions(t){let o=this.getAllValidOptions(),a=t||o[0];o.forEach(h=>{h.setAttribute("tabindex",h===a?"0":"-1")})}updateSelectedInChildOptions(t){t==null||t.setAttribute("selected","true"),this.getAllValidOptions().forEach(a=>{a!==t&&a.removeAttribute("selected")})}fireEvents(){this.dispatchInput(this.selectedOption),this.dispatchChange(this.selectedOption)}setInputValidity(){var t,o;!this.selectedOption&&this.required&&this.validationMessage?(t=this.inputElement)==null||t.setCustomValidity(this.validationMessage):(o=this.inputElement)==null||o.setCustomValidity(""),this.setValidity()}formResetCallback(){var o;let t=this.initialSelectedOption||null;((o=this.selectedOption)==null?void 0:o.value)!==(t==null?void 0:t.value)&&(this.setSelectedOption(t),this.fireEvents())}formStateRestoreCallback(t){var a;let o=this.getAllValidOptions().find(h=>h.value===t||h.label===t);((a=this.selectedOption)==null?void 0:a.value)!==(o==null?void 0:o.value)&&(this.setSelectedOption(o||null),this.fireEvents())}dispatchChange(t){this.dispatchEvent(new CustomEvent("change",{detail:{value:t==null?void 0:t.value,label:t==null?void 0:t.label},composed:!0,bubbles:!0}))}dispatchInput(t){this.dispatchEvent(new CustomEvent("input",{detail:{value:t==null?void 0:t.value,label:t==null?void 0:t.label},composed:!0,bubbles:!0}))}handleClickCombobox(t){this.disabled||this.softDisabled||this.readonly||(this.displayPopover=!this.displayPopover,t.stopPropagation())}handleKeydownCombobox(t){if(!(this.disabled||this.softDisabled||this.readonly))switch(t.key){case J.ARROW_DOWN:case J.ARROW_UP:this.displayPopover=!0,t.preventDefault(),t.stopPropagation();break;case J.ENTER:case J.SPACE:this.displayPopover=!0,t.preventDefault(),t.stopPropagation();break;case J.HOME:{this.displayPopover=!0;let o=this.getFirstValidOption();o&&(o==null||o.focus(),this.updateTabIndexForAllOptions(o)),t.preventDefault();break}case J.END:{this.displayPopover=!0;let o=this.getLastValidOption();o&&(o.focus(),this.updateTabIndexForAllOptions(o)),t.preventDefault();break}default:break}}handlePopoverKeydown(t){let o=null;switch(t.key){case J.HOME:{o=this.getFirstValidOption();break}case J.END:{o=this.getLastValidOption();break}case J.ARROW_DOWN:{let a=this.getAllValidOptions(),h=a.findIndex(T=>T===t.target),u=Math.min(h+1,a.length-1);o=a[u];break}case J.ARROW_UP:{let a=this.getAllValidOptions(),h=a.findIndex(T=>T===t.target),u=Math.max(h-1,0);o=a[u];break}case J.PAGE_DOWN:{let a=this.getAllValidOptions(),h=a.findIndex(T=>T===t.target),u=Math.min(h+10,a.length-1);o=a[u];break}case J.PAGE_UP:{let a=this.getAllValidOptions(),h=a.findIndex(T=>T===t.target),u=Math.max(h-10,0);o=a[u];break}default:break}o&&(this.focusAndUpdateTabIndexes(o),t.preventDefault(),t.stopPropagation())}focusAndUpdateTabIndexes(t){t&&(t.focus(),this.updateTabIndexForAllOptions(t))}handleNativeInputFocus(){this.visualCombobox.focus()}updateState(){var o;let t=this.getFirstSelectedOption();this.inputElement&&(t?((o=this.selectedOption)==null?void 0:o.value)!==t.value&&this.setSelectedOption(t):this.setSelectedOption(this.placeholder?null:this.getFirstValidOption()))}render(){var t,o,a,h,u,T;return C`
|
4713
4713
|
${this.renderLabel()}
|
4714
4714
|
<div part="container">
|
4715
4715
|
<div
|
@@ -4789,7 +4789,7 @@
|
|
4789
4789
|
</mdc-popover>
|
4790
4790
|
</div>
|
4791
4791
|
${this.renderHelperText()}
|
4792
|
-
`}};Pe.styles=[...Ee.styles,...Bf],p([g({type:String})],Pe.prototype,"placeholder",2),p([g({type:Boolean})],Pe.prototype,"readonly",2),p([g({type:String,reflect:!0})],Pe.prototype,"placement",2),p([g({type:Boolean,attribute:"soft-disabled"})],Pe.prototype,"softDisabled",2),p([g({type:String,reflect:!0,attribute:"boundary"})],Pe.prototype,"boundary",2),p([g({type:String,reflect:!0,attribute:"strategy"})],Pe.prototype,"strategy",2),p([Lt({selector:"mdc-selectlistbox"})],Pe.prototype,"slottedListboxes",2),p([Hr(`[id="${Oa}"]`)],Pe.prototype,"visualCombobox",2),p([xt()],Pe.prototype,"selectedOption",2),p([xt()],Pe.prototype,"displayPopover",2);var Pd=Pe;Pd.register(Vf);var iT=Pd;var Dd=class extends j{constructor(){super(...arguments);this.role=tt.LISTBOX}createRenderRoot(){return this}},Fd=Dd;var Uf=Y.constructTagName("selectlistbox");Fd.register(Uf);var oT=Fd;vo.register(Ni);var sT=vo;var Hf=Y.constructTagName("skeleton"),Gf={BUTTON:"button",CIRCULAR:"circular",RECTANGULAR:"rectangular",ROUNDED:"rounded"},Yf={VARIANT:Gf.RECTANGULAR};var aT=G`
|
4792
|
+
`}};Pe.styles=[...Ee.styles,...Bf],p([g({type:String})],Pe.prototype,"placeholder",2),p([g({type:Boolean})],Pe.prototype,"readonly",2),p([g({type:String,reflect:!0})],Pe.prototype,"placement",2),p([g({type:Boolean,attribute:"soft-disabled",reflect:!0})],Pe.prototype,"softDisabled",2),p([g({type:String,reflect:!0,attribute:"boundary"})],Pe.prototype,"boundary",2),p([g({type:String,reflect:!0,attribute:"strategy"})],Pe.prototype,"strategy",2),p([Lt({selector:"mdc-selectlistbox"})],Pe.prototype,"slottedListboxes",2),p([Hr(`[id="${Oa}"]`)],Pe.prototype,"visualCombobox",2),p([xt()],Pe.prototype,"selectedOption",2),p([xt()],Pe.prototype,"displayPopover",2);var Pd=Pe;Pd.register(Vf);var iT=Pd;var Dd=class extends j{constructor(){super(...arguments);this.role=tt.LISTBOX}createRenderRoot(){return this}},Fd=Dd;var Uf=Y.constructTagName("selectlistbox");Fd.register(Uf);var oT=Fd;vo.register(Ni);var sT=vo;var Hf=Y.constructTagName("skeleton"),Gf={BUTTON:"button",CIRCULAR:"circular",RECTANGULAR:"rectangular",ROUNDED:"rounded"},Yf={VARIANT:Gf.RECTANGULAR};var aT=G`
|
4793
4793
|
:host {
|
4794
4794
|
--mdc-skeleton-background-color: var(--mds-color-theme-background-skeleton-normal);
|
4795
4795
|
--mdc-skeleton-height: 100%;
|