@momentum-design/components 0.101.2 → 0.101.4

package/dist/browser/index.js

@@ -1458,24 +1458,28 @@
     --mdc-buttongroup-border-radius: 1.25rem;
     --mdc-buttongroup-border-color: var(--mds-color-theme-outline-button-normal);
     --mdc-buttongroup-divider-color: var(--mds-color-theme-outline-secondary-normal);
+  }
 
+  :host::part(container) {
+    display: flex;
     border-radius: var(--mdc-buttongroup-border-radius);
     border: 1px solid var(--mdc-buttongroup-border-color);
   }
 
-  :host([variant='primary']) {
+  :host([variant='primary'])::part(container) {
     border: none;
     background-color: var(--mds-color-theme-outline-primary-normal);
     gap: 1px;
   }
 
   ::slotted(mdc-button) {
+    width: inherit;
     border-radius: 0;
     border: none;
     box-sizing: content-box;
   }
 
-  :host([orientation='vertical']) {
+  :host([orientation='vertical'])::part(container) {
     flex-direction: column;
   }
 
@@ -1530,7 +1534,7 @@
   :host([compact][orientation='horizontal'][size='40']) ::slotted(mdc-button) {
     width: 2.5rem;
   }
-`,gm=[yt,Db];var qr=class extends j{constructor(){super(...arguments);this.orientation=Dn.ORIENTATION;this.variant=Dn.VARIANT;this.size=Dn.SIZE;this.compact=!1}handleSlotChange(){this.buttons.forEach(t=>{t.setAttribute("size",this.size.toString()),t.setAttribute("variant",this.variant)})}updated(t){super.updated(t),(t.has("size")||t.has("variant"))&&this.handleSlotChange()}render(){return w`<slot @slotchange=${this.handleSlotChange}></slot>`}};qr.styles=[...j.styles,...gm],p([g({type:String,reflect:!0})],qr.prototype,"orientation",2),p([g({type:String,reflect:!0})],qr.prototype,"variant",2),p([g({type:Number,reflect:!0})],qr.prototype,"size",2),p([g({type:Boolean,reflect:!0})],qr.prototype,"compact",2),p([Nt({selector:"mdc-button"})],qr.prototype,"buttons",2);var kc=qr;kc.register(vm);var Fb=kc;var bm=W.constructTagName("linksimple"),Go={INLINE:!1,INVERTED:!1};var $b=[yt,G`
+`,gm=[yt,Db];var qr=class extends j{constructor(){super(...arguments);this.orientation=Dn.ORIENTATION;this.variant=Dn.VARIANT;this.size=Dn.SIZE;this.compact=!1}handleSlotChange(){this.buttons.forEach(t=>{t.setAttribute("size",this.size.toString()),t.setAttribute("variant",this.variant)})}updated(t){super.updated(t),(t.has("size")||t.has("variant"))&&this.handleSlotChange()}render(){return w`<div part="container"><slot @slotchange=${this.handleSlotChange}></slot></div>`}};qr.styles=[...j.styles,...gm],p([g({type:String,reflect:!0})],qr.prototype,"orientation",2),p([g({type:String,reflect:!0})],qr.prototype,"variant",2),p([g({type:Number,reflect:!0})],qr.prototype,"size",2),p([g({type:Boolean,reflect:!0})],qr.prototype,"compact",2),p([Nt({selector:"mdc-button"})],qr.prototype,"buttons",2);var kc=qr;kc.register(vm);var Fb=kc;var bm=W.constructTagName("linksimple"),Go={INLINE:!1,INVERTED:!1};var $b=[yt,G`
     :host {
       --mdc-link-border-radius: 0.25rem;
       --mdc-link-color-active: var(--mds-color-theme-text-accent-active);
@@ -1600,7 +1604,7 @@
       ${this.prefixIcon?w` <mdc-icon name="${this.prefixIcon}" part="prefix-icon" length-unit="rem"></mdc-icon>`:""}
       <slot @slotchange=${this.inferButtonType}></slot>
       ${this.postfixIcon?w` <mdc-icon name="${this.postfixIcon}" part="postfix-icon" length-unit="rem"></mdc-icon>`:""}
-    `}};Wo.styles=[...Yi.styles],p([g({type:Number,reflect:!0})],Wo.prototype,"size",2),p([g({type:Boolean,attribute:"soft-disabled",reflect:!0})],Wo.prototype,"softDisabled",2);var Cc=Wo;var Em=W.constructTagName("buttonlink");Cc.register(Em);var zb=Cc;var Fn=W.constructTagName("link"),$n={LARGE:"large",MIDSIZE:"midsize",SMALL:"small"},zn={LARGE:1,MIDSIZE:.875,SMALL:.75},Tm={LINK_SIZE:$n.LARGE};var xm=W.constructTagName("card"),wc={BORDER:"border",GHOST:"ghost",PROMOTIONAL:"promotional"},Vb={HORIZONTAL:"horizontal",VERTICAL:"vertical"},re={VARIANT:wc.BORDER,ORIENTATION:Vb.VERTICAL,TITLE_TYPE:ot.HEADING_SMALL_BOLD,SUBTITLE_TYPE:ot.BODY_MIDSIZE_MEDIUM,TAGNAME:mt.SPAN,ICON_SIZE:1.5,ICON_LENGTH_UNIT:"rem",LINK:Fn,BUTTON:Hr};var Vn=l=>{class i extends l{constructor(){super(...arguments);this.cardTitle="";this.subtitle="";this.imageSrc="";this.imageAlt="";this.variant=re.VARIANT;this.orientation=re.ORIENTATION;this.titleTagName=re.TAGNAME;this.subtitleTagName=re.TAGNAME}renderImage(){return this.imageSrc?w`<img part="image" src="${this.imageSrc}" alt="${this.imageAlt}" />`:Y}renderIcon(){return this.iconName?w`<mdc-icon
+    `}};Wo.styles=[...Yi.styles],p([g({type:Number,reflect:!0})],Wo.prototype,"size",2),p([g({type:Boolean,attribute:"soft-disabled",reflect:!0})],Wo.prototype,"softDisabled",2);var Cc=Wo;var Em=W.constructTagName("buttonlink");Cc.register(Em);var zb=Cc;var Fn=W.constructTagName("link"),$n={LARGE:"large",MIDSIZE:"midsize",SMALL:"small"},zn={LARGE:1,MIDSIZE:.875,SMALL:.75},Tm={LINK_SIZE:$n.LARGE};var xm=W.constructTagName("card"),wc={BORDER:"border",GHOST:"ghost",PROMOTIONAL:"promotional"},Vb={HORIZONTAL:"horizontal",VERTICAL:"vertical"},re={VARIANT:wc.BORDER,ORIENTATION:Vb.VERTICAL,TITLE_TYPE:ot.HEADING_SMALL_BOLD,SUBTITLE_TYPE:ot.BODY_MIDSIZE_MEDIUM,TAGNAME:mt.SPAN,ICON_SIZE:1.5,ICON_LENGTH_UNIT:"rem",LINK:Fn,BUTTON:Hr};var Vn=l=>{class i extends l{constructor(){super(...arguments);this.cardTitle="";this.subtitle="";this.imageSrc="";this.imageAlt="";this.variant=re.VARIANT;this.orientation=re.ORIENTATION;this.titleTagName=re.TAGNAME;this.subtitleTagName=re.TAGNAME}renderImage(){return this.imageSrc?w`<div part="image-wrapper"><img part="image" src="${this.imageSrc}" alt="${this.imageAlt}" /></div>`:Y}renderIcon(){return this.iconName?w`<mdc-icon
             part="icon"
             size="${re.ICON_SIZE}"
             length-unit="${re.ICON_LENGTH_UNIT}"
@@ -1625,7 +1629,7 @@
       </slot>`}}return p([Nt({slot:"footer-link"})],i.prototype,"footerLink",2),p([Nt({slot:"footer-button-primary"})],i.prototype,"footerButtonPrimary",2),p([Nt({slot:"footer-button-secondary"})],i.prototype,"footerButtonSecondary",2),i};var Bb=G`
   :host {
     --mdc-card-width: 20rem;
-    align-items: flex-start;
+    align-items: stretch;
     border-radius: 0.5rem;
     border: 1px solid var(--mds-color-theme-outline-primary-normal);
     box-shadow: none;