@momentum-design/components 0.39.2 → 0.39.4

package/dist/browser/index.js

@@ -1534,7 +1534,7 @@
     border-top-right-radius: var(--mdc-popover-arrow-border-radius);
     border-bottom-left-radius: 100%;
   }
-`,Ua=[sc];var Va=g.constructTagName("popover"),ht={LEFT_START:"left-start",LEFT:"left",LEFT_END:"left-end",RIGHT_START:"right-start",RIGHT:"right",RIGHT_END:"right-end",TOP_START:"top-start",TOP:"top",TOP_END:"top-end",BOTTOM_START:"bottom-start",BOTTOM:"bottom",BOTTOM_END:"bottom-end"},Ar={CLICK:"click",MOUSEENTER:"mouseenter",FOCUSIN:"focusin",MANUAL:"manual"},ut={TONAL:"tonal",CONTRAST:"contrast"},N={PLACEMENT:ht.BOTTOM,TRIGGER:Ar.CLICK,COLOR:ut.TONAL,OFFSET:4,VISIBLE:!1,ARROW:!1,CLOSE_BUTTON:!1,FOCUS_TRAP:!1,INTERACTIVE:!1,PREVENT_SCROLL:!1,HIDE_ON_ESCAPE:!1,HIDE_ON_BLUR:!1,HIDE_ON_CLICK_OUTSIDE:!1,FOCUS_BACK:!1,BACKDROP:!1,FLIP:!0,SIZE:!1,DELAY:"0,0",ROLE:"dialog",Z_INDEX:1e3,DISABLE_ARIA_EXPANDED:!1};var Fa=o=>{class t extends o{constructor(...i){super(...i);this.enabledFocusTrap=N.FOCUS_TRAP;this.enabledPreventScroll=N.PREVENT_SCROLL;this.focusTrapIndex=-1;this.focusableElements=[];this.shouldWrapFocus=()=>!0;this.addEventListener("keydown",this.handleKeydown)}deactivateFocusTrap(){this.enabledFocusTrap=!1,this.enabledPreventScroll=!1,this.focusTrapIndex=-1,document.body.style.overflow=""}hasNoClientRects(i){return i.getClientRects().length===0}hasZeroDimensions(i){let{width:s,height:a}=i.getBoundingClientRect(),{offsetWidth:n,offsetHeight:d}=i;return n+d+a+s===0}isNotVisible(i){return this.hasZeroDimensions(i)||this.hasNoClientRects(i)}hasHiddenStyle(i){let{display:s,opacity:a,visibility:n}=i.style;return s==="none"||a==="0"||n==="hidden"||n==="collapse"}hasComputedHidden(i){let s=getComputedStyle(i);return s.visibility==="hidden"||s.height==="0"||s.display==="none"}isHidden(i){return i.hasAttribute("hidden")||i.getAttribute("aria-hidden")==="true"||this.hasHiddenStyle(i)||this.isNotVisible(i)||this.hasComputedHidden(i)}isNotTabbable(i){return i.getAttribute("tabindex")==="-1"}isInteractiveElement(i){return!!(new Set(["BUTTON","DETAILS","EMBED","IFRAME","SELECT","TEXTAREA"]).has(i.tagName)||i instanceof HTMLAnchorElement&&i.hasAttribute("href")||i instanceof HTMLInputElement&&i.type!=="hidden"||(i instanceof HTMLAudioElement||i instanceof HTMLVideoElement)&&i.hasAttribute("controls")||(i instanceof HTMLImageElement||i instanceof HTMLObjectElement)&&i.hasAttribute("usemap")||i.hasAttribute("tabindex")&&i.tabIndex>-1)}isFocusable(i){return this.isHidden(i)||this.isNotTabbable(i)?!1:this.isInteractiveElement(i)}findFocusable(i,s=new Set){return i instanceof HTMLElement&&this.isFocusable(i)&&s.add(i),Array.from(i.children).forEach(n=>{let d=n;this.isFocusable(d)&&s.add(d),d.shadowRoot?this.findFocusable(d.shadowRoot,s):d.tagName==="SLOT"?d.assignedElements({flatten:!0}).forEach(p=>{p instanceof HTMLElement&&this.findFocusable(p,s)}):this.findFocusable(d,s)}),[...s]}setFocusableElements(){this.shadowRoot&&(this.focusableElements=this.findFocusable(this.shadowRoot,new Set))}setInitialFocus(i=0){this.focusableElements.length!==0&&(this.enabledPreventScroll&&(document.body.style.overflow="hidden"),this.focusableElements[i]&&(this.focusTrapIndex=i,this.focusableElements[i].focus()))}calculateNextIndex(i,s){let{length:a}=this.focusableElements,n=this.shouldWrapFocus();if(i===-1)return s>0?0:a-1;let d=i+s;return n?(d<0&&(d=a-1),d>=a&&(d=0)):(d<0&&(d=0),d>=a&&(d=a-1)),d}getDeepActiveElement(){var s;let i=document.activeElement||document.body;for(;i instanceof HTMLElement&&((s=i.shadowRoot)!=null&&s.activeElement);)i=i.shadowRoot.activeElement;return i||document.body}findElement(i){return this.focusableElements.findIndex(s=>this.isEqualFocusNode(i,s))}isEqualFocusNode(i,s){return i.nodeType>=0?s.isEqualNode(i)&&s===i:!1}trapFocus(i){if(this.focusableElements.length===0)return;let s=this.getDeepActiveElement(),a=this.findElement(s);i?this.focusTrapIndex=this.calculateNextIndex(a,-1):this.focusTrapIndex=this.calculateNextIndex(a,1);let n=this.focusableElements[this.focusTrapIndex];n&&n.focus()}handleKeydown(i){!this.enabledFocusTrap||!this.focusableElements.length||i.key==="Tab"&&(i.preventDefault(),this.trapFocus(i.shiftKey))}}return l([c({type:Boolean})],t.prototype,"enabledFocusTrap",2),l([c({type:Boolean})],t.prototype,"enabledPreventScroll",2),t};var pi=class{constructor(){this.stack=[]}push(t){this.stack.push(t)}pop(){return this.stack.pop()}peek(){return this.stack[this.stack.length-1]}remove(t){this.stack=this.stack.filter(e=>e!==t)}clear(){this.stack=[]}},ft=new pi;var gt=class{static dispatchPopoverEvent(t,e){e.dispatchEvent(new CustomEvent(t,{detail:{show:e.visible},composed:!0,bubbles:!0}))}static onShowPopover(t){this.dispatchPopoverEvent("popover-on-show",t)}static onHidePopover(t){this.dispatchPopoverEvent("popover-on-hide",t)}static onCreatedPopover(t){this.dispatchPopoverEvent("popover-on-created",t)}static onDestroyedPopover(t){this.dispatchPopoverEvent("popover-on-destroyed",t)}};var po=class{constructor(t){this.arrowPixelChange=!1;this.popover=t}setupDelay(){try{let[t,e]=this.popover.delay.split(",").map(r=>{let i=parseInt(r,10);if(Number.isNaN(i)||i<0)throw new Error(`Invalid delay value: ${r}`);return i});return[t,e]}catch{return this.popover.delay="0,0",[0,0]}}setupHoverBridge(t){let e=this.popover.renderRoot.querySelector(".popover-hover-bridge");Object.assign(e.style,{top:"",left:"",right:"",bottom:""});let r=`calc(${this.popover.showArrow?"0.75rem + ":""}${this.popover.offset}px)`,i=this.popover.offsetHeight||0,s=this.popover.offsetWidth||0;if(e)switch(t.split("-")[0]){case"top":e.style.height=r,e.style.bottom=`calc(-1 * (${r}))`,e.style.left="50%",e.style.width=`${s}px`;break;case"left":e.style.height=`${i}px`,e.style.width=r,e.style.right=`calc(-1.5 * (${r}))`;break;case"right":e.style.height=`${i}px`,e.style.width=r,e.style.left=`calc(-0.5 * (${r}))`;break;case"bottom":default:e.style.height=r,e.style.top=`calc(-1 * (${r}))`,e.style.left="50%",e.style.width=`${s}px`;break}}setupAppendTo(){if(this.popover.appendTo){let t=document.getElementById(this.popover.appendTo);t&&t.appendChild(this.popover)}}setupAccessibility(){var t,e,r;this.popover.toggleAttribute("aria-modal",this.popover.interactive),this.popover.interactive&&(this.popover.ariaLabel||(this.popover.ariaLabel=((t=this.popover.triggerElement)==null?void 0:t.ariaLabel)||((e=this.popover.triggerElement)==null?void 0:e.textContent)||""),this.popover.ariaLabelledby||(this.popover.ariaLabelledby=((r=this.popover.triggerElement)==null?void 0:r.id)||""))}updateArrowStyle(t,e){var p;if(!this.popover.arrowElement)return;let r=e.split("-")[0],i={top:"bottom",right:"left",bottom:"top",left:"right"}[r],{x:s,y:a}=t,n=this.popover.arrowElement.getBoundingClientRect(),d=(p=this.popover.arrowElement.offsetParent)==null?void 0:p.getBoundingClientRect();if(!this.arrowPixelChange){let u=d!=null&&d[i]?12-Math.abs(n[i]-d[i]):0;Math.round(u)===1?this.arrowPixelChange=!0:this.arrowPixelChange=!1}let m=this.arrowPixelChange?.5:0;this.popover.arrowElement.setAttribute("data-side",r),Object.assign(this.popover.arrowElement.style,{left:s!=null?`${s}px`:"",top:a!=null?`${a}px`:"",[i]:`${-this.popover.arrowElement.offsetHeight/2-m}px`})}updatePopoverStyle(t,e){Object.assign(this.popover.style,{left:`${t}px`,top:`${e}px`})}createBackdrop(){var t;if(!this.popover.backdropElement){let e=document.createElement("div");e.classList.add("popover-backdrop"),(t=this.popover.parentElement)==null||t.appendChild(e);let r=document.createElement("style");r.textContent=`
+`,Ua=[sc];var Va=g.constructTagName("popover"),ht={LEFT_START:"left-start",LEFT:"left",LEFT_END:"left-end",RIGHT_START:"right-start",RIGHT:"right",RIGHT_END:"right-end",TOP_START:"top-start",TOP:"top",TOP_END:"top-end",BOTTOM_START:"bottom-start",BOTTOM:"bottom",BOTTOM_END:"bottom-end"},Ar={CLICK:"click",MOUSEENTER:"mouseenter",FOCUSIN:"focusin",MANUAL:"manual"},ut={TONAL:"tonal",CONTRAST:"contrast"},N={PLACEMENT:ht.BOTTOM,TRIGGER:Ar.CLICK,COLOR:ut.TONAL,OFFSET:4,VISIBLE:!1,ARROW:!1,CLOSE_BUTTON:!1,FOCUS_TRAP:!1,INTERACTIVE:!1,PREVENT_SCROLL:!1,HIDE_ON_ESCAPE:!1,HIDE_ON_BLUR:!1,HIDE_ON_CLICK_OUTSIDE:!1,FOCUS_BACK:!1,BACKDROP:!1,FLIP:!0,SIZE:!1,DELAY:"0,0",ROLE:"dialog",Z_INDEX:1e3,DISABLE_ARIA_EXPANDED:!1};var Fa=o=>{class t extends o{constructor(...i){super(...i);this.enabledFocusTrap=N.FOCUS_TRAP;this.enabledPreventScroll=N.PREVENT_SCROLL;this.focusTrapIndex=-1;this.focusableElements=[];this.shouldWrapFocus=()=>!0;this.addEventListener("keydown",this.handleKeydown)}deactivateFocusTrap(){this.enabledFocusTrap=!1,this.enabledPreventScroll=!1,this.focusTrapIndex=-1,document.body.style.overflow=""}hasNoClientRects(i){return i.getClientRects().length===0}hasZeroDimensions(i){let{width:s,height:a}=i.getBoundingClientRect(),{offsetWidth:n,offsetHeight:d}=i;return n+d+a+s===0}isNotVisible(i){return this.hasZeroDimensions(i)||this.hasNoClientRects(i)}hasHiddenStyle(i){let{display:s,opacity:a,visibility:n}=i.style;return s==="none"||a==="0"||n==="hidden"||n==="collapse"}hasComputedHidden(i){let s=getComputedStyle(i);return s.visibility==="hidden"||s.height==="0"||s.display==="none"}isHidden(i){return i.hasAttribute("hidden")||i.getAttribute("aria-hidden")==="true"||this.hasHiddenStyle(i)||this.isNotVisible(i)||this.hasComputedHidden(i)}isNotTabbable(i){return i.getAttribute("tabindex")==="-1"}isInteractiveElement(i){return!!(new Set(["BUTTON","DETAILS","EMBED","IFRAME","SELECT","TEXTAREA"]).has(i.tagName)||i instanceof HTMLAnchorElement&&i.hasAttribute("href")||i instanceof HTMLInputElement&&i.type!=="hidden"||(i instanceof HTMLAudioElement||i instanceof HTMLVideoElement)&&i.hasAttribute("controls")||(i instanceof HTMLImageElement||i instanceof HTMLObjectElement)&&i.hasAttribute("usemap")||i.hasAttribute("tabindex")&&i.tabIndex>-1)}isFocusable(i){return this.isHidden(i)||this.isNotTabbable(i)?!1:this.isInteractiveElement(i)}findFocusable(i,s=new Set){return i instanceof HTMLElement&&this.isFocusable(i)&&s.add(i),Array.from(i.children).forEach(n=>{let d=n;this.isFocusable(d)&&s.add(d),d.shadowRoot?this.findFocusable(d.shadowRoot,s):d.tagName==="SLOT"?d.assignedElements({flatten:!0}).forEach(p=>{p instanceof HTMLElement&&this.findFocusable(p,s)}):this.findFocusable(d,s)}),[...s]}setFocusableElements(){this.shadowRoot&&(this.focusableElements=this.findFocusable(this.shadowRoot,new Set))}setInitialFocus(i=0){this.focusableElements.length!==0&&(this.enabledPreventScroll&&(document.body.style.overflow="hidden"),this.focusableElements[i]&&(this.focusTrapIndex=i,this.focusableElements[i].focus()))}calculateNextIndex(i,s){let{length:a}=this.focusableElements,n=this.shouldWrapFocus();if(i===-1)return s>0?0:a-1;let d=i+s;return n?(d<0&&(d=a-1),d>=a&&(d=0)):(d<0&&(d=0),d>=a&&(d=a-1)),d}getDeepActiveElement(){var s;let i=document.activeElement||document.body;for(;i instanceof HTMLElement&&((s=i.shadowRoot)!=null&&s.activeElement);)i=i.shadowRoot.activeElement;return i||document.body}findElement(i){return this.focusableElements.findIndex(s=>this.isEqualFocusNode(i,s))}isEqualFocusNode(i,s){return i.nodeType>=0?s.isEqualNode(i)&&s===i:!1}trapFocus(i){if(this.focusableElements.length===0)return;let s=this.getDeepActiveElement(),a=this.findElement(s);i?this.focusTrapIndex=this.calculateNextIndex(a,-1):this.focusTrapIndex=this.calculateNextIndex(a,1);let n=this.focusableElements[this.focusTrapIndex];n&&n.focus()}handleKeydown(i){!this.enabledFocusTrap||!this.focusableElements.length||i.key==="Tab"&&(i.preventDefault(),this.trapFocus(i.shiftKey))}}return l([c({type:Boolean})],t.prototype,"enabledFocusTrap",2),l([c({type:Boolean})],t.prototype,"enabledPreventScroll",2),t};var pi=class{constructor(){this.stack=[]}push(t){this.stack.push(t)}pop(){return this.stack.pop()}peek(){return this.stack[this.stack.length-1]}remove(t){this.stack=this.stack.filter(e=>e!==t)}clear(){this.stack=[]}},ft=new pi;var gt=class{static dispatchPopoverEvent(t,e){e.dispatchEvent(new CustomEvent(t,{detail:{show:e.visible},composed:!0,bubbles:!0}))}static onShowPopover(t){this.dispatchPopoverEvent("shown",t)}static onHidePopover(t){this.dispatchPopoverEvent("hidden",t)}static onCreatedPopover(t){this.dispatchPopoverEvent("created",t)}static onDestroyedPopover(t){this.dispatchPopoverEvent("destroyed",t)}};var po=class{constructor(t){this.arrowPixelChange=!1;this.popover=t}setupDelay(){try{let[t,e]=this.popover.delay.split(",").map(r=>{let i=parseInt(r,10);if(Number.isNaN(i)||i<0)throw new Error(`Invalid delay value: ${r}`);return i});return[t,e]}catch{return this.popover.delay="0,0",[0,0]}}setupHoverBridge(t){let e=this.popover.renderRoot.querySelector(".popover-hover-bridge");Object.assign(e.style,{top:"",left:"",right:"",bottom:""});let r=`calc(${this.popover.showArrow?"0.75rem + ":""}${this.popover.offset}px)`,i=this.popover.offsetHeight||0,s=this.popover.offsetWidth||0;if(e)switch(t.split("-")[0]){case"top":e.style.height=r,e.style.bottom=`calc(-1 * (${r}))`,e.style.left="50%",e.style.width=`${s}px`;break;case"left":e.style.height=`${i}px`,e.style.width=r,e.style.right=`calc(-1.5 * (${r}))`;break;case"right":e.style.height=`${i}px`,e.style.width=r,e.style.left=`calc(-0.5 * (${r}))`;break;case"bottom":default:e.style.height=r,e.style.top=`calc(-1 * (${r}))`,e.style.left="50%",e.style.width=`${s}px`;break}}setupAppendTo(){if(this.popover.appendTo){let t=document.getElementById(this.popover.appendTo);t&&t.appendChild(this.popover)}}setupAccessibility(){var t,e,r;this.popover.toggleAttribute("aria-modal",this.popover.interactive),this.popover.interactive&&(this.popover.ariaLabel||(this.popover.ariaLabel=((t=this.popover.triggerElement)==null?void 0:t.ariaLabel)||((e=this.popover.triggerElement)==null?void 0:e.textContent)||""),this.popover.ariaLabelledby||(this.popover.ariaLabelledby=((r=this.popover.triggerElement)==null?void 0:r.id)||""))}updateArrowStyle(t,e){var p;if(!this.popover.arrowElement)return;let r=e.split("-")[0],i={top:"bottom",right:"left",bottom:"top",left:"right"}[r],{x:s,y:a}=t,n=this.popover.arrowElement.getBoundingClientRect(),d=(p=this.popover.arrowElement.offsetParent)==null?void 0:p.getBoundingClientRect();if(!this.arrowPixelChange){let u=d!=null&&d[i]?12-Math.abs(n[i]-d[i]):0;Math.round(u)===1?this.arrowPixelChange=!0:this.arrowPixelChange=!1}let m=this.arrowPixelChange?.5:0;this.popover.arrowElement.setAttribute("data-side",r),Object.assign(this.popover.arrowElement.style,{left:s!=null?`${s}px`:"",top:a!=null?`${a}px`:"",[i]:`${-this.popover.arrowElement.offsetHeight/2-m}px`})}updatePopoverStyle(t,e){Object.assign(this.popover.style,{left:`${t}px`,top:`${e}px`})}createBackdrop(){var t;if(!this.popover.backdropElement){let e=document.createElement("div");e.classList.add("popover-backdrop"),(t=this.popover.parentElement)==null||t.appendChild(e);let r=document.createElement("style");r.textContent=`
         .popover-backdrop {
           position: fixed;
           top: 0;
@@ -2035,10 +2035,6 @@
     --mdc-chip-color: var(--mds-color-theme-text-primary-disabled);
     cursor: auto;
   }
-
-  :host::part(close-icon){
-    border-radius: 0.25rem;
-  }
 `,Qa=[w,fc];var Ja=g.constructTagName("inputchip"),go={TEXT_TYPE:_.BODY_MIDSIZE_REGULAR,TAG_NAME:C.SPAN,CLOSE_ICON:"cancel-bold"};var xt=class extends X(ee(y)){constructor(){super(...arguments);this.label="";this.error=!1;this.clearAriaLabel=""}renderIcon(){return this.iconName?h`
     <mdc-icon 
       name="${this.iconName}" 
@@ -2046,7 +2042,7 @@
       size="1"></mdc-icon>
   `:v}handleClose(e){e.stopPropagation();let r=e.constructor;this.dispatchEvent(new r(e.type,e))}render(){return h`
         ${this.renderIcon()}
-        <mdc-text type="${go.TEXT_TYPE}" tagname="${go.TAG_NAME}">${this.label}</mdc-text>
+        <mdc-text part="label" type="${go.TEXT_TYPE}" tagname="${go.TAG_NAME}">${this.label}</mdc-text>
         <mdc-button 
           ?disabled="${this.disabled}"
           variant="tertiary"