@momentum-design/components 0.66.2 → 0.66.3

package/dist/browser/index.js

@@ -1349,15 +1349,17 @@
     margin-bottom: 0.5rem;
   }
 
-`,Cn=[N,$d];var Vo=f.constructTagName("link"),Uo={LARGE:"large",MIDSIZE:"midsize",SMALL:"small"},Fo={LARGE:1,MIDSIZE:.875,SMALL:.75},kn={LINK_SIZE:Uo.LARGE};var wn=f.constructTagName("card"),ta={BORDER:"border",GHOST:"ghost",PROMOTIONAL:"promotional"},zd={HORIZONTAL:"horizontal",VERTICAL:"vertical"},q={VARIANT:ta.BORDER,ORIENTATION:zd.VERTICAL,TITLE_TYPE:S.HEADING_SMALL_BOLD,SUBTITLE_TYPE:S.BODY_MIDSIZE_MEDIUM,TAGNAME:w.SPAN,ICON_SIZE:1.5,ICON_LENGTH_UNIT:"rem",LINK:Vo,BUTTON:Tt};var Bo=i=>{class t extends i{constructor(){super(...arguments);this.cardTitle="";this.subtitle="";this.imageSrc="";this.imageAlt="";this.variant=q.VARIANT;this.orientation=q.ORIENTATION;this.titleTagName=q.TAGNAME;this.subtitleTagName=q.TAGNAME}renderImage(){return this.imageSrc?m`<img part="image" src="${this.imageSrc}" alt="${this.imageAlt}"/>`:g}renderIcon(){return this.iconName?m`<mdc-icon part="icon"
-       size="${q.ICON_SIZE}" 
-       length-unit="${q.ICON_LENGTH_UNIT}" 
-       name="${this.iconName}"></mdc-icon>`:g}renderTitle(){return m`<div part="title-container">
+`,Cn=[N,$d];var Vo=f.constructTagName("link"),Uo={LARGE:"large",MIDSIZE:"midsize",SMALL:"small"},Fo={LARGE:1,MIDSIZE:.875,SMALL:.75},kn={LINK_SIZE:Uo.LARGE};var wn=f.constructTagName("card"),ta={BORDER:"border",GHOST:"ghost",PROMOTIONAL:"promotional"},zd={HORIZONTAL:"horizontal",VERTICAL:"vertical"},q={VARIANT:ta.BORDER,ORIENTATION:zd.VERTICAL,TITLE_TYPE:S.HEADING_SMALL_BOLD,SUBTITLE_TYPE:S.BODY_MIDSIZE_MEDIUM,TAGNAME:w.SPAN,ICON_SIZE:1.5,ICON_LENGTH_UNIT:"rem",LINK:Vo,BUTTON:Tt};var Bo=i=>{class t extends i{constructor(){super(...arguments);this.cardTitle="";this.subtitle="";this.imageSrc="";this.imageAlt="";this.variant=q.VARIANT;this.orientation=q.ORIENTATION;this.titleTagName=q.TAGNAME;this.subtitleTagName=q.TAGNAME}renderImage(){return this.imageSrc?m`<img part="image" src="${this.imageSrc}" alt="${this.imageAlt}" />`:g}renderIcon(){return this.iconName?m`<mdc-icon
+            part="icon"
+            size="${q.ICON_SIZE}"
+            length-unit="${q.ICON_LENGTH_UNIT}"
+            name="${this.iconName}"
+          ></mdc-icon>`:g}renderTitle(){return m`<div part="title-container">
         <mdc-text part="title" type="${q.TITLE_TYPE}" tagname="${this.titleTagName}">${this.cardTitle}</mdc-text>
-        ${this.subtitle?m`<mdc-text part="subtitle"
-            type="${q.SUBTITLE_TYPE}" 
-            tagname="${this.subtitleTagName}">${this.subtitle}</mdc-text>`:g}
-        </div>`}}return n([c({type:String,attribute:"card-title"})],t.prototype,"cardTitle",2),n([c({type:String})],t.prototype,"subtitle",2),n([c({type:String,attribute:"image-src"})],t.prototype,"imageSrc",2),n([c({type:String,attribute:"image-alt"})],t.prototype,"imageAlt",2),n([c({type:String})],t.prototype,"variant",2),n([c({type:String,reflect:!0})],t.prototype,"orientation",2),n([c({type:String,attribute:"title-tag-name"})],t.prototype,"titleTagName",2),n([c({type:String,attribute:"subtitle-tag-name"})],t.prototype,"subtitleTagName",2),n([c({type:String,attribute:"icon-name"})],t.prototype,"iconName",2),t};var lt=class extends Bo(v){constructor(){super(...arguments);this.handleIconButtons=()=>{var e;if((e=this.iconButtons)==null||e.forEach(r=>{!r.matches(q.BUTTON)&&r.getAttribute("data-btn-type")!=="icon"?r.remove():(r.setAttribute("variant",ae.TERTIARY),r.setAttribute("size","32"))}),this.iconButtons&&this.iconButtons.length>3)for(let r=3;r<this.iconButtons.length;r+=1)this.iconButtons[r].remove()};this.handleFooterSlot=(e,r="")=>{var a,s,l;let o=[];e===q.LINK&&((a=this.footerLink)!=null&&a.length)?o=this.footerLink:e===q.BUTTON&&r===ae.PRIMARY&&((s=this.footerButtonPrimary)!=null&&s.length)?o=this.footerButtonPrimary:e===q.BUTTON&&r===ae.SECONDARY&&((l=this.footerButtonSecondary)!=null&&l.length)&&(o=this.footerButtonSecondary);for(let d=1;d<o.length;d+=1)o[d].remove();o.forEach(d=>{d.matches(e)||d.remove(),r&&d.setAttribute("variant",r)})};this.updateFooterButtonColors=()=>{let e=[...this.footerButtonPrimary||[],...this.footerButtonSecondary||[]];e==null||e.forEach(r=>{this.variant===ta.PROMOTIONAL?r.setAttribute("color",At.PROMOTIONAL):r.setAttribute("color",At.DEFAULT)})}}update(e){super.update(e),e.has("variant")&&this.updateFooterButtonColors()}renderHeader(){return this.cardTitle?m`<div part="header">
+        ${this.subtitle?m`<mdc-text part="subtitle" type="${q.SUBTITLE_TYPE}" tagname="${this.subtitleTagName}"
+              >${this.subtitle}</mdc-text
+            >`:g}
+      </div>`}}return n([c({type:String,attribute:"card-title"})],t.prototype,"cardTitle",2),n([c({type:String})],t.prototype,"subtitle",2),n([c({type:String,attribute:"image-src"})],t.prototype,"imageSrc",2),n([c({type:String,attribute:"image-alt"})],t.prototype,"imageAlt",2),n([c({type:String})],t.prototype,"variant",2),n([c({type:String,reflect:!0})],t.prototype,"orientation",2),n([c({type:String,attribute:"title-tag-name"})],t.prototype,"titleTagName",2),n([c({type:String,attribute:"subtitle-tag-name"})],t.prototype,"subtitleTagName",2),n([c({type:String,attribute:"icon-name"})],t.prototype,"iconName",2),t};var lt=class extends Bo(v){constructor(){super(...arguments);this.handleIconButtons=()=>{var e;if((e=this.iconButtons)==null||e.forEach(r=>{!r.matches(q.BUTTON)&&r.getAttribute("data-btn-type")!=="icon"?r.remove():(r.setAttribute("variant",ae.TERTIARY),r.setAttribute("size","32"))}),this.iconButtons&&this.iconButtons.length>3)for(let r=3;r<this.iconButtons.length;r+=1)this.iconButtons[r].remove()};this.handleFooterSlot=(e,r="")=>{var a,s,l;let o=[];e===q.LINK&&((a=this.footerLink)!=null&&a.length)?o=this.footerLink:e===q.BUTTON&&r===ae.PRIMARY&&((s=this.footerButtonPrimary)!=null&&s.length)?o=this.footerButtonPrimary:e===q.BUTTON&&r===ae.SECONDARY&&((l=this.footerButtonSecondary)!=null&&l.length)&&(o=this.footerButtonSecondary);for(let d=1;d<o.length;d+=1)o[d].remove();o.forEach(d=>{d.matches(e)||d.remove(),r&&d.setAttribute("variant",r)})};this.updateFooterButtonColors=()=>{let e=[...this.footerButtonPrimary||[],...this.footerButtonSecondary||[]];e==null||e.forEach(r=>{this.variant===ta.PROMOTIONAL?r.setAttribute("color",At.PROMOTIONAL):r.setAttribute("color",At.DEFAULT)})}}update(e){super.update(e),e.has("variant")&&this.updateFooterButtonColors()}renderHeader(){return this.cardTitle?m`<div part="header">
       ${this.renderIcon()}
       ${this.renderTitle()}
       <div part="icon-button"><slot name="icon-button" @slotchange=${this.handleIconButtons}></slot></div>