@momentum-design/components 0.120.24 → 0.120.25
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 +3 -3
- package/dist/browser/index.js.map +3 -3
- package/dist/components/combobox/combobox.component.js +2 -2
- package/dist/components/list/list.component.js +1 -1
- package/dist/custom-elements.json +846 -1114
- package/dist/react/index.d.ts +3 -3
- package/dist/react/index.js +3 -3
- package/dist/utils/controllers/ElementStore.d.ts +1 -1
- package/dist/utils/controllers/ElementStore.js +1 -1
- package/dist/utils/mixins/lifecycle/CaptureDestroyEventForChildElement.js +6 -5
- package/package.json +1 -1
- package/dist/utils/mixins/ItemCollectionMixin.d.ts +0 -68
- package/dist/utils/mixins/ItemCollectionMixin.js +0 -89
package/dist/browser/index.js
CHANGED
@@ -3761,7 +3761,7 @@
|
|
3761
3761
|
`,iv=[UT,...St()];var Lo=class extends Kt(ie){constructor(){super(...arguments);this.size=ks.SIZE;this.inline=ks.INLINE;this.inverted=ks.INVERTED}connectedCallback(){super.connectedCallback(),this.active=void 0,this.role=ks.ROLE}update(t){super.update(t),t.has("size")&&this.setSize(this.size)}setSize(t){this.setAttribute("size",Object.values(Cs).includes(t)?`${t}`:ks.SIZE.toString())}render(){return _`
|
3762
3762
|
<slot></slot>
|
3763
3763
|
${this.iconName?_` <mdc-icon name=${this.iconName} size=${rv(this.size)} length-unit="rem"></mdc-icon> `:j}
|
3764
|
-
`}};Lo.styles=[...$r.styles,...iv],p([u({type:Number,reflect:!0})],Lo.prototype,"size",2),p([u({type:Boolean,reflect:!0})],Lo.prototype,"inline",2),p([u({type:Boolean,reflect:!0})],Lo.prototype,"inverted",2);var Qc=Lo;Qc.register(ev);var HT=Qc;$r.register(Du);var GT=$r;var ws=n=>{class o extends n{constructor(...a){super(...a);this.loop="true";this.propagateAllKeyEvents=!1;this.initialFocus=0;this.handleNavigationKeyDown=a=>{let d=new Set([Z.ARROW_DOWN,Z.ARROW_UP,Z.HOME,Z.END]),m=window.getComputedStyle(this).direction==="rtl",b=this.resolveDirectionKey(a.key,m);if(!d.has(b))return;let C=a.target,L=this.getCurrentIndex(C);if(L!==-1){switch(this.resetTabIndexes(L),b){case Z.HOME:{this.resetTabIndexAndSetFocus(0,L);break}case Z.END:{this.resetTabIndexAndSetFocus(this.navItems.length-1,L);break}case Z.ARROW_DOWN:{let W=this.shouldLoop()?0:L,K=L+1===this.navItems.length?W:L+1;this.resetTabIndexAndSetFocus(K,L);break}case Z.ARROW_UP:{let W=this.shouldLoop()?this.navItems.length-1:L,K=L-1===-1?W:L-1;this.resetTabIndexAndSetFocus(K,L);break}default:break}this.propagateAllKeyEvents||(a.stopPropagation(),a.preventDefault())}};this.handleNavigationClick=a=>{let d=a.target,m=this.getCurrentIndex(d);if(m!==-1){let b=!(this.navItems[m]!==d&&document.activeElement===a.target);this.resetTabIndexAndSetFocus(m,void 0,b)}};this.addEventListener("keydown",this.handleNavigationKeyDown),this.addEventListener("click",this.handleNavigationClick)}async firstUpdated(a){super.firstUpdated(a);let d=Math.max(Math.min(this.initialFocus,this.navItems.length-1),0);this.resetTabIndexAndSetFocus(d,void 0,!1)}getCurrentIndex(a){return a?this.navItems.findIndex(d=>d===a||!!(d.compareDocumentPosition(a)&Node.DOCUMENT_POSITION_CONTAINED_BY)):-1}resetTabIndexes(a){var d;if(this.navItems.length>0){this.navItems.forEach(b=>b.setAttribute("tabindex","-1"));let m=this.navItems[a]?a:0;this.navItems[m].setAttribute("tabindex","0"),(d=this.navItems[m])==null||d.focus()}}resetTabIndexAndSetFocus(a,d,m=!0){let{navItems:b}=this;if(b.length===0)return;let C=b[a]?a:0,L=b[C];a===d&&L&&L.getAttribute("tabindex")==="0"||(d===void 0?b.forEach(W=>W.setAttribute("tabindex","-1")):b[d]&&b[d].setAttribute("tabindex","-1"),L.setAttribute("tabindex","0"),m&&(L.focus({preventScroll:!0}),L.scrollIntoView({block:"nearest"})))}resolveDirectionKey(a,d){if(!d)return a;switch(a){case Z.ARROW_LEFT:return Z.ARROW_RIGHT;case Z.ARROW_RIGHT:return Z.ARROW_LEFT;default:return a}}shouldLoop(){return this.loop!=="false"}}return o};var Kl=z.constructTagName("listitem"),Ua={FULL_WIDTH:"full-width",INSET_PILL:"inset-pill",INSET_RECTANGLE:"inset-rectangle"},ov={VARIANT:Ua.FULL_WIDTH};var Gt={CREATED:"created",DESTROYED:"destroyed",MODIFIED:"modified"};var sv=(n,o)=>!!(n.compareDocumentPosition(o)&Node.DOCUMENT_POSITION_FOLLOWING);var YT=n=>!!n,zr=class{constructor(o,t){this.cache=[];this.itemCreationHandler=o=>{this.addItem(o.target,void 0)};this.itemDestroyHandler=o=>{this.delete(o.
|
3764
|
+
`}};Lo.styles=[...$r.styles,...iv],p([u({type:Number,reflect:!0})],Lo.prototype,"size",2),p([u({type:Boolean,reflect:!0})],Lo.prototype,"inline",2),p([u({type:Boolean,reflect:!0})],Lo.prototype,"inverted",2);var Qc=Lo;Qc.register(ev);var HT=Qc;$r.register(Du);var GT=$r;var ws=n=>{class o extends n{constructor(...a){super(...a);this.loop="true";this.propagateAllKeyEvents=!1;this.initialFocus=0;this.handleNavigationKeyDown=a=>{let d=new Set([Z.ARROW_DOWN,Z.ARROW_UP,Z.HOME,Z.END]),m=window.getComputedStyle(this).direction==="rtl",b=this.resolveDirectionKey(a.key,m);if(!d.has(b))return;let C=a.target,L=this.getCurrentIndex(C);if(L!==-1){switch(this.resetTabIndexes(L),b){case Z.HOME:{this.resetTabIndexAndSetFocus(0,L);break}case Z.END:{this.resetTabIndexAndSetFocus(this.navItems.length-1,L);break}case Z.ARROW_DOWN:{let W=this.shouldLoop()?0:L,K=L+1===this.navItems.length?W:L+1;this.resetTabIndexAndSetFocus(K,L);break}case Z.ARROW_UP:{let W=this.shouldLoop()?this.navItems.length-1:L,K=L-1===-1?W:L-1;this.resetTabIndexAndSetFocus(K,L);break}default:break}this.propagateAllKeyEvents||(a.stopPropagation(),a.preventDefault())}};this.handleNavigationClick=a=>{let d=a.target,m=this.getCurrentIndex(d);if(m!==-1){let b=!(this.navItems[m]!==d&&document.activeElement===a.target);this.resetTabIndexAndSetFocus(m,void 0,b)}};this.addEventListener("keydown",this.handleNavigationKeyDown),this.addEventListener("click",this.handleNavigationClick)}async firstUpdated(a){super.firstUpdated(a);let d=Math.max(Math.min(this.initialFocus,this.navItems.length-1),0);this.resetTabIndexAndSetFocus(d,void 0,!1)}getCurrentIndex(a){return a?this.navItems.findIndex(d=>d===a||!!(d.compareDocumentPosition(a)&Node.DOCUMENT_POSITION_CONTAINED_BY)):-1}resetTabIndexes(a){var d;if(this.navItems.length>0){this.navItems.forEach(b=>b.setAttribute("tabindex","-1"));let m=this.navItems[a]?a:0;this.navItems[m].setAttribute("tabindex","0"),(d=this.navItems[m])==null||d.focus()}}resetTabIndexAndSetFocus(a,d,m=!0){let{navItems:b}=this;if(b.length===0)return;let C=b[a]?a:0,L=b[C];a===d&&L&&L.getAttribute("tabindex")==="0"||(d===void 0?b.forEach(W=>W.setAttribute("tabindex","-1")):b[d]&&b[d].setAttribute("tabindex","-1"),L.setAttribute("tabindex","0"),m&&(L.focus({preventScroll:!0}),L.scrollIntoView({block:"nearest"})))}resolveDirectionKey(a,d){if(!d)return a;switch(a){case Z.ARROW_LEFT:return Z.ARROW_RIGHT;case Z.ARROW_RIGHT:return Z.ARROW_LEFT;default:return a}}shouldLoop(){return this.loop!=="false"}}return o};var Kl=z.constructTagName("listitem"),Ua={FULL_WIDTH:"full-width",INSET_PILL:"inset-pill",INSET_RECTANGLE:"inset-rectangle"},ov={VARIANT:Ua.FULL_WIDTH};var Gt={CREATED:"created",DESTROYED:"destroyed",MODIFIED:"modified"};var sv=(n,o)=>!!(n.compareDocumentPosition(o)&Node.DOCUMENT_POSITION_FOLLOWING);var YT=n=>!!n,zr=class{constructor(o,t){this.cache=[];this.itemCreationHandler=o=>{this.addItem(o.target,void 0)};this.itemDestroyHandler=o=>{this.delete(o.detail.originalTarget)};this.host=o,o.addController(this),this.isValidItem=(t==null?void 0:t.isValidItem)||YT,this.onStoreUpdate=t==null?void 0:t.onStoreUpdate}get items(){return this.cache}hostConnected(){this.host.addEventListener(Gt.CREATED,this.itemCreationHandler),this.host.addEventListener(Gt.DESTROYED,this.itemDestroyHandler)}hostDisconnected(){this.host.removeEventListener(Gt.CREATED,this.itemCreationHandler),this.host.removeEventListener(Gt.DESTROYED,this.itemDestroyHandler),this.reset()}add(o){this.addItem(o,void 0)}addAt(o,t){this.addItem(o,t)}addItem(o,t=void 0){var a;let i=o;if(this.isValidItem(i)&&!this.cache.includes(i)){let d=t===void 0?this.cache.findIndex(m=>sv(i,m)):t;this.onStoreUpdate&&((a=this.onStoreUpdate)==null||a.call(this,i,"added",d===-1?this.cache.length:d,this.cache.slice())),d===-1?this.cache.push(i):d>=0&&this.cache.splice(d,0,i)}}delete(o){var i;let t=this.cache.indexOf(o);t!==-1&&(this.onStoreUpdate&&((i=this.onStoreUpdate)==null||i.call(this,o,"removed",t,this.cache.slice())),this.cache.splice(t,1))}reset(o){this.cache.length=0,o&&this.cache.push(...o)}};var Bi=n=>{class o extends n{constructor(...a){super(...a);this.handleItemCreation=a=>{let d=a.target;d&&d.addEventListener(Gt.DESTROYED,this.handleItemRemovedEvent)};this.handleItemRemovedEvent=a=>{a.stopImmediatePropagation(),a.target&&a.type===Gt.DESTROYED&&(a.target.removeEventListener(Gt.DESTROYED,this.handleItemRemovedEvent),this.dispatchEvent(new CustomEvent(a.type,{bubbles:a.bubbles,composed:a.composed,detail:{originalTarget:a.target}})))};this.addEventListener(Gt.CREATED,this.handleItemCreation)}}return o};var WT=B`
|
3765
3765
|
:host {
|
3766
3766
|
display: flex;
|
3767
3767
|
flex-direction: column;
|
@@ -3776,7 +3776,7 @@
|
|
3776
3776
|
scroll-padding-top: 0.25rem;
|
3777
3777
|
scroll-padding-bottom: 0.25rem;
|
3778
3778
|
}
|
3779
|
-
`,av=[WT];var nv=z.constructTagName("list");var Jc={LOOP:"true",INITIAL_FOCUS:0};var Ns=class extends ws(Bi(q)){constructor(){super();this.loop=Jc.LOOP;this.initialFocus=Jc.INITIAL_FOCUS;this.handleCreatedEvent=t=>{let i=t.target;this.isValidItem(i)&&(i.tabIndex=-1)};this.handleDestroyEvent=t=>{let i=t.
|
3779
|
+
`,av=[WT];var nv=z.constructTagName("list");var Jc={LOOP:"true",INITIAL_FOCUS:0};var Ns=class extends ws(Bi(q)){constructor(){super();this.loop=Jc.LOOP;this.initialFocus=Jc.INITIAL_FOCUS;this.handleCreatedEvent=t=>{let i=t.target;this.isValidItem(i)&&(i.tabIndex=-1)};this.handleDestroyEvent=t=>{let i=t.detail.originalTarget;if(!this.isValidItem(i)||i.tabIndex!==0)return;let a=this.navItems.findIndex(m=>m===i);if(a===-1)return;let d=a+1;d>=this.navItems.length&&(d=a-1),this.resetTabIndexes(d)};this.handleModifiedEvent=t=>{let i=t.target;switch(t.detail.change){case"enabled":this.itemsStore.add(i);break;case"disabled":this.itemsStore.delete(i);break;default:break}};this.addEventListener(Gt.CREATED,this.handleCreatedEvent),this.addEventListener(Gt.MODIFIED,this.handleModifiedEvent),this.addEventListener(Gt.DESTROYED,this.handleDestroyEvent),this.itemsStore=new zr(this,{isValidItem:this.isValidItem})}connectedCallback(){super.connectedCallback(),this.setAttribute("role",et.LIST)}get navItems(){return this.itemsStore.items}isValidItem(t){return t.matches(`${Kl}:not([disabled])`)}render(){return _`
|
3780
3780
|
<slot name="list-header"></slot>
|
3781
3781
|
<!-- make the container slot role presentation to keep it ignored in a11y tree -->
|
3782
3782
|
<slot part="container" role="presentation"></slot>
|
@@ -6465,7 +6465,7 @@
|
|
6465
6465
|
--mdc-icon-fill-color: ButtonText;
|
6466
6466
|
}
|
6467
6467
|
}
|
6468
|
-
`,Bg=[yA];var he=class extends Bi(ge(Te(Ht(se)))){constructor(){super();this.placement=Wt.BOTTOM_START;this.boundary=_t.BOUNDARY;this.strategy=_t.STRATEGY;this.popoverZIndex=_t.Z_INDEX;this.isOpen=!1;this.filteredValue="";this.initialSelectedOption=null;this.handleUpdateError=t=>{this.onerror&&this.onerror(t)};this.handleDestroyEvent=t=>{let i=t.
|
6468
|
+
`,Bg=[yA];var he=class extends Bi(ge(Te(Ht(se)))){constructor(){super();this.placement=Wt.BOTTOM_START;this.boundary=_t.BOUNDARY;this.strategy=_t.STRATEGY;this.popoverZIndex=_t.Z_INDEX;this.isOpen=!1;this.filteredValue="";this.initialSelectedOption=null;this.handleUpdateError=t=>{this.onerror&&this.onerror(t)};this.handleDestroyEvent=t=>{let i=t.detail.originalTarget;if(i&&(!this.isValidItem(i)||i.tabIndex!==0))return;let a=this.navItems.findIndex(m=>m===i);if(a===-1)return;let d=a+1;d>=this.navItems.length&&(d=a-1)};this.addEventListener(Gt.DESTROYED,this.handleDestroyEvent),this.itemsStore=new zr(this,{isValidItem:this.isValidItem})}get navItems(){return this.itemsStore.items}connectedCallback(){super.connectedCallback(),this.updateComplete.then(()=>{this.inputElement&&(this.setInputValidity(),this.internals.setFormValue(this.inputElement.value))}).catch(this.handleUpdateError)}isValidItem(t){return t.matches(`${pr}:not([disabled])`)}openPopover(){this.isOpen=!0}closePopover(){this.isOpen=!1}toggleDropdown(){this.isOpen=!this.isOpen}compareOptionWithValue(t,i){return(t.getAttribute("label")||"").toLowerCase().startsWith(i==null?void 0:i.toLowerCase())}getFirstSelectedOption(){return this.navItems.find(t=>t.hasAttribute("selected"))}getVisibleOptions(t){return this.navItems.filter(i=>this.compareOptionWithValue(i,t))}setSelectedValue(t){this.value=(t==null?void 0:t.getAttribute("value"))||"",this.filteredValue=(t==null?void 0:t.getAttribute("label"))||"",this.internals.setFormValue(this.value),this.updateHiddenOptions(),this.updateSelectedOption(t),this.setInputValidity(),this.resetHelpText(),cn.onInputCombobox(this,t),cn.onChangeCombobox(this,t)}resetSelectedValue(){this.value="",this.internals.setFormValue(this.value),this.resetHelpText()}resetHelpText(){this.invalidCustomValueText&&this.helpText===this.invalidCustomValueText&&(this.helpText="",this.helpTextType=zt.DEFAULT)}attributeChangedCallback(t,i,a){super.attributeChangedCallback(t,i,a),t==="validation-message"&&this.updateComplete.then(()=>{this.setInputValidity()}).catch(this.handleUpdateError)}async firstUpdated(t){await this.updateComplete,this.inputElement&&this.autoFocusOnMount&&(this.elementToAutoFocus=this.inputElement),super.firstUpdated(t);let i=this.getFirstSelectedOption();if(i)this.initialSelectedOption=i,this.setSelectedValue(i);else if(this.value){let a=this.navItems.find(d=>d.value===this.value);this.setSelectedValue(a)}else this.placeholder&&this.setInputValidity();this.navItems.forEach(a=>{a.setAttribute("tabindex","-1")})}updated(t){super.updated(t),(t.has("slottedListboxes")||t.has("isOpen"))&&(this.visualCombobox&&"ariaControlsElements"in this.visualCombobox&&(this.visualCombobox.ariaControlsElements=this.slottedListboxes),this.dropDownButton&&"ariaControlsElements"in this.dropDownButton&&(this.dropDownButton.ariaControlsElements=this.slottedListboxes)),(t.has("disabled")||t.has("readonly"))&&(this.disabled||this.readonly)&&this.closePopover()}setInputValidity(){var t,i;!this.value&&this.required?(this.validationMessage?(t=this.inputElement)==null||t.setCustomValidity(this.validationMessage):(i=this.inputElement)==null||i.setCustomValidity(""),this.setValidity()):this.internals.setValidity({})}formResetCallback(){var i;let t=this.initialSelectedOption||null;this.setSelectedValue(t),this.filteredValue=(i=t==null?void 0:t.label)!=null?i:"",this.setInputValidity()}formStateRestoreCallback(t){let i=this.navItems.find(a=>a.value===t||a.label===t);this.setSelectedValue(i||null)}handleNativeInputFocus(){this.visualCombobox.focus()}resetFocusedOption(){this.navItems.filter(t=>t.hasAttribute("data-focused")).forEach(t=>this.updateOptionAttributes(t,!1))}updateSelectedOption(t){this.navItems.forEach(i=>{i.removeAttribute("selected")}),t==null||t.setAttribute("selected","")}updateOptionAttributes(t,i){t!==void 0&&(i?t.setAttribute("data-focused",""):t.removeAttribute("data-focused"),t.setAttribute("aria-selected",i.toString()))}handleBlurChange(){let t=this.getVisibleOptions(this.filteredValue),i=t.findIndex(a=>a.hasAttribute("data-focused"));if(i!==-1){this.setSelectedValue(t[i]),this.closePopover();return}i===-1&&this.filteredValue!==""&&this.invalidCustomValueText&&!this.getFirstSelectedOption()&&(this.helpText=this.invalidCustomValueText,this.helpTextType=zt.ERROR),this.setInputValidity()}updateFocusAndScrollIntoView(t,i,a){var d;this.updateOptionAttributes(t[i],!1),this.updateOptionAttributes(t[a],!0),(d=t[a])==null||d.scrollIntoView({block:"nearest"})}handleInputKeydown(t){let i=this.getVisibleOptions(this.filteredValue),a=i.findIndex(d=>d.hasAttribute("data-focused"));switch(t.key){case Z.ARROW_DOWN:{this.openPopover();let d=i.length-1===a?0:a+1;this.updateFocusAndScrollIntoView(i,a,d),t.preventDefault();break}case Z.ARROW_UP:{this.openPopover();let d=a===-1||a===0?i.length-1:a-1;this.updateFocusAndScrollIntoView(i,a,d),t.preventDefault();break}case Z.ENTER:{if(a===-1)return;this.setSelectedValue(i[a]),this.isOpen===!0&&this.closePopover();break}case Z.ESCAPE:{a!==-1&&this.updateOptionAttributes(i[a],!1),i.length&&this.shouldDisplayPopover(i.length)?this.closePopover():(this.resetSelectedValue(),this.filteredValue="");break}case Z.TAB:{this.closePopover();break}case Z.HOME:case Z.END:{this.resetFocusedOption();break}default:break}}updateHiddenOptions(){this.navItems.forEach(t=>{this.compareOptionWithValue(t,this.filteredValue)?(t.removeAttribute("data-hidden"),this.showOptionGroupAndDivider(t)):(t.setAttribute("data-hidden",""),this.hideOptionGroupAndDivider(t))})}hideOptionGroupAndDivider(t){var i,a,d;(i=t.parentElement)!=null&&i.matches(tn)&&((a=Array.from(t.parentElement.children))==null?void 0:a.filter(b=>!b.hasAttribute("data-hidden"))).length===0&&(t.parentElement.setAttribute("data-hidden",""),(d=t.parentElement.nextElementSibling)!=null&&d.matches(Da)&&t.parentElement.nextElementSibling.setAttribute("data-hidden",""))}showOptionGroupAndDivider(t){var i,a,d;(i=t.parentElement)!=null&&i.matches(tn)&&((a=Array.from(t.parentElement.children))==null?void 0:a.filter(b=>!b.hasAttribute("data-hidden"))).length>0&&(t.parentElement.removeAttribute("data-hidden"),(d=t.parentElement.nextElementSibling)!=null&&d.matches(Da)&&t.parentElement.nextElementSibling.removeAttribute("data-hidden"))}handleInputChange(t){var i;this.filteredValue=t.target.value,this.resetSelectedValue(),this.resetFocusedOption(),this.updateHiddenOptions(),(i=this.getFirstSelectedOption())==null||i.removeAttribute("selected"),this.isOpen===!1&&this.openPopover()}handleOptionsClick(t){var a;let i=(a=t.target.closest(pr))!=null?a:null;i&&!i.hasAttribute("disabled")&&(this.setSelectedValue(i),this.closePopover(),this.updateComplete.then(()=>this.handleNativeInputFocus()).catch(this.handleUpdateError))}shouldDisplayPopover(t){return this.disabled||this.readonly?!1:t?this.isOpen:!!this.noResultText}renderNativeInput(){return _`
|
6469
6469
|
<input
|
6470
6470
|
id="${this.inputId}"
|
6471
6471
|
name="${this.name}"
|