@momentum-design/components 0.129.22 → 0.129.23

package/dist/browser/index.js

@@ -4061,23 +4061,23 @@
       ${this.arrowPosition===yh.LEADING?_`<mdc-icon name="${o}" length-unit="rem" part="leading-arrow"></mdc-icon>`:j}
     `}};Xi.styles=[...gi.styles,...Hv],p([u({type:String,reflect:!0,attribute:"arrow-position"})],Xi.prototype,"arrowPosition",2),p([u({type:String,reflect:!0,attribute:"arrow-direction"})],Xi.prototype,"arrowDirection",2),p([u({type:String,reflect:!0})],Xi.prototype,"name",2),p([u({type:String,reflect:!0})],Xi.prototype,"value",2);var ur=Xi;ur.register(Za);var kx=ur;var Gv=z.constructTagName("statictoggle"),wx={DEFAULT:"default",COMPACT:"compact"},Eh={CHECKED:"check-bold",UNCHECKED:"cancel-bold"},Yv={compact:.75,default:1.25},Wv={SIZE:wx.DEFAULT};var Nx=[U`
     :host {
-      --mdc-toggle-width: 3rem;
-      --mdc-toggle-height: 1.5rem;
-      --mdc-toggle-border-radius: 0.75rem;
-      --mdc-toggle-border-color: var(--mds-color-theme-outline-input-normal);
-      --mdc-toggle-background-color: var(--mds-color-theme-control-inactive-normal);
-      --mdc-toggle-icon-color: var(--mds-color-theme-common-inverted-text-primary-normal);
-      --mdc-toggle-icon-background-color: var(--mds-color-theme-common-text-primary-normal);
+      --mdc-statictoggle-width: 3rem;
+      --mdc-statictoggle-height: 1.5rem;
+      --mdc-statictoggle-border-radius: 0.75rem;
+      --mdc-statictoggle-border-color: var(--mds-color-theme-outline-input-normal);
+      --mdc-statictoggle-background-color: var(--mds-color-theme-control-inactive-normal);
+      --mdc-statictoggle-icon-color: var(--mds-color-theme-common-inverted-text-primary-normal);
+      --mdc-statictoggle-icon-background-color: var(--mds-color-theme-common-text-primary-normal);
 
-      border-radius: var(--mdc-toggle-border-radius);
+      border-radius: var(--mdc-statictoggle-border-radius);
     }
 
     :host::part(slider) {
-      width: var(--mdc-toggle-width);
-      height: var(--mdc-toggle-height);
-      background-color: var(--mdc-toggle-background-color);
-      border: 1px solid var(--mdc-toggle-border-color);
-      border-radius: var(--mdc-toggle-border-radius);
+      width: var(--mdc-statictoggle-width);
+      height: var(--mdc-statictoggle-height);
+      background-color: var(--mdc-statictoggle-background-color);
+      border: 1px solid var(--mdc-statictoggle-border-color);
+      border-radius: var(--mdc-statictoggle-border-radius);
       display: flex;
       align-items: center;
       justify-content: flex-start;
@@ -4088,15 +4088,15 @@
 
     :host::part(toggle-icon) {
       padding: 0.25rem;
-      --mdc-icon-fill-color: var(--mdc-toggle-icon-color);
-      background-color: var(--mdc-toggle-icon-background-color);
+      --mdc-icon-fill-color: var(--mdc-statictoggle-icon-color);
+      background-color: var(--mdc-statictoggle-icon-background-color);
       border-radius: 50%;
     }
 
     :host([size='compact'])::part(slider) {
-      --mdc-toggle-width: 2rem;
-      --mdc-toggle-height: 1rem;
-      --mdc-toggle-border-radius: 0.5rem;
+      --mdc-statictoggle-width: 2rem;
+      --mdc-statictoggle-height: 1rem;
+      --mdc-statictoggle-border-radius: 0.5rem;
     }
 
     :host([size='compact'])::part(toggle-icon) {
@@ -4104,52 +4104,52 @@
     }
 
     :host([checked]) {
-      --mdc-toggle-border-color: transparent;
-      --mdc-toggle-background-color: var(--mds-color-theme-control-active-normal);
+      --mdc-statictoggle-border-color: transparent;
+      --mdc-statictoggle-background-color: var(--mds-color-theme-control-active-normal);
     }
     :host([checked])::part(slider) {
       justify-content: flex-end;
     }
 
     :host([readonly]) {
-      --mdc-toggle-icon-background-color: var(--mds-color-theme-common-text-primary-normal);
-      --mdc-toggle-border-color: var(--mds-color-theme-outline-primary-disabled);
-      --mdc-toggle-background-color: var(--mds-color-theme-control-inactive-disabled);
+      --mdc-statictoggle-icon-background-color: var(--mds-color-theme-common-text-primary-normal);
+      --mdc-statictoggle-border-color: var(--mds-color-theme-outline-primary-disabled);
+      --mdc-statictoggle-background-color: var(--mds-color-theme-control-inactive-disabled);
     }
 
     :host([disabled]),
     :host([soft-disabled]) {
-      --mdc-toggle-icon-color: var(--mds-color-theme-common-inverted-text-primary-disabled);
-      --mdc-toggle-icon-background-color: var(--mds-color-theme-common-text-primary-disabled);
-      --mdc-toggle-border-color: var(--mds-color-theme-outline-primary-disabled);
-      --mdc-toggle-background-color: var(--mds-color-theme-control-inactive-disabled);
+      --mdc-statictoggle-icon-color: var(--mds-color-theme-common-inverted-text-primary-disabled);
+      --mdc-statictoggle-icon-background-color: var(--mds-color-theme-common-text-primary-disabled);
+      --mdc-statictoggle-border-color: var(--mds-color-theme-outline-primary-disabled);
+      --mdc-statictoggle-background-color: var(--mds-color-theme-control-inactive-disabled);
       cursor: default;
     }
 
     :host([checked][disabled]),
     :host([checked][soft-disabled]) {
-      --mdc-toggle-icon-color: var(--mds-color-theme-common-inverted-text-primary-disabled);
-      --mdc-toggle-icon-background-color: var(--mds-color-theme-common-text-primary-disabled);
-      --mdc-toggle-border-color: transparent;
-      --mdc-toggle-background-color: var(--mds-color-theme-control-active-disabled);
+      --mdc-statictoggle-icon-color: var(--mds-color-theme-common-inverted-text-primary-disabled);
+      --mdc-statictoggle-icon-background-color: var(--mds-color-theme-common-text-primary-disabled);
+      --mdc-statictoggle-border-color: transparent;
+      --mdc-statictoggle-background-color: var(--mds-color-theme-control-active-disabled);
     }
 
     /* High Contrast Mode */
     @media (forced-colors: active) {
       :host::part(toggle-icon) {
-        --mdc-toggle-icon-color: CanvasText;
-        border: 1px solid var(--mdc-toggle-border-color);
+        --mdc-statictoggle-icon-color: CanvasText;
+        border: 1px solid var(--mdc-statictoggle-border-color);
       }
 
       :host([checked]) {
-        --mdc-toggle-icon-color: SelectedItemText;
-        --mdc-toggle-border-color: SelectedItem;
-        --mdc-toggle-background-color: SelectedItem;
+        --mdc-statictoggle-icon-color: SelectedItemText;
+        --mdc-statictoggle-border-color: SelectedItem;
+        --mdc-statictoggle-background-color: SelectedItem;
       }
 
       :host([disabled])::part(toggle-icon),
       :host([soft-disabled])::part(toggle-icon) {
-        --mdc-toggle-icon-color: GrayText;
+        --mdc-statictoggle-icon-color: GrayText;
         border: 1px solid GrayText;
       }
     }
@@ -6378,6 +6378,12 @@
       </div>
       ${this.renderFooter()}
     `}};Oe.styles=[...q.styles,...Jg],p([u({type:String,reflect:!0})],Oe.prototype,"variant",2),p([u({type:String,attribute:"close-button-aria-label"})],Oe.prototype,"closeButtonAriaLabel",2),p([u({type:String,reflect:!0,attribute:"header-text"})],Oe.prototype,"headerText",2),p([u({type:String,reflect:!0,attribute:"header-tag-name"})],Oe.prototype,"headerTagName",2),p([u({type:String,reflect:!0,attribute:"aria-label"})],Oe.prototype,"ariaLabel",2),p([u({type:String,reflect:!0,attribute:"show-more-text"})],Oe.prototype,"showMoreText",2),p([u({type:String,reflect:!0,attribute:"show-less-text"})],Oe.prototype,"showLessText",2),p([ut()],Oe.prototype,"isDetailVisible",2),p([ut()],Oe.prototype,"hasDetailedSlot",2),p([Pt({slot:"toast-body-detailed",flatten:!0})],Oe.prototype,"detailedElements",2),p([ut()],Oe.prototype,"hasFooterButtons",2);var hp=Oe;hp.register(Zg);var FA=hp;var $A=[yt,U`
+    :host {
+      --mdc-label-font-size: var(--mds-font-apps-body-midsize-regular-font-size);
+      --mdc-label-font-weight: var(--mds-font-apps-body-midsize-regular-font-weight);
+      --mdc-label-line-height: var(--mds-font-apps-body-midsize-regular-line-height);
+    }
+
     /* Grid layout for labeled toggles */
     :host([label]),
     :host([help-text]) {
@@ -6406,16 +6412,13 @@
       opacity: 0.1%;
       overflow: visible;
       z-index: 1;
-      width: var(--mdc-toggle-width);
-      height: var(--mdc-toggle-height);
+      width: var(--mdc-statictoggle-width);
+      height: var(--mdc-statictoggle-height);
     }
 
     :host::part(label) {
       word-break: break-word;
       white-space: normal;
-      --mdc-label-font-size: var(--mds-font-apps-body-midsize-regular-font-size);
-      --mdc-label-font-weight: var(--mds-font-apps-body-midsize-regular-font-weight);
-      --mdc-label-line-height: var(--mds-font-apps-body-midsize-regular-line-height);
     }
 
     /* Default interactive states */
@@ -6425,19 +6428,19 @@
     }
 
     :host(:hover)::part(static-toggle) {
-      --mdc-toggle-background-color: var(--mds-color-theme-control-inactive-hover);
+      --mdc-statictoggle-background-color: var(--mds-color-theme-control-inactive-hover);
     }
 
     :host(:active)::part(static-toggle) {
-      --mdc-toggle-background-color: var(--mds-color-theme-control-inactive-pressed);
+      --mdc-statictoggle-background-color: var(--mds-color-theme-control-inactive-pressed);
     }
 
     :host([checked]:hover)::part(static-toggle) {
-      --mdc-toggle-background-color: var(--mds-color-theme-control-active-hover);
+      --mdc-statictoggle-background-color: var(--mds-color-theme-control-active-hover);
     }
 
     :host([checked]:active)::part(static-toggle) {
-      --mdc-toggle-background-color: var(--mds-color-theme-control-active-pressed);
+      --mdc-statictoggle-background-color: var(--mds-color-theme-control-active-pressed);
     }
 
     /* Readonly state - disables pointer events */