@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}
|