@momentum-design/components 0.122.19 → 0.122.20
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 +16 -2
 - package/dist/browser/index.js.map +2 -2
 - package/dist/components/badge/badge.component.d.ts +2 -0
 - package/dist/components/badge/badge.component.js +2 -0
 - package/dist/components/badge/badge.styles.js +5 -2
 - package/dist/components/navmenuitem/navmenuitem.styles.js +11 -0
 - package/dist/custom-elements.json +9 -1
 - package/dist/react/badge/index.d.ts +2 -0
 - package/dist/react/badge/index.js +2 -0
 - package/package.json +1 -1
 
    
        package/dist/browser/index.js
    CHANGED
    
    | 
         @@ -1693,6 +1693,9 @@ 
     | 
|
| 
       1693 
1693 
     | 
    
         | 
| 
       1694 
1694 
     | 
    
         
             
                  --mdc-badge-overlay-background-color: var(--mds-color-theme-background-solid-primary-normal);
         
     | 
| 
       1695 
1695 
     | 
    
         | 
| 
      
 1696 
     | 
    
         
            +
                  --mdc-badge-dot-width: 0.75rem;
         
     | 
| 
      
 1697 
     | 
    
         
            +
                  --mdc-badge-dot-height: 0.75rem;
         
     | 
| 
      
 1698 
     | 
    
         
            +
             
     | 
| 
       1696 
1699 
     | 
    
         
             
                  color: var(--mdc-badge-primary-foreground-color);
         
     | 
| 
       1697 
1700 
     | 
    
         
             
                }
         
     | 
| 
       1698 
1701 
     | 
    
         
             
                :host::part(badge-overlay) {
         
     | 
| 
         @@ -1707,8 +1710,8 @@ 
     | 
|
| 
       1707 
1710 
     | 
    
         
             
                  background-color: var(--mdc-badge-primary-background-color);
         
     | 
| 
       1708 
1711 
     | 
    
         
             
                }
         
     | 
| 
       1709 
1712 
     | 
    
         
             
                :host::part(badge-dot) {
         
     | 
| 
       1710 
     | 
    
         
            -
                  width:  
     | 
| 
       1711 
     | 
    
         
            -
                  height:  
     | 
| 
      
 1713 
     | 
    
         
            +
                  width: var(--mdc-badge-dot-width);
         
     | 
| 
      
 1714 
     | 
    
         
            +
                  height: var(--mdc-badge-dot-height);
         
     | 
| 
       1712 
1715 
     | 
    
         
             
                  border-radius: 50%;
         
     | 
| 
       1713 
1716 
     | 
    
         
             
                  background-color: var(--mdc-badge-primary-background-color);
         
     | 
| 
       1714 
1717 
     | 
    
         
             
                }
         
     | 
| 
         @@ -4542,6 +4545,17 @@ 
     | 
|
| 
       4542 
4545 
     | 
    
         
             
                  left: -0.75rem;
         
     | 
| 
       4543 
4546 
     | 
    
         
             
                  top: 0.875rem;
         
     | 
| 
       4544 
4547 
     | 
    
         
             
                }
         
     | 
| 
      
 4548 
     | 
    
         
            +
             
     | 
| 
      
 4549 
     | 
    
         
            +
                :host mdc-badge {
         
     | 
| 
      
 4550 
     | 
    
         
            +
                  --mdc-badge-dot-width: 1rem;
         
     | 
| 
      
 4551 
     | 
    
         
            +
                  --mdc-badge-dot-height: 1rem;
         
     | 
| 
      
 4552 
     | 
    
         
            +
                }
         
     | 
| 
      
 4553 
     | 
    
         
            +
             
     | 
| 
      
 4554 
     | 
    
         
            +
                @media (forced-colors: active) {
         
     | 
| 
      
 4555 
     | 
    
         
            +
                  :host(:not([in-menupopover]))::before {
         
     | 
| 
      
 4556 
     | 
    
         
            +
                    background-color: ButtonText;
         
     | 
| 
      
 4557 
     | 
    
         
            +
                  }
         
     | 
| 
      
 4558 
     | 
    
         
            +
                }
         
     | 
| 
       4545 
4559 
     | 
    
         
             
              `,...At()],Kv=Ox;var Xe=class extends Wt(pr){constructor(){super();this.maxCounter=Gv.MAX_COUNTER;this.ariaLabel=null;this.sideNavigationContext=$e.consume({host:this,context:Vo.Context});this.emitNavMenuItemActiveChange=t=>{let r=new CustomEvent("activechange",{detail:{navId:this.navId,active:t},bubbles:!0});this.dispatchEvent(r)};this.addEventListener("click",this.handleClickEvent.bind(this)),this.addEventListener("focusin",this.renderDynamicTooltip.bind(this)),this.addEventListener("mouseenter",this.renderDynamicTooltip.bind(this)),this.addEventListener("focusout",this.removeTooltip.bind(this)),this.addEventListener("mouseout",this.removeTooltip.bind(this))}connectedCallback(){super.connectedCallback(),this.variant=void 0,!this.navId&&this.onerror&&this.onerror("[mdc-navmenuitem] navId is required and was not provided."),this.toggleAttribute("in-menupopover",this.isNested())}disconnectedCallback(){super.disconnectedCallback(),this.removeTooltip()}updated(){var r,s;let t=(r=this.sideNavigationContext)==null?void 0:r.value;if(t)if(this.showLabel=this.isNested()?!0:t.expanded,this.showLabel)this.removeAttribute("aria-label");else{let d=(s=this.label)!=null?s:"";this.ariaLabel=this.ariaLabel||d,this.setAttribute("aria-label",d)}}removeTooltip(){let t=document.querySelector(`${Qa}[triggerid="${this.id}"]`);t&&t.remove()}renderDynamicTooltip(){if(!this.tooltipText)return;this.id||(this.id=`mdc-navmenuitem-${Te()}`),this.removeTooltip();let t=document.createElement(Qa);t.id=`mdc-navmenuitem-tooltip-${Te()}`,t.textContent=this.tooltipText,t.setAttribute("triggerid",this.id),t.setAttribute("visible",""),t.setAttribute("show-arrow",""),this.hasAttribute("slot")&&t.setAttribute("slot",this.getAttribute("slot")||""),this.after(t)}isNested(){let t=this.parentElement;for(;t;){if(t.tagName.toLowerCase()===te)return!0;t=t.parentElement}return!1}modifyIconName(t){if(!this.iconName)return;let r=this.iconName.endsWith("-filled"),s=bo(this.iconName);t?r||(this.prevIconName=this.iconName,this.iconName=`${s}-filled`):this.prevIconName&&(this.iconName=this.prevIconName)}handleClickEvent(){this.disabled||this.emitNavMenuItemActiveChange(this.active)}update(t){super.update(t),t.has("active")&&this.modifyIconName(this.active)}renderTextLabel(t){return _`
         
     | 
| 
       4546 
4560 
     | 
    
         
             
                  <mdc-text
         
     | 
| 
       4547 
4561 
     | 
    
         
             
                    type=${this.active?st.BODY_MIDSIZE_BOLD:st.BODY_MIDSIZE_MEDIUM}
         
     |