@maggioli-design-system/magma 2.0.0-beta.1 → 2.0.0-beta.3

package/dist/cjs/mds-price-table-features-row.cjs.entry.js

@@ -1,13 +1,35 @@
 'use strict';
 
 var index = require('./index-CNuKb6Lv.js');
+var preference = require('./preference-BdpIXWLP.js');
 
-const mdsPriceTableFeaturesRowCss = () => `@layer reset,vendor,theme,base,components,utilities;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--mds-price-table-features-row-background:transparent;--mds-price-table-features-row-background-hover:rgb(var(--tone-neutral-10,60 60 60));--mds-price-table-features-row-color:rgb(var(--tone-neutral-04,218 218 218));--mds-price-table-features-row-color-hover:rgb(var(--tone-neutral-01,255 255 255));--tw-duration:initial;--tw-ease:initial}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),mds-price-table-features-cell:not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}@property --mds-price-table-features-row-background{syntax:"<color>";inherits:false;initial-value:#0000}:host{--mds-price-table-features-row-background:transparent;--mds-price-table-features-row-background-hover:rgb(var(--tone-neutral-10,60 60 60));--mds-price-table-features-row-color:rgb(var(--tone-neutral-04,218 218 218));--mds-price-table-features-row-color-hover:rgb(var(--tone-neutral-01,255 255 255));--tw-duration:.2s;--tw-ease:var(--ease-in-out,cubic-bezier(.4,0,.2,1));background-color:var(--mds-price-table-features-row-background,transparent);color:var(--mds-price-table-features-row-color,rgb(var(--tone-neutral-04,218 218 218)));display:table-row;transition-duration:.2s;transition-property:background-color,color;transition-timing-function:var(--ease-in-out,cubic-bezier(.4,0,.2,1))}:host-context(:not(.safari)):host(:hover){--mds-price-table-features-row-background:var(--mds-price-table-features-row-background-hover,rgb(var(--tone-neutral-10,60 60 60)));--mds-price-table-features-row-color:var(--mds-price-table-features-row-color-hover,rgb(var(--tone-neutral-01,255 255 255)))}:host-context(:not(.safari)):host(:hover)>::slotted(mds-price-table-features-cell){--mds-price-table-features-cell-icon-supported-color:var(--mds-price-table-features-cell-icon-supported-color-hover,rgb(var(--label-green-06,30 171 82)));--mds-price-table-features-cell-icon-unsupported-color:var(--mds-price-table-features-cell-icon-unsupported-color-hover,rgb(var(--tone-neutral-06,158 158 158)))}:host>::slotted([type=label]){padding-left:0}:host-context(:not(.safari)):host(:hover)>::slotted([type=label]){-webkit-transform:translate(calc(var(--spacing,.0025rem)*200));transform:translate(calc(var(--spacing,.0025rem)*200))}:host-context(:root.pref-animation-reduce){transition-duration:0s}:host-context(:root.pref-contrast-more){--mds-price-table-features-row-color:rgb(var(--tone-neutral-01,255 255 255));--mds-price-table-features-row-color-hover:rgb(var(--tone-neutral-01,255 255 255))}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){--mds-price-table-features-row-background-hover:rgb(var(--tone-neutral-09,76 76 76))}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@media (prefers-reduced-motion){:is(:host-context(:root.pref-animation-system),:host-context(:root:not([data-magma-pref]))){transition-duration:0s}}@media (prefers-contrast:more){:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))){--mds-price-table-features-row-color:rgb(var(--tone-neutral-01,255 255 255));--mds-price-table-features-row-color-hover:rgb(var(--tone-neutral-01,255 255 255))}}@media (prefers-color-scheme:dark){:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))){--mds-price-table-features-row-background-hover:rgb(var(--tone-neutral-09,76 76 76))}}`;
+const mdsPriceTableFeaturesRowCss = () => `@layer reset,vendor,theme,base,components,utilities;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--mds-price-table-features-row-background:#0000;--mds-price-table-features-row-background-hover:rgb(var(--tone-neutral-10,60 60 60));--mds-price-table-features-row-color:rgb(var(--tone-neutral-04,218 218 218));--mds-price-table-features-row-color-hover:rgb(var(--tone-neutral-01,255 255 255));--tw-ease:initial}}}:host(:not(:is([hydrated],.hydrated))),mds-price-table-features-cell:not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}@property --mds-price-table-features-row-background{syntax:"<color>";inherits:false;initial-value:#0000}:host{--mds-price-table-features-row-background:#0000;--mds-price-table-features-row-background-hover:rgb(var(--tone-neutral-10,60 60 60));--mds-price-table-features-row-color:rgb(var(--tone-neutral-04,218 218 218));--mds-price-table-features-row-color-hover:rgb(var(--tone-neutral-01,255 255 255));--mds-price-table-features-row-transition-duration:var(--duration-200,.2s);--private-price-table-features-row-transition-duration:var(--mds-price-table-features-row-transition-duration);--tw-ease:var(--ease-in-out,cubic-bezier(.4,0,.2,1));background-color:var(--mds-price-table-features-row-background,#0000);color:var(--mds-price-table-features-row-color,rgb(var(--tone-neutral-04,218 218 218)));display:table-row;-webkit-transition-duration:var(--private-price-table-features-row-transition-duration);transition-duration:var(--private-price-table-features-row-transition-duration);transition-property:background-color,color;transition-timing-function:var(--ease-in-out,cubic-bezier(.4,0,.2,1))}:host(:hover){--mds-price-table-features-row-background:var(--mds-price-table-features-row-background-hover,rgb(var(--tone-neutral-10,60 60 60)));--mds-price-table-features-row-color:var(--mds-price-table-features-row-color-hover,rgb(var(--tone-neutral-01,255 255 255)))}:host(:hover)>::slotted(mds-price-table-features-cell){--mds-price-table-features-cell-icon-supported-color:var(--mds-price-table-features-cell-icon-supported-color-hover,rgb(var(--label-green-06,30 171 82)));--mds-price-table-features-cell-icon-unsupported-color:var(--mds-price-table-features-cell-icon-unsupported-color-hover,rgb(var(--tone-neutral-06,158 158 158)))}:host>::slotted([type=label]){padding-left:0}:host(:hover)>::slotted([type=label]){-webkit-transform:translate(calc(var(--spacing,.0025rem)*200));transform:translate(calc(var(--spacing,.0025rem)*200))}:host([pref-animation=reduce]){--private-price-table-features-row-transition-duration:0s}:host([pref-contrast=more]){--mds-price-table-features-row-color:rgb(var(--tone-neutral-01,255 255 255));--mds-price-table-features-row-color-hover:rgb(var(--tone-neutral-01,255 255 255))}:host([pref-theme=dark]:not([pref-theme-scheme=light])){--mds-price-table-features-row-background-hover:rgb(var(--tone-neutral-09,76 76 76))}@property --tw-ease{syntax:"*";inherits:false}@media (prefers-reduced-motion:reduce){:host(:not([pref-animation])),:host([pref-animation=system]){--private-price-table-features-row-transition-duration:0s}}@media (prefers-contrast:more){:host(:not([pref-contrast])),:host([pref-contrast=system]){--mds-price-table-features-row-color:rgb(var(--tone-neutral-01,255 255 255));--mds-price-table-features-row-color-hover:rgb(var(--tone-neutral-01,255 255 255))}}@media (prefers-color-scheme:dark){:host(:not([pref-theme])),:host([pref-theme=system]:not([pref-theme-scheme=light])){--mds-price-table-features-row-background-hover:rgb(var(--tone-neutral-09,76 76 76))}}`;
 
 const MdsPriceTableFeaturesRow = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
     }
+    connectedCallback() {
+        this.unsubscribePrefAnimation = preference.subscribePreference('animation', (value) => {
+            this.prefAnimation = value;
+        });
+        this.unsubscribePrefContrast = preference.subscribePreference('contrast', (value) => {
+            this.prefContrast = value;
+        });
+        this.unsubscribePrefTheme = preference.subscribePreference('theme', (value) => {
+            this.prefTheme = value;
+        });
+        this.unsubscribePrefThemeScheme = preference.subscribePreference('theme-scheme', (value) => {
+            this.prefThemeScheme = value;
+        });
+    }
+    disconnectedCallback() {
+        var _a, _b, _c, _d;
+        (_a = this.unsubscribePrefAnimation) === null || _a === void 0 ? void 0 : _a.call(this);
+        (_b = this.unsubscribePrefContrast) === null || _b === void 0 ? void 0 : _b.call(this);
+        (_c = this.unsubscribePrefTheme) === null || _c === void 0 ? void 0 : _c.call(this);
+        (_d = this.unsubscribePrefThemeScheme) === null || _d === void 0 ? void 0 : _d.call(this);
+    }
     componentWillRender() {
         this.horizontalCells = this.host.querySelectorAll('mds-price-table-features-cell');
         this.cellPercWidth = Number(100 / this.horizontalCells.length).toFixed(4) + '%';
@@ -16,7 +38,7 @@ const MdsPriceTableFeaturesRow = class {
         });
     }
     render() {
-        return (index.h(index.Host, { key: '81ade11b3ab36047fe6ea3abd16b8766f1660b87' }, index.h("slot", { key: '570984b400f99165ee9f3f40ffd93ad19b437dd9' })));
+        return (index.h(index.Host, { key: 'aa643a67f90377589c46362cad147ea0133bc36a', "pref-animation": this.prefAnimation, "pref-contrast": this.prefContrast, "pref-theme": this.prefTheme, "pref-theme-scheme": this.prefThemeScheme }, index.h("slot", { key: '8aa2a7633dc5196acd823229e3ba1b6cb1103345' })));
     }
     get host() { return index.getElement(this); }
 };

package/dist/cjs/mds-price-table-features.cjs.entry.js

@@ -1,15 +1,37 @@
 'use strict';
 
 var index = require('./index-CNuKb6Lv.js');
+var preference = require('./preference-BdpIXWLP.js');
 
-const mdsPriceTableFeaturesCss = () => `@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--mds-price-table-features-border-color:rgb(var(--tone-neutral-06,158 158 158));--mds-price-table-features-padding:calc(var(--spacing,.0025rem)*300);--tw-duration:initial;--tw-ease:initial}}}@layer reset,vendor,theme,base,components,utilities;:host{--mds-price-table-features-border-color:rgb(var(--tone-neutral-06,158 158 158));--mds-price-table-features-padding:calc(var(--spacing,.0025rem)*300);--tw-duration:.2s;--tw-ease:var(--ease-in-out,cubic-bezier(.4,0,.2,1));display:flex;transition-duration:.2s;transition-property:border-color;transition-timing-function:var(--ease-in-out,cubic-bezier(.4,0,.2,1));width:100%}.table-wrapper{scroll-margin-inline:calc(var(--spacing,.0025rem)*600);width:100%}table{border-collapse:collapse;min-width:100%;table-layout:fixed}header{border-bottom:1px solid var(--mds-price-table-features-border-color,rgb(var(--tone-neutral-06,158 158 158)));padding:var(--mds-price-table-features-padding,calc(var(--spacing,.0025rem)*300)) var(--mds-price-table-features-padding,calc(var(--spacing,.0025rem)*300)) var(--mds-price-table-features-padding,calc(var(--spacing,.0025rem)*300)) 0}:host-context(:root.pref-animation-reduce){transition-duration:0s}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){--mds-price-table-features-border-color:rgb(var(--tone-neutral-05,197 197 197))}:host-context(:root.pref-contrast-more){--mds-price-table-features-border-color:rgb(var(--tone-neutral-03,233 233 233))}:host(:not(:is([hydrated],.hydrated))),mds-text:not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@media (prefers-reduced-motion){:is(:host-context(:root.pref-animation-system),:host-context(:root:not([data-magma-pref]))){transition-duration:0s}}@media (prefers-color-scheme:dark){:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))){--mds-price-table-features-border-color:rgb(var(--tone-neutral-05,197 197 197))}}@media (prefers-contrast:more){:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))){--mds-price-table-features-border-color:rgb(var(--tone-neutral-03,233 233 233))}}`;
+const mdsPriceTableFeaturesCss = () => `@layer reset,vendor,theme,base,components,utilities;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--mds-price-table-features-border-color:rgb(var(--tone-neutral-06,158 158 158));--mds-price-table-features-padding:calc(var(--spacing,.0025rem)*300);--tw-ease:initial}}}:host{--mds-price-table-features-border-color:rgb(var(--tone-neutral-06,158 158 158));--mds-price-table-features-padding:calc(var(--spacing,.0025rem)*300);--mds-price-table-features-transition-duration:var(--duration-200,.2s);--private-price-table-features-transition-duration:var(--mds-price-table-features-transition-duration);--tw-ease:var(--ease-in-out,cubic-bezier(.4,0,.2,1));display:flex;-webkit-transition-duration:var(--private-price-table-features-transition-duration);transition-duration:var(--private-price-table-features-transition-duration);transition-property:border-color;transition-timing-function:var(--ease-in-out,cubic-bezier(.4,0,.2,1));width:100%}.table-wrapper{scroll-margin-inline:calc(var(--spacing,.0025rem)*600);width:100%}table{border-collapse:collapse;min-width:100%;table-layout:fixed}header{border-bottom:1px solid var(--mds-price-table-features-border-color,rgb(var(--tone-neutral-06,158 158 158)));padding:var(--mds-price-table-features-padding,calc(var(--spacing,.0025rem)*300)) var(--mds-price-table-features-padding,calc(var(--spacing,.0025rem)*300)) var(--mds-price-table-features-padding,calc(var(--spacing,.0025rem)*300)) 0}:host([pref-animation=reduce]){--private-price-table-features-transition-duration:0s}:host([pref-theme=dark]:not([pref-theme-scheme=light])){--mds-price-table-features-border-color:rgb(var(--tone-neutral-05,197 197 197))}:host([pref-contrast=more]){--mds-price-table-features-border-color:rgb(var(--tone-neutral-03,233 233 233))}:host(:not(:is([hydrated],.hydrated))),mds-text:not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}@property --tw-ease{syntax:"*";inherits:false}@media (prefers-reduced-motion:reduce){:host(:not([pref-animation])),:host([pref-animation=system]){--private-price-table-features-transition-duration:0s}}@media (prefers-color-scheme:dark){:host(:not([pref-theme])),:host([pref-theme=system]:not([pref-theme-scheme=light])){--mds-price-table-features-border-color:rgb(var(--tone-neutral-05,197 197 197))}}@media (prefers-contrast:more){:host(:not([pref-contrast])),:host([pref-contrast=system]){--mds-price-table-features-border-color:rgb(var(--tone-neutral-03,233 233 233))}}`;
 
 const MdsPriceTableFeatures = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
     }
+    connectedCallback() {
+        this.unsubscribePrefAnimation = preference.subscribePreference('animation', (value) => {
+            this.prefAnimation = value;
+        });
+        this.unsubscribePrefContrast = preference.subscribePreference('contrast', (value) => {
+            this.prefContrast = value;
+        });
+        this.unsubscribePrefTheme = preference.subscribePreference('theme', (value) => {
+            this.prefTheme = value;
+        });
+        this.unsubscribePrefThemeScheme = preference.subscribePreference('theme-scheme', (value) => {
+            this.prefThemeScheme = value;
+        });
+    }
+    disconnectedCallback() {
+        var _a, _b, _c, _d;
+        (_a = this.unsubscribePrefAnimation) === null || _a === void 0 ? void 0 : _a.call(this);
+        (_b = this.unsubscribePrefContrast) === null || _b === void 0 ? void 0 : _b.call(this);
+        (_c = this.unsubscribePrefTheme) === null || _c === void 0 ? void 0 : _c.call(this);
+        (_d = this.unsubscribePrefThemeScheme) === null || _d === void 0 ? void 0 : _d.call(this);
+    }
     render() {
-        return (index.h(index.Host, { key: 'c1c9c47c868a3811604fa8a2a163b2093f146e03' }, index.h("div", { key: 'a308014a1778ff72e0e3e552bff15c0f1d18c15d', class: "table-wrapper" }, this.label && (index.h("header", { key: '421aecece294adb7d717a8f5b5b55bc7cb39e801', part: "header" }, index.h("mds-text", { key: '4506989506031cc040e201e2aa1ee1f2b217b53c', typography: "detail" }, index.h("b", { key: 'f065ba3c8c054f385ee8fef05dcff1b4bdf65ade' }, this.label)))), index.h("table", { key: '97bb2c61f606d69a815f29a5d6c994cc19ae4e84' }, index.h("tbody", { key: 'c70053b39c21e3ad4f9558d0fe031c111ce5b9cd' }, index.h("slot", { key: 'c854ebd92ead2d68d63b4838f8826cadf3338211' }))))));
+        return (index.h(index.Host, { key: '8e62f7d1059d8019a154f056af2ab80f01180948', "pref-animation": this.prefAnimation, "pref-contrast": this.prefContrast, "pref-theme": this.prefTheme, "pref-theme-scheme": this.prefThemeScheme }, index.h("div", { key: 'f5549dee3de6907b99053dede90e44d1ede4e716', class: "table-wrapper" }, this.label && (index.h("header", { key: 'de99381048be9911fa2ae6c0f6b653b9798dd294', part: "header" }, index.h("mds-text", { key: 'd858f7e01d9f8703ac074a7975095a0c2663e5ef', typography: "detail" }, index.h("b", { key: '34030d403e10d06b1f4426e239844fcdd8e62266' }, this.label)))), index.h("table", { key: '21984eaac54df90380f4ea1ffd4e7ceb3b4fc5bc' }, index.h("tbody", { key: 'b79a8e3d5e54d4627909e1136dcfe83147419316' }, index.h("slot", { key: 'a6f87f4b2e3ad4a8b19a9cdd7f56c5b9f9e3ba14' }))))));
     }
 };
 MdsPriceTableFeatures.style = mdsPriceTableFeaturesCss();

package/dist/cjs/mds-price-table-header.cjs.entry.js

@@ -2,14 +2,14 @@
 
 var index = require('./index-CNuKb6Lv.js');
 
-const mdsPriceTableHeaderCss = () => `@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),mds-price-table-list:not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}:host{display:grid;gap:calc(var(--spacing,.0025rem)*600);grid-template-columns:repeat(auto-fit,minmax(1px,1fr))}`;
+const mdsPriceTableHeaderCss = () => `@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),mds-price-table-list:not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}:host{display:grid;gap:calc(var(--spacing,.0025rem)*600);grid-template-columns:repeat(auto-fit,minmax(1px,1fr))}`;
 
 const MdsPriceTableHeader = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: '42fabeb365252635792adb6b5f28ba16f6ebe9e3' }, index.h("slot", { key: '1f2726a1e4df0605cb2e5d635f37193834408d47' })));
+        return (index.h(index.Host, { key: '0d876dc90072b896419158ba31b1f52e935b4aa6' }, index.h("slot", { key: 'db1c232ed329a09b1c1365d8d4aa2cd1c4352382' })));
     }
 };
 MdsPriceTableHeader.style = mdsPriceTableHeaderCss();

package/dist/cjs/mds-price-table-list-item.cjs.entry.js

@@ -4,7 +4,7 @@ var index = require('./index-CNuKb6Lv.js');
 var checkCircle = require('./check-circle-Dot_k9WN.js');
 var horizontalRule = require('./horizontal-rule-BnDv-kBK.js');
 
-const mdsPriceTableListItemCss = () => `@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--mds-price-table-list-item-supported-icon-color-hover:rgb(var(--label-green-05,37 213 102));--mds-price-table-list-item-supported-icon-color:rgb(var(--label-green-06,30 171 82));--mds-price-table-list-item-unsupported-icon-color-hover:rgb(var(--tone-neutral-04,218 218 218));--mds-price-table-list-item-unsupported-icon-color:rgb(var(--tone-neutral-05,197 197 197));--tw-ease:initial}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),mds-text:not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}:host{--mds-price-table-list-item-supported-icon-color-hover:rgb(var(--label-green-05,37 213 102));--mds-price-table-list-item-supported-icon-color:rgb(var(--label-green-06,30 171 82));--mds-price-table-list-item-unsupported-icon-color-hover:rgb(var(--tone-neutral-04,218 218 218));--mds-price-table-list-item-unsupported-icon-color:rgb(var(--tone-neutral-05,197 197 197));align-items:flex-start;display:flex;gap:calc(var(--spacing,.0025rem)*100)}.text{flex-grow:1}.icon-container{flex-shrink:0}.icon{display:flex;height:calc(var(--spacing,.0025rem)*600);width:calc(var(--spacing,.0025rem)*600);--tw-ease:var(--ease-out-expo,cubic-bezier(.19,1,.22,1));fill:var(--mds-price-table-list-item-unsupported-icon-color,rgb(var(--tone-neutral-05,197 197 197)));-webkit-transition-duration:var(--duration-500,.5s);transition-duration:var(--duration-500,.5s);transition-property:fill;transition-timing-function:var(--ease-out-expo,cubic-bezier(.19,1,.22,1))}.icon svg{aspect-ratio:var(--aspect-square,1/1);height:100%;width:100%}:host([supported]:not([supported=false])) .icon{fill:var(--mds-price-table-list-item-supported-icon-color,rgb(var(--label-green-06,30 171 82)))}@property --tw-ease{syntax:"*";inherits:false}`;
+const mdsPriceTableListItemCss = () => `@layer reset,vendor,theme,base,components,utilities;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--mds-price-table-list-item-supported-icon-color-hover:rgb(var(--label-green-05,37 213 102));--mds-price-table-list-item-supported-icon-color:rgb(var(--label-green-06,30 171 82));--mds-price-table-list-item-unsupported-icon-color-hover:rgb(var(--tone-neutral-04,218 218 218));--mds-price-table-list-item-unsupported-icon-color:rgb(var(--tone-neutral-05,197 197 197));--tw-ease:initial}}}:host(:not(:is([hydrated],.hydrated))),mds-text:not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}:host{--mds-price-table-list-item-supported-icon-color-hover:rgb(var(--label-green-05,37 213 102));--mds-price-table-list-item-supported-icon-color:rgb(var(--label-green-06,30 171 82));--mds-price-table-list-item-unsupported-icon-color-hover:rgb(var(--tone-neutral-04,218 218 218));--mds-price-table-list-item-unsupported-icon-color:rgb(var(--tone-neutral-05,197 197 197));align-items:flex-start;display:flex;gap:calc(var(--spacing,.0025rem)*100)}.text{flex-grow:1}.icon-container{flex-shrink:0}.icon{display:flex;--tw-ease:var(--ease-out-expo,cubic-bezier(.19,1,.22,1));fill:var(--mds-price-table-list-item-unsupported-icon-color,rgb(var(--tone-neutral-05,197 197 197)));height:calc(var(--spacing,.0025rem)*600);-webkit-transition-duration:var(--duration-500,.5s);transition-duration:var(--duration-500,.5s);transition-property:fill;transition-timing-function:var(--ease-out-expo,cubic-bezier(.19,1,.22,1));width:calc(var(--spacing,.0025rem)*600)}.icon svg{aspect-ratio:var(--aspect-square,1/1);height:100%;width:100%}:host([supported]:not([supported=false])) .icon{fill:var(--mds-price-table-list-item-supported-icon-color,rgb(var(--label-green-06,30 171 82)))}@property --tw-ease{syntax:"*";inherits:false}`;
 
 const MdsPriceTableListItem = class {
     constructor(hostRef) {
@@ -19,7 +19,7 @@ const MdsPriceTableListItem = class {
         this.typography = 'detail';
     }
     render() {
-        return (index.h(index.Host, { key: '90b909850952b68e79aecf6222ca9eb2e0d32a3f', slot: "item" }, index.h("mds-text", { key: '16c8618310b452ac9f478036605655139eec1513', class: "icon-container", typography: this.typography }, this.supported ? (index.h("i", { class: "icon", innerHTML: checkCircle.miBaselineCheckCircle, part: "icon" })) : (index.h("i", { class: "icon", innerHTML: horizontalRule.miBaselineHorizontalRule, part: "icon" }))), index.h("mds-text", { key: '5cc3f23b819caebb5b5c25401da75dbc9b023659', class: "text", typography: this.typography }, index.h("slot", { key: 'd824314eb2e3e056b2924a159ffa85152ebbf9e4' }))));
+        return (index.h(index.Host, { key: '9a74af393bc74c765497cf213e572a4bb1f85bc3', slot: "item" }, index.h("mds-text", { key: 'f96de44e9d6c686f51f13cb461e0bacaef9f4077', class: "icon-container", typography: this.typography }, this.supported ? (index.h("i", { class: "icon", innerHTML: checkCircle.miBaselineCheckCircle, part: "icon" })) : (index.h("i", { class: "icon", innerHTML: horizontalRule.miBaselineHorizontalRule, part: "icon" }))), index.h("mds-text", { key: 'd232620f35303d3b4200cd89f7028b9a6073d69f', class: "text", typography: this.typography }, index.h("slot", { key: 'b9b38a813b5f7666040552b480c4081b1823a47b' }))));
     }
 };
 MdsPriceTableListItem.style = mdsPriceTableListItemCss();

package/dist/cjs/mds-price-table-list.cjs.entry.js

@@ -1,19 +1,41 @@
 'use strict';
 
 var index = require('./index-CNuKb6Lv.js');
+var preference = require('./preference-BdpIXWLP.js');
 
-const mdsPriceTableListCss = () => `@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--mds-price-table-list-separator-color:rgb(var(--tone-neutral-03,233 233 233)/.5);--tw-duration:initial;--tw-ease:initial}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),mds-separator:not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}:host{--mds-price-table-list-separator-color:rgb(var(--tone-neutral-03,233 233 233)/.5);border-radius:var(--radius-xl,20px);gap:calc(var(--spacing,.0025rem)*600);padding:calc(var(--spacing,.0025rem)*600);--tw-duration:.2s;--tw-ease:var(--ease-in-out,cubic-bezier(.4,0,.2,1));background-color:rgb(var(--label-green-10,12 68 33));display:grid;transition-duration:.2s;transition-property:background-color,color;transition-timing-function:var(--ease-in-out,cubic-bezier(.4,0,.2,1))}.separator{--tw-duration:.2s;--tw-ease:var(--ease-in-out,cubic-bezier(.4,0,.2,1));background-color:var(--mds-price-table-list-separator-color,rgb(var(--tone-neutral-03,233 233 233)/.5));transition-duration:.2s;transition-property:background-color;transition-timing-function:var(--ease-in-out,cubic-bezier(.4,0,.2,1))}.header,.main{display:grid}.main{gap:calc(var(--spacing,.0025rem)*300)}.footer{display:grid;gap:calc(var(--spacing,.0025rem)*400)}:host-context(:root.pref-animation-reduce){transition-duration:0s}:host-context(:root.pref-animation-reduce) .separator{transition-duration:0s}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){--mds-price-table-list-separator-color:rgb(var(--tone-neutral-01,255 255 255)/.5);background-color:rgb(var(--label-green-09,14 81 39));-webkit-box-shadow:var(--shadow-outline);box-shadow:var(--shadow-outline)}:host-context(:root.pref-contrast-more){--mds-price-table-list-separator-color:rgb(var(--tone-neutral-01,255 255 255)/.5);-webkit-box-shadow:var(--shadow-outline-50) inset;box-shadow:var(--shadow-outline-50) inset;color:rgb(var(--tone-neutral-01,255 255 255))}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@media (prefers-reduced-motion){:is(:host-context(:root.pref-animation-system),:host-context(:root:not([data-magma-pref]))),:is(:host-context(:root.pref-animation-system),:host-context(:root:not([data-magma-pref]))) .separator{transition-duration:0s}}@media (prefers-color-scheme:dark){:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))){--mds-price-table-list-separator-color:rgb(var(--tone-neutral-01,255 255 255)/.5);background-color:rgb(var(--label-green-09,14 81 39));-webkit-box-shadow:var(--shadow-outline);box-shadow:var(--shadow-outline)}}@media (prefers-contrast:more){:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))){--mds-price-table-list-separator-color:rgb(var(--tone-neutral-01,255 255 255)/.5);-webkit-box-shadow:var(--shadow-outline-50) inset;box-shadow:var(--shadow-outline-50) inset;color:rgb(var(--tone-neutral-01,255 255 255))}}`;
+const mdsPriceTableListCss = () => `@layer reset,vendor,theme,base,components,utilities;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--mds-price-table-list-separator-color:rgb(var(--tone-neutral-03,233 233 233)/.5);--tw-ease:initial}}}:host(:not(:is([hydrated],.hydrated))),mds-separator:not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}:host{--mds-price-table-list-separator-color:rgb(var(--tone-neutral-03,233 233 233)/.5);--mds-price-table-list-transition-duration:var(--duration-200,.2s);--private-price-table-list-transition-duration:var(--mds-price-table-list-transition-duration);--tw-ease:var(--ease-in-out,cubic-bezier(.4,0,.2,1));background-color:rgb(var(--label-green-10,12 68 33));border-radius:var(--radius-xl,20px);display:grid;gap:calc(var(--spacing,.0025rem)*600);padding:calc(var(--spacing,.0025rem)*600);-webkit-transition-duration:var(--private-price-table-list-transition-duration);transition-duration:var(--private-price-table-list-transition-duration);transition-property:background-color,color;transition-timing-function:var(--ease-in-out,cubic-bezier(.4,0,.2,1))}.separator{--tw-ease:var(--ease-in-out,cubic-bezier(.4,0,.2,1));background-color:var(--mds-price-table-list-separator-color,rgb(var(--tone-neutral-03,233 233 233)/.5));-webkit-transition-duration:var(--private-price-table-list-transition-duration);transition-duration:var(--private-price-table-list-transition-duration);transition-property:background-color;transition-timing-function:var(--ease-in-out,cubic-bezier(.4,0,.2,1))}.header,.main{display:grid}.main{gap:calc(var(--spacing,.0025rem)*300)}.footer{display:grid;gap:calc(var(--spacing,.0025rem)*400)}:host([pref-animation=reduce]){--private-price-table-list-transition-duration:0s}:host([pref-theme=dark]:not([pref-theme-scheme=light])){--mds-price-table-list-separator-color:rgb(var(--tone-neutral-01,255 255 255)/.5);background-color:rgb(var(--label-green-09,14 81 39));-webkit-box-shadow:var(--shadow-outline);box-shadow:var(--shadow-outline)}:host([pref-contrast=more]){--mds-price-table-list-separator-color:rgb(var(--tone-neutral-01,255 255 255)/.5);-webkit-box-shadow:var(--shadow-outline-50) inset;box-shadow:var(--shadow-outline-50) inset;color:rgb(var(--tone-neutral-01,255 255 255))}@property --tw-ease{syntax:"*";inherits:false}@media (prefers-reduced-motion:reduce){:host(:not([pref-animation])),:host([pref-animation=system]){--private-price-table-list-transition-duration:0s}}@media (prefers-color-scheme:dark){:host(:not([pref-theme])),:host([pref-theme=system]:not([pref-theme-scheme=light])){--mds-price-table-list-separator-color:rgb(var(--tone-neutral-01,255 255 255)/.5);background-color:rgb(var(--label-green-09,14 81 39));-webkit-box-shadow:var(--shadow-outline);box-shadow:var(--shadow-outline)}}@media (prefers-contrast:more){:host(:not([pref-contrast])),:host([pref-contrast=system]){--mds-price-table-list-separator-color:rgb(var(--tone-neutral-01,255 255 255)/.5);-webkit-box-shadow:var(--shadow-outline-50) inset;box-shadow:var(--shadow-outline-50) inset;color:rgb(var(--tone-neutral-01,255 255 255))}}`;
 
 const MdsPriceTableList = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
     }
+    connectedCallback() {
+        this.unsubscribePrefAnimation = preference.subscribePreference('animation', (value) => {
+            this.prefAnimation = value;
+        });
+        this.unsubscribePrefContrast = preference.subscribePreference('contrast', (value) => {
+            this.prefContrast = value;
+        });
+        this.unsubscribePrefTheme = preference.subscribePreference('theme', (value) => {
+            this.prefTheme = value;
+        });
+        this.unsubscribePrefThemeScheme = preference.subscribePreference('theme-scheme', (value) => {
+            this.prefThemeScheme = value;
+        });
+    }
+    disconnectedCallback() {
+        var _a, _b, _c, _d;
+        (_a = this.unsubscribePrefAnimation) === null || _a === void 0 ? void 0 : _a.call(this);
+        (_b = this.unsubscribePrefContrast) === null || _b === void 0 ? void 0 : _b.call(this);
+        (_c = this.unsubscribePrefTheme) === null || _c === void 0 ? void 0 : _c.call(this);
+        (_d = this.unsubscribePrefThemeScheme) === null || _d === void 0 ? void 0 : _d.call(this);
+    }
     componentWillLoad() {
         this.hasItems =
             this.hostElement.querySelectorAll('[slot="item"], mds-price-table-list-item').length > 0;
     }
     render() {
-        return (index.h(index.Host, { key: '9839e2822db4193a8deb66c594a425786a535d1f' }, index.h("div", { key: '58507843f8e7eae61e26eafaeb99f01c77480ed1', class: "header", part: "header" }, index.h("slot", { key: '5f7541028888ada10f64725d1ecf0ebb5e4d9832', name: "header" })), this.hasItems && index.h("mds-separator", { key: '566ca8c9ba02b76f47f3bfcaa0100449b07e6146', class: "separator" }), this.hasItems && (index.h("main", { key: '0f03d7c886ce609ee8efa658408ba2c53e38015b', class: "main", part: "content" }, index.h("slot", { key: '1044b8d53d3234bcd10dd9cd912c4574c0d3436a', name: "item" }))), index.h("div", { key: '4f5ace1034982ee7f4d8942819a987439ba36509', class: "footer", part: "footer" }, index.h("slot", { key: 'a8f206d356219f57376bd341c7447497a6e88c52', name: "price" }), index.h("slot", { key: 'c9ed7291e71ee29a1c0a7542fb79065934523ec0', name: "action" }))));
+        return (index.h(index.Host, { key: 'e7dea8205b847700337422933069730885cebcfe', "pref-animation": this.prefAnimation, "pref-contrast": this.prefContrast, "pref-theme": this.prefTheme, "pref-theme-scheme": this.prefThemeScheme }, index.h("div", { key: '8652686305e3eec80ffc95c86d6fae8472d3bdf0', class: "header", part: "header" }, index.h("slot", { key: '05dbf39029dc681ce1dfe7842c7fea92959a1112', name: "header" })), this.hasItems && index.h("mds-separator", { key: '88a2d6d76477d31551968b938801d2ab8dfece12', class: "separator" }), this.hasItems && (index.h("main", { key: '260a30a69cd000ec83e5bae13fffdb1d1933389b', class: "main", part: "content" }, index.h("slot", { key: '251f8f9f6aa1b53d77cbb3b63285edc8afe49c6c', name: "item" }))), index.h("div", { key: 'd46082dd8a242025c895dd9255e6079f5baf17c8', class: "footer", part: "footer" }, index.h("slot", { key: '7b7320bb4b89c31e566517ce280d877b0976d4cc', name: "price" }), index.h("slot", { key: 'fec836e98ecdb4f0be4bc8265cd8d65241e2a14f', name: "action" }))));
     }
     get hostElement() { return index.getElement(this); }
 };

package/dist/cjs/mds-price-table.cjs.entry.js

@@ -2,14 +2,14 @@
 
 var index = require('./index-CNuKb6Lv.js');
 
-const mdsPriceTableCss = () => `@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),:is(mds-price-table-features,mds-price-table-header,mds-price-table-list):not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}:host{display:grid;gap:calc(var(--spacing,.0025rem)*600)}`;
+const mdsPriceTableCss = () => `@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),:is(mds-price-table-features,mds-price-table-header,mds-price-table-list):not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}:host{display:grid;gap:calc(var(--spacing,.0025rem)*600)}`;
 
 const MdsPriceTable = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
     }
     render() {
-        return (index.h(index.Host, { key: '2d2b09b6b5ec12bccfa957bf0a7ab636eacf8639' }, index.h("slot", { key: '1db821d187a0488397440de72739af6d7c30c971' })));
+        return (index.h(index.Host, { key: 'baecd51ddff0ed0b1479c17c87537eeeeffab1a5' }, index.h("slot", { key: '69d9c761c54799ffbac258ce299878b825af12ba' })));
     }
 };
 MdsPriceTable.style = mdsPriceTableCss();

package/dist/cjs/mds-progress_2.cjs.entry.js

@@ -2,8 +2,9 @@
 
 var index = require('./index-CNuKb6Lv.js');
 var aria = require('./aria-BbJUuU9_.js');
+var preference = require('./preference-BdpIXWLP.js');
 
-const mdsProgressCss = () => `@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--mds-progress-background:rgb(var(--tone-neutral-08,107 107 107));--mds-progress-color:rgb(var(--variant-primary-03,211 226 255));--mds-progress-duration:.75s;--mds-progress-radius:var(--radius-lg,16px);--mds-progress-thickness:var(--height-200);--tw-ease:initial}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}@property --mds-progress-duration{syntax:"<time>";inherits:false;initial-value:.75s}:host{--mds-progress-background:rgb(var(--tone-neutral-08,107 107 107));--mds-progress-color:rgb(var(--variant-primary-03,211 226 255));--mds-progress-duration:.75s;--mds-progress-thickness:var(--height-200);--tw-ease:var(--ease-in-out,cubic-bezier(.4,0,.2,1));background-color:var(--mds-progress-background,rgb(var(--tone-neutral-08,107 107 107)));border-radius:var(--radius-2xl,24px);transition-timing-function:var(--ease-in-out,cubic-bezier(.4,0,.2,1));corner-shape:var(--magma-corner-shape,round);display:flex;height:var(--mds-progress-thickness,var(--height-200));min-height:var(--mds-progress-thickness,var(--height-200));min-width:var(--mds-progress-thickness,var(--height-200));overflow:hidden;position:relative;-webkit-transition-duration:var(--duration-300,.3s);transition-duration:var(--duration-300,.3s);transition-property:background-color;width:100%}:host([direction=vertical]){flex-direction:column;height:unset;min-height:var(--mds-progress-thickness,var(--height-200));width:var(--mds-progress-thickness,var(--height-200))}:host([direction=radial]){aspect-ratio:1;background-color:#0000;height:auto}:host([direction=radial]) mds-radial-progress{width:inherit}.progress{--tw-ease:var(--ease-out-expo,cubic-bezier(.19,1,.22,1));background-color:var(--mds-progress-color,rgb(var(--variant-primary-03,211 226 255)));border-radius:inherit;transition-timing-function:var(--ease-out-expo,cubic-bezier(.19,1,.22,1));corner-shape:inherit;-webkit-transition-duration:var(--mds-progress-duration,.75s);transition-duration:var(--mds-progress-duration,.75s);transition-property:background-color,flex-grow,-ms-flex-positive}:host([variant=dark]){--mds-progress-color:rgb(var(--tone-neutral-03,233 233 233));--mds-progress-background:rgb(var(--tone-neutral-10,60 60 60))}:host([variant=light]){--mds-progress-color:rgb(var(--tone-neutral,0 0 0));--mds-progress-background:rgb(var(--tone-neutral-05,197 197 197))}:host([variant=error]){--mds-progress-color:rgb(var(--status-error-05,250 165 160));--mds-progress-background:rgb(var(--status-error-09,135 0 14))}:host([variant=warning]){--mds-progress-color:rgb(var(--status-warning-05,237 177 0));--mds-progress-background:rgb(var(--status-warning-09,90 67 0))}:host([variant=success]){--mds-progress-color:rgb(var(--status-success-05,107 206 147));--mds-progress-background:rgb(var(--status-success-09,0 82 9))}:host([variant=info]){--mds-progress-color:rgb(var(--status-info-05,112 198 234));--mds-progress-background:rgb(var(--status-info-09,0 73 116))}:host([variant=primary]){--mds-progress-color:rgb(var(--variant-primary-03,211 226 255));--mds-progress-background:rgb(var(--tone-neutral-08,107 107 107))}:host([variant=ai]){--mds-progress-color:rgb(var(--variant-ai-05,202 174 251));--mds-progress-background:rgb(var(--variant-ai-09,75 8 189))}:host([size=sm]){--mds-progress-thickness:calc(var(--spacing,.0025rem)*200)}:host([size=md]){--mds-progress-thickness:calc(var(--spacing,.0025rem)*300)}:host([size=lg]){--mds-progress-thickness:calc(var(--spacing,.0025rem)*400)}:host([size=xl]){--mds-progress-thickness:calc(var(--spacing,.0025rem)*600)}:host-context(:root.pref-animation-reduce){transition-duration:0s}:host-context(:root.pref-animation-reduce) .progress{transition-duration:0s}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){--mds-progress-color:rgb(var(--variant-primary-05,152 188 255));--mds-progress-background:rgb(var(--tone-neutral-07,134 134 134))}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)):host([variant=primary]){--mds-progress-color:rgb(var(--variant-primary-05,152 188 255));--mds-progress-background:rgb(var(--tone-neutral-07,134 134 134))}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)):host([variant=error]){--mds-progress-color:rgb(var(--status-error-04,254 193 189));--mds-progress-background:rgb(var(--status-error-07,212 80 79))}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)):host([variant=warning]){--mds-progress-color:rgb(var(--status-warning-04,255 200 33));--mds-progress-background:rgb(var(--status-warning-07,159 120 0))}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)):host([variant=success]){--mds-progress-color:rgb(var(--status-success-04,158 222 181));--mds-progress-background:rgb(var(--status-success-07,0 144 72))}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)):host([variant=info]){--mds-progress-color:rgb(var(--status-info-04,159 216 241));--mds-progress-background:rgb(var(--status-info-07,0 134 180))}:host-context(:root.pref-contrast-more){--mds-progress-color:rgb(var(--variant-primary-05,152 188 255));--mds-progress-background:rgb(var(--tone-neutral-07,134 134 134))}:host-context(:root.pref-contrast-more):host([variant=primary]){--mds-progress-color:rgb(var(--variant-primary-05,152 188 255));--mds-progress-background:rgb(var(--tone-neutral-07,134 134 134))}@property --tw-ease{syntax:"*";inherits:false}@media (prefers-reduced-motion){:is(:host-context(:root.pref-animation-system),:host-context(:root:not([data-magma-pref]))),:is(:host-context(:root.pref-animation-system),:host-context(:root:not([data-magma-pref]))) .progress{transition-duration:0s}}@media (prefers-color-scheme:dark){:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))),:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))):host([variant=primary]){--mds-progress-color:rgb(var(--variant-primary-05,152 188 255));--mds-progress-background:rgb(var(--tone-neutral-07,134 134 134))}:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))):host([variant=error]){--mds-progress-color:rgb(var(--status-error-04,254 193 189));--mds-progress-background:rgb(var(--status-error-07,212 80 79))}:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))):host([variant=warning]){--mds-progress-color:rgb(var(--status-warning-04,255 200 33));--mds-progress-background:rgb(var(--status-warning-07,159 120 0))}:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))):host([variant=success]){--mds-progress-color:rgb(var(--status-success-04,158 222 181));--mds-progress-background:rgb(var(--status-success-07,0 144 72))}:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))):host([variant=info]){--mds-progress-color:rgb(var(--status-info-04,159 216 241));--mds-progress-background:rgb(var(--status-info-07,0 134 180))}}@media (prefers-contrast:more){:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))),:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=primary]){--mds-progress-color:rgb(var(--variant-primary-05,152 188 255));--mds-progress-background:rgb(var(--tone-neutral-07,134 134 134))}}`;
+const mdsProgressCss = () => `@layer reset,vendor,theme,base,components,utilities;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--mds-progress-background:rgb(var(--tone-neutral-08,107 107 107));--mds-progress-color:rgb(var(--variant-primary-03,211 226 255));--mds-progress-duration:.75s;--mds-progress-radius:var(--radius-lg,16px);--mds-progress-thickness:var(--height-200);--tw-ease:initial}}}:host(:not(:is([hydrated],.hydrated))){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}@property --mds-progress-duration{syntax:"<time>";inherits:false;initial-value:.75s}:host{--mds-progress-background:rgb(var(--tone-neutral-08,107 107 107));--mds-progress-color:rgb(var(--variant-primary-03,211 226 255));--mds-progress-duration:.75s;--private-progress-duration:var(--mds-progress-duration,.75s);--mds-progress-transition-duration:var(--duration-300,.3s);--private-progress-transition-duration:var(--mds-progress-transition-duration);--mds-progress-thickness:var(--height-200);--tw-ease:var(--ease-in-out,cubic-bezier(.4,0,.2,1));background-color:var(--mds-progress-background,rgb(var(--tone-neutral-08,107 107 107)));border-radius:var(--radius-2xl,24px);transition-timing-function:var(--ease-in-out,cubic-bezier(.4,0,.2,1));corner-shape:var(--magma-corner-shape,round);display:flex;height:var(--mds-progress-thickness,var(--height-200));min-height:var(--mds-progress-thickness,var(--height-200));min-width:var(--mds-progress-thickness,var(--height-200));overflow:hidden;position:relative;-webkit-transition-duration:var(--private-progress-transition-duration);transition-duration:var(--private-progress-transition-duration);transition-property:background-color;width:100%}:host([direction=vertical]){flex-direction:column;height:unset;min-height:var(--mds-progress-thickness,var(--height-200));width:var(--mds-progress-thickness,var(--height-200))}:host([direction=radial]){aspect-ratio:1;background-color:#0000;height:auto}:host([direction=radial]) mds-radial-progress{width:inherit}.progress{--tw-ease:var(--ease-out-expo,cubic-bezier(.19,1,.22,1));background-color:var(--mds-progress-color,rgb(var(--variant-primary-03,211 226 255)));border-radius:inherit;transition-timing-function:var(--ease-out-expo,cubic-bezier(.19,1,.22,1));corner-shape:inherit;-webkit-transition-duration:var(--private-progress-duration);transition-duration:var(--private-progress-duration);transition-property:background-color,flex-grow,-ms-flex-positive}:host([variant=dark]){--mds-progress-color:rgb(var(--tone-neutral-03,233 233 233));--mds-progress-background:rgb(var(--tone-neutral-10,60 60 60))}:host([variant=light]){--mds-progress-color:rgb(var(--tone-neutral,0 0 0));--mds-progress-background:rgb(var(--tone-neutral-05,197 197 197))}:host([variant=error]){--mds-progress-color:rgb(var(--status-error-05,250 165 160));--mds-progress-background:rgb(var(--status-error-09,135 0 14))}:host([variant=warning]){--mds-progress-color:rgb(var(--status-warning-05,237 177 0));--mds-progress-background:rgb(var(--status-warning-09,90 67 0))}:host([variant=success]){--mds-progress-color:rgb(var(--status-success-05,107 206 147));--mds-progress-background:rgb(var(--status-success-09,0 82 9))}:host([variant=info]){--mds-progress-color:rgb(var(--status-info-05,112 198 234));--mds-progress-background:rgb(var(--status-info-09,0 73 116))}:host([variant=primary]){--mds-progress-color:rgb(var(--variant-primary-03,211 226 255));--mds-progress-background:rgb(var(--tone-neutral-08,107 107 107))}:host([variant=ai]){--mds-progress-color:rgb(var(--variant-ai-05,202 174 251));--mds-progress-background:rgb(var(--variant-ai-09,75 8 189))}:host([size=sm]){--mds-progress-thickness:calc(var(--spacing,.0025rem)*200)}:host([size=md]){--mds-progress-thickness:calc(var(--spacing,.0025rem)*300)}:host([size=lg]){--mds-progress-thickness:calc(var(--spacing,.0025rem)*400)}:host([size=xl]){--mds-progress-thickness:calc(var(--spacing,.0025rem)*600)}:host([pref-animation=reduce]){--private-progress-duration:0s;--private-progress-transition-duration:0s}:host([pref-theme=dark]:not([pref-theme-scheme=light])),:host([pref-theme=dark]:not([pref-theme-scheme=light])):host([variant=primary]){--mds-progress-color:rgb(var(--variant-primary-05,152 188 255));--mds-progress-background:rgb(var(--tone-neutral-07,134 134 134))}:host([pref-theme=dark]:not([pref-theme-scheme=light])):host([variant=error]){--mds-progress-color:rgb(var(--status-error-04,254 193 189));--mds-progress-background:rgb(var(--status-error-07,212 80 79))}:host([pref-theme=dark]:not([pref-theme-scheme=light])):host([variant=warning]){--mds-progress-color:rgb(var(--status-warning-04,255 200 33));--mds-progress-background:rgb(var(--status-warning-07,159 120 0))}:host([pref-theme=dark]:not([pref-theme-scheme=light])):host([variant=success]){--mds-progress-color:rgb(var(--status-success-04,158 222 181));--mds-progress-background:rgb(var(--status-success-07,0 144 72))}:host([pref-theme=dark]:not([pref-theme-scheme=light])):host([variant=info]){--mds-progress-color:rgb(var(--status-info-04,159 216 241));--mds-progress-background:rgb(var(--status-info-07,0 134 180))}:host([pref-contrast=more]),:host([pref-contrast=more]):host([variant=primary]){--mds-progress-color:rgb(var(--variant-primary-05,152 188 255));--mds-progress-background:rgb(var(--tone-neutral-07,134 134 134))}@property --tw-ease{syntax:"*";inherits:false}@media (prefers-reduced-motion:reduce){:host(:not([pref-animation])),:host([pref-animation=system]){--private-progress-duration:0s;--private-progress-transition-duration:0s}}@media (prefers-color-scheme:dark){:host(:not([pref-theme])),:host([pref-theme=system]:not([pref-theme-scheme=light])),:is(:host([pref-theme=system]:not([pref-theme-scheme=light])),:host(:not([pref-theme]))):host([variant=primary]){--mds-progress-color:rgb(var(--variant-primary-05,152 188 255));--mds-progress-background:rgb(var(--tone-neutral-07,134 134 134))}:is(:host([pref-theme=system]:not([pref-theme-scheme=light])),:host(:not([pref-theme]))):host([variant=error]){--mds-progress-color:rgb(var(--status-error-04,254 193 189));--mds-progress-background:rgb(var(--status-error-07,212 80 79))}:is(:host([pref-theme=system]:not([pref-theme-scheme=light])),:host(:not([pref-theme]))):host([variant=warning]){--mds-progress-color:rgb(var(--status-warning-04,255 200 33));--mds-progress-background:rgb(var(--status-warning-07,159 120 0))}:is(:host([pref-theme=system]:not([pref-theme-scheme=light])),:host(:not([pref-theme]))):host([variant=success]){--mds-progress-color:rgb(var(--status-success-04,158 222 181));--mds-progress-background:rgb(var(--status-success-07,0 144 72))}:is(:host([pref-theme=system]:not([pref-theme-scheme=light])),:host(:not([pref-theme]))):host([variant=info]){--mds-progress-color:rgb(var(--status-info-04,159 216 241));--mds-progress-background:rgb(var(--status-info-07,0 134 180))}}@media (prefers-contrast:more){:host(:not([pref-contrast])),:host([pref-contrast=system]),:is(:host([pref-contrast=system]),:host(:not([pref-contrast]))):host([variant=primary]){--mds-progress-color:rgb(var(--variant-primary-05,152 188 255));--mds-progress-background:rgb(var(--tone-neutral-07,134 134 134))}}`;
 
 const MdsProgress = class {
     constructor(hostRef) {
@@ -34,6 +35,27 @@ const MdsProgress = class {
          */
         this.steps = 'Inizio,Un quarto,Metà,Tre quarti,Fine';
     }
+    connectedCallback() {
+        this.unsubscribePrefAnimation = preference.subscribePreference('animation', (value) => {
+            this.prefAnimation = value;
+        });
+        this.unsubscribePrefContrast = preference.subscribePreference('contrast', (value) => {
+            this.prefContrast = value;
+        });
+        this.unsubscribePrefTheme = preference.subscribePreference('theme', (value) => {
+            this.prefTheme = value;
+        });
+        this.unsubscribePrefThemeScheme = preference.subscribePreference('theme-scheme', (value) => {
+            this.prefThemeScheme = value;
+        });
+    }
+    disconnectedCallback() {
+        var _a, _b, _c, _d;
+        (_a = this.unsubscribePrefAnimation) === null || _a === void 0 ? void 0 : _a.call(this);
+        (_b = this.unsubscribePrefContrast) === null || _b === void 0 ? void 0 : _b.call(this);
+        (_c = this.unsubscribePrefTheme) === null || _c === void 0 ? void 0 : _c.call(this);
+        (_d = this.unsubscribePrefThemeScheme) === null || _d === void 0 ? void 0 : _d.call(this);
+    }
     componentWillLoad() {
         this.stepsList = this.steps.split(',');
         this.setProgress(this.progress);
@@ -48,7 +70,7 @@ const MdsProgress = class {
         ]);
     }
     setProgress(progress) {
-        if (this.steps) {
+        if (this.steps !== '') {
             this.currentStep = this.stepsList[Math.round(progress * (this.stepsList.length - 1))];
             if (!aria.ifAttribute(this.element, 'aria-hidden')) {
                 this.element.setAttribute('aria-valuetext', this.currentStep);
@@ -62,7 +84,7 @@ const MdsProgress = class {
         this.stepsList = steps.split(',');
     }
     render() {
-        return (index.h(index.Host, { key: 'b515b4bc8d9bb3e124374ad1adc90a50016c1434', "aria-valuemax": "100", "aria-valuemin": "0", "aria-valuenow": !aria.ifAttribute(this.element, 'aria-hidden') && Math.round(this.progress * 100), role: "progressbar" }, this.direction === 'radial' ? (index.h("mds-radial-progress", { progress: this.progress, part: "radial-progress", typography: this.typography, variant: this.variant })) : (index.h("div", { class: "progress", part: "progress", style: this.direction === 'horizontal'
+        return (index.h(index.Host, { key: '0ab0f8e5741890ca0270ee8b3e898cfa6b128966', "aria-valuemax": "100", "aria-valuemin": "0", "aria-valuenow": !aria.ifAttribute(this.element, 'aria-hidden') && Math.round(this.progress * 100), role: "progressbar", "pref-animation": this.prefAnimation, "pref-contrast": this.prefContrast, "pref-theme": this.prefTheme, "pref-theme-scheme": this.prefThemeScheme }, this.direction === 'radial' ? (index.h("mds-radial-progress", { progress: this.progress, part: "radial-progress", typography: this.typography, variant: this.variant })) : (index.h("div", { class: "progress", part: "progress", style: this.direction === 'horizontal'
                 ? { flexGrow: `${this.progress}` }
                 : { flexGrow: `${this.progress}`, width: '100%' } }))));
     }
@@ -78,7 +100,7 @@ const MdsProgress = class {
 };
 MdsProgress.style = mdsProgressCss();
 
-const mdsRadialProgressCss = () => `@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--mds-radial-progress:0%}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),:is(mds-button,mds-tooltip):not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}@property --mds-radial-progress{syntax:"<length-percentage>";inherits:false;initial-value:0%}:host{--mds-radial-progress-background:rgb(var(--tone-neutral-09,76 76 76));--mds-radial-progress-color:rgb(var(--variant-primary-03,211 226 255));--mds-radial-progress-text-background-shadow:var(--shadow-sm-sharp,0 0 1px 1px #0000000f,0 1px 3px 0 #0000001a);--mds-radial-progress-text-background:rgb(var(--tone-neutral,0 0 0));--mds-radial-progress-text-suffix:"%";--mds-radial-progress:0%;align-items:center;aspect-ratio:1;background-color:var(--mds-radial-progress-background);background-image:conic-gradient(var(--mds-radial-progress-color) var(--mds-radial-progress,0),transparent 0);border-radius:3.40282e+38px;box-sizing:border-box;container:mds-radial-progress/inline-size;display:flex;height:auto;justify-content:center;padding:calc(var(--spacing,.0025rem)*200);transition-duration:.5s;transition-property:background-color,--mds-radial-progress-color,--mds-radial-progress;transition-timing-function:ease-out;width:calc(var(--spacing,.0025rem)*1200)}.value-container{aspect-ratio:1;background-color:var(--mds-radial-progress-text-background);border-radius:inherit;-webkit-box-shadow:var(--mds-radial-progress-text-background-shadow);box-shadow:var(--mds-radial-progress-text-background-shadow);display:flex;flex-direction:column;gap:calc(var(--spacing,.0025rem)*50);padding:calc(var(--spacing,.0025rem)*50);width:100%}.value-container,.value-container__text{align-items:center;justify-content:center}.value,.value-container__text{display:inline-flex}.value{color:currentColor}.value:after{content:var(--mds-radial-progress-text-suffix)}.icon{aspect-ratio:1;fill:var(--mds-radial-progress-color);max-height:calc(var(--spacing,.0025rem)*600);max-width:calc(var(--spacing,.0025rem)*600);width:100%}@container mds-radial-progress (max-width:47px){:host([typography=label][icon]) .value-container__text,:host([typography=option][icon]) .value-container__text{display:none}}@container mds-radial-progress (max-width:35px){:host([typography=label]) .value{--mds-radial-progress-text-suffix:""}}@container mds-radial-progress (max-width:31px){:host([typography=option]) .value{--mds-radial-progress-text-suffix:""}}@container mds-radial-progress (max-width:23px){:host([typography=label]) .value{display:none}}@container mds-radial-progress (max-width:19px){:host([typography=option]) .value{display:none}}:host([variant=primary]){--mds-radial-progress-color:rgb(var(--variant-primary-03,211 226 255));--mds-radial-progress-background:rgb(var(--tone-neutral-09,76 76 76))}:host([variant=secondary]){--mds-radial-progress-color:rgb(var(--variant-secondary-03,215 226 252));--mds-radial-progress-background:rgb(var(--tone-neutral-09,76 76 76))}:host([variant=ai]){--mds-radial-progress-color:rgb(var(--variant-ai-04,218 199 253));--mds-radial-progress-background:rgb(var(--variant-ai-09,75 8 189))}:host([variant=error]){--mds-radial-progress-color:rgb(var(--status-error-05,250 165 160));--mds-radial-progress-background:rgb(var(--status-error-09,135 0 14))}:host([variant=warning]){--mds-radial-progress-color:rgb(var(--status-warning-05,237 177 0));--mds-radial-progress-background:rgb(var(--status-warning-09,90 67 0))}:host([variant=success]){--mds-radial-progress-color:rgb(var(--status-success-05,107 206 147));--mds-radial-progress-background:rgb(var(--status-success-09,0 82 9))}:host([variant=info]){--mds-radial-progress-color:rgb(var(--status-info-05,112 198 234));--mds-radial-progress-background:rgb(var(--status-info-09,0 73 116))}:host([variant=light]){--mds-radial-progress-color:rgb(var(--tone-neutral-03,233 233 233));--mds-radial-progress-background:rgb(var(--tone-neutral-09,76 76 76))}:host([variant=dark]){--mds-radial-progress-color:rgb(var(--tone-neutral-09,76 76 76));--mds-radial-progress-background:rgb(var(--tone-neutral-02,244 244 244));--mds-radial-progress-text-background:rgb(var(--tone-neutral-04,218 218 218));color:rgb(var(--tone-neutral,0 0 0))}`;
+const mdsRadialProgressCss = () => `@layer reset,vendor,theme,base,components,utilities;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--mds-radial-progress:0%}}}:host(:not(:is([hydrated],.hydrated))),:is(mds-button,mds-tooltip):not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}@property --mds-radial-progress{syntax:"<length-percentage>";inherits:false;initial-value:0%}:host{--mds-radial-progress-background:rgb(var(--tone-neutral-09,76 76 76));--mds-radial-progress-color:rgb(var(--variant-primary-03,211 226 255));--mds-radial-progress-text-background-shadow:var(--shadow-sm-sharp,0 0 1px 1px #0000000f,0 1px 3px 0 #0000001a);--mds-radial-progress-text-background:rgb(var(--tone-neutral,0 0 0));--mds-radial-progress-text-suffix:"%";--mds-radial-progress:0%;align-items:center;aspect-ratio:1;background-color:var(--mds-radial-progress-background);background-image:conic-gradient(var(--mds-radial-progress-color) var(--mds-radial-progress,0),#0000 0);border-radius:3.40282e+38px;box-sizing:border-box;container:mds-radial-progress/inline-size;display:flex;height:auto;justify-content:center;padding:calc(var(--spacing,.0025rem)*200);transition-duration:.5s;transition-property:background-color,--mds-radial-progress-color,--mds-radial-progress;transition-timing-function:ease-out;width:calc(var(--spacing,.0025rem)*1200)}.value-container{aspect-ratio:1;background-color:var(--mds-radial-progress-text-background);border-radius:inherit;-webkit-box-shadow:var(--mds-radial-progress-text-background-shadow);box-shadow:var(--mds-radial-progress-text-background-shadow);display:flex;flex-direction:column;gap:calc(var(--spacing,.0025rem)*50);padding:calc(var(--spacing,.0025rem)*50);width:100%}.value-container,.value-container__text{align-items:center;justify-content:center}.value,.value-container__text{display:inline-flex}.value{color:currentColor}.value:after{content:var(--mds-radial-progress-text-suffix)}.icon{aspect-ratio:1;fill:var(--mds-radial-progress-color);max-height:calc(var(--spacing,.0025rem)*600);max-width:calc(var(--spacing,.0025rem)*600);width:100%}@container mds-radial-progress (max-width:47px){:host([typography=label][icon]) .value-container__text,:host([typography=option][icon]) .value-container__text{display:none}}@container mds-radial-progress (max-width:35px){:host([typography=label]) .value{--mds-radial-progress-text-suffix:""}}@container mds-radial-progress (max-width:31px){:host([typography=option]) .value{--mds-radial-progress-text-suffix:""}}@container mds-radial-progress (max-width:23px){:host([typography=label]) .value{display:none}}@container mds-radial-progress (max-width:19px){:host([typography=option]) .value{display:none}}:host([variant=primary]){--mds-radial-progress-color:rgb(var(--variant-primary-03,211 226 255));--mds-radial-progress-background:rgb(var(--tone-neutral-09,76 76 76))}:host([variant=secondary]){--mds-radial-progress-color:rgb(var(--variant-secondary-03,215 226 252));--mds-radial-progress-background:rgb(var(--tone-neutral-09,76 76 76))}:host([variant=ai]){--mds-radial-progress-color:rgb(var(--variant-ai-04,218 199 253));--mds-radial-progress-background:rgb(var(--variant-ai-09,75 8 189))}:host([variant=error]){--mds-radial-progress-color:rgb(var(--status-error-05,250 165 160));--mds-radial-progress-background:rgb(var(--status-error-09,135 0 14))}:host([variant=warning]){--mds-radial-progress-color:rgb(var(--status-warning-05,237 177 0));--mds-radial-progress-background:rgb(var(--status-warning-09,90 67 0))}:host([variant=success]){--mds-radial-progress-color:rgb(var(--status-success-05,107 206 147));--mds-radial-progress-background:rgb(var(--status-success-09,0 82 9))}:host([variant=info]){--mds-radial-progress-color:rgb(var(--status-info-05,112 198 234));--mds-radial-progress-background:rgb(var(--status-info-09,0 73 116))}:host([variant=light]){--mds-radial-progress-color:rgb(var(--tone-neutral-03,233 233 233));--mds-radial-progress-background:rgb(var(--tone-neutral-09,76 76 76))}:host([variant=dark]){--mds-radial-progress-color:rgb(var(--tone-neutral-09,76 76 76));--mds-radial-progress-background:rgb(var(--tone-neutral-02,244 244 244));--mds-radial-progress-text-background:rgb(var(--tone-neutral-04,218 218 218));color:rgb(var(--tone-neutral,0 0 0))}`;
 
 const MdsRadialProgress = class {
     constructor(hostRef) {
@@ -149,7 +171,7 @@ const MdsRadialProgress = class {
     render() {
         const progressVar = `${(this.animatedProgress * 100).toFixed(2)}%`;
         const progressText = this.progressPercentage(this.clampProgress(this.progress));
-        return (index.h(index.Host, { key: 'bcac88e69c445c6bfb5de1cbbfc649ffd507dc12', style: { '--mds-radial-progress': progressVar }, role: "progressbar" }, index.h("div", { key: 'c874c37272324a7edfa12252e22547c4ae6a8c5b', class: "value-container", part: "value-container" }, this.icon && index.h("mds-icon", { key: 'ab14594f35d5ed15f6997c2cce47ca44612eab1d', class: "icon", name: this.icon, part: "icon" }), index.h("div", { key: '107216f2319c2895f0a9c6936c1c1ae42a54a0b5', class: "value-container__text" }, index.h("mds-text", { key: '27127a11de571b6b1703690aa37553b20db84aff', class: "value", typography: this.typography }, progressText)))));
+        return (index.h(index.Host, { key: '83881b4057b76db8a56eff2185522ab7394f11aa', style: { '--mds-radial-progress': progressVar }, role: "progressbar" }, index.h("div", { key: 'f21da1d993decfa5cd242186559f2c25c0209030', class: "value-container", part: "value-container" }, this.icon && index.h("mds-icon", { key: '1f53b8c170ae2657ae097e4207e32b75ce91cf91', class: "icon", name: this.icon, part: "icon" }), index.h("div", { key: '7f5b4e719ccb8c484c633b2cfc07cb02f90b14f0', class: "value-container__text" }, index.h("mds-text", { key: '2a379a399770d3a0dac5dc5bf88fcda83ff9ad43', class: "value", typography: this.typography }, progressText)))));
     }
     static get watchers() { return {
         "progress": [{

package/dist/cjs/mds-push-notification-item.cjs.entry.js

@@ -5,6 +5,7 @@ var _commonjsHelpers = require('./_commonjsHelpers-B83fTs8d.js');
 var cancel = require('./cancel-_rS5f5_p.js');
 var locale = require('./locale-oGW3SvGJ.js');
 var date = require('./date-dnDGaLCn.js');
+var preference = require('./preference-BdpIXWLP.js');
 
 var dayjs_min$1 = {exports: {}};
 
@@ -166,9 +167,8 @@ function requireRelativeTime () {
 var relativeTimeExports = requireRelativeTime();
 var relativeTime = /*@__PURE__*/_commonjsHelpers.getDefaultExportFromCjs(relativeTimeExports);
 
-const mdsPushNotificationItemCss = () => `@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--mds-push-notification-item-duration:.3s;--mds-push-notification-item-icon-background-color:transparent;--mds-push-notification-item-icon-color:rgb(var(--tone-neutral-04,218 218 218));--mds-push-notification-item-message-line-clamp:2;--mds-push-notification-item-subject-line-clamp:1}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),:is(mds-avatar,mds-button,mds-img,mds-text):not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}@property --mds-push-notification-item-duration{syntax:"<time>";inherits:false;initial-value:.3s}@property --mds-push-notification-item-icon-background-color{syntax:"<color>";inherits:false;initial-value:#0000}@property --mds-push-notification-item-message-line-clamp{syntax:"<integer>";inherits:false;initial-value:2}@property --mds-push-notification-item-subject-line-clamp{syntax:"<integer>";inherits:false;initial-value:1}:host{--mds-push-notification-item-duration:.3s;--mds-push-notification-item-icon-background-color:transparent;--mds-push-notification-item-icon-color:rgb(var(--tone-neutral-04,218 218 218));--mds-push-notification-item-message-line-clamp:2;--mds-push-notification-item-shadow:var(--shadow-sm-sharp,0 0 1px 1px #0000000f,0 1px 3px 0 #0000001a);--mds-push-notification-item-subject-line-clamp:1;--mds-push-notification-item-timing-function:var(--ease-in-out-quint,cubic-bezier(.86,0,.07,1));align-items:flex-start;background-color:rgb(var(--tone-neutral,0 0 0));border-radius:var(--radius-lg,16px);-webkit-box-shadow:var(--mds-push-notification-item-shadow);box-shadow:var(--mds-push-notification-item-shadow);color:rgb(var(--tone-neutral-02,244 244 244));display:flex;gap:calc(var(--spacing,.0025rem)*400);max-width:calc(var(--spacing,.0025rem)*8000);min-width:calc(var(--spacing,.0025rem)*7200);padding:calc(var(--spacing,.0025rem)*400);pointer-events:auto;position:relative;-webkit-transition-duration:var(--mds-push-notification-item-duration,.3s);transition-duration:var(--mds-push-notification-item-duration,.3s);transition-property:background-color,box-shadow,color,margin,transform;-webkit-transition-timing-function:var(--mds-push-notification-item-timing-function);transition-timing-function:var(--mds-push-notification-item-timing-function)}:host([deletable]){padding-right:calc(var(--spacing,.0025rem)*800)}.content{display:grid;flex-grow:1}.actions{display:flex;flex-wrap:wrap;gap:calc(var(--spacing,.0025rem)*200);min-width:1px;padding-top:calc(var(--spacing,.0025rem)*200)}.avatar,.picture{flex-shrink:0}.picture{border-radius:.25rem;-webkit-box-shadow:var(--shadow-sm-sharp,0 0 1px 1px #0000000f,0 1px 3px 0 #0000001a);box-shadow:var(--shadow-sm-sharp,0 0 1px 1px #0000000f,0 1px 3px 0 #0000001a);max-width:calc(var(--spacing,.0025rem)*1200);width:100%}.close-button{opacity:0;padding:calc(var(--spacing,.0025rem)*150);position:absolute;right:0;top:0;transition-duration:var(--default-transition-duration);transition-property:background-color,border-color,box-shadow,color,fill,height,margin,opacity,padding,transform,width;transition-timing-function:var(--default-transition-timing-function)}:host-context(:not(.safari)):host(:hover) .close-button{opacity:1}.close-button:focus-visible,.close-button:hover{fill:rgb(var(--tone-neutral-03,233 233 233));opacity:1}.header{align-items:baseline;display:flex;gap:calc(var(--spacing,.0025rem)*100);justify-content:space-between;min-width:0;overflow:hidden;text-overflow:ellipsis}.infos{display:flex;flex-direction:column}.time{flex-shrink:0;margin-right:calc(var(--spacing,.0025rem)*100);white-space:nowrap}.subject{--mds-text-line-clamp:var(--mds-push-notification-item-subject-line-clamp,1);line-height:var(--leading-sm,1.25rem)}.message,.subject{text-overflow:ellipsis}.message{--mds-text-line-clamp:var(--mds-push-notification-item-message-line-clamp,2)}.avatar{background-color:var(--mds-push-notification-item-icon-background-color,transparent);border-radius:1000px;fill:var(--mds-push-notification-item-icon-color,rgb(var(--tone-neutral-04,218 218 218)));height:calc(var(--spacing,.0025rem)*900);width:calc(var(--spacing,.0025rem)*900)}.avatar::part(svg){width:calc(var(--spacing,.0025rem)*600)}:host([src]) .avatar{background-color:#0000}:host([icon]) .avatar::part(wrapper){padding:calc(var(--spacing,.0025rem)*150)}:host-context(:root.pref-animation-reduce){transition-duration:0s}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){--mds-push-notifications-shadow:var(--shadow-outline) inset;background-color:rgb(var(--tone-neutral-09,76 76 76))}:host-context(:root.pref-contrast-more){--mds-push-notification-item-shadow:var(--shadow-outline-strong-50) inset;color:rgb(var(--tone-neutral-01,255 255 255))}:host([variant=primary][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--variant-primary-05,152 188 255));--mds-push-notification-item-icon-color:rgb(var(--variant-primary-10,0 49 142))}:host([variant=primary]),:host([variant=primary][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--variant-primary-09,0 58 168));--mds-push-notification-item-icon-color:rgb(var(--variant-primary-05,152 188 255))}:host([variant=primary][tone=text]){--mds-push-notification-item-icon-background-color:transparent;--mds-push-notification-item-icon-color:rgb(var(--variant-primary-05,152 188 255))}:host([variant=orange][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--label-orange-05,251 168 111));--mds-push-notification-item-icon-color:rgb(var(--label-orange-10,99 42 3))}:host([variant=orange]),:host([variant=orange][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--label-orange-09,116 49 3));--mds-push-notification-item-icon-color:rgb(var(--label-orange-05,251 168 111))}:host([variant=orange][tone=text]){--mds-push-notification-item-icon-background-color:transparent;--mds-push-notification-item-icon-color:rgb(var(--label-orange-05,251 168 111))}:host([variant=amaranth][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--label-amaranth-05,250 163 178));--mds-push-notification-item-icon-color:rgb(var(--label-amaranth-10,114 7 25))}:host([variant=amaranth]),:host([variant=amaranth][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--label-amaranth-09,135 8 30));--mds-push-notification-item-icon-color:rgb(var(--label-amaranth-05,250 163 178))}:host([variant=amaranth][tone=text]){--mds-push-notification-item-icon-background-color:transparent;--mds-push-notification-item-icon-color:rgb(var(--label-amaranth-05,250 163 178))}:host([variant=orchid][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--label-orchid-05,245 163 203));--mds-push-notification-item-icon-color:rgb(var(--label-orchid-10,111 12 61))}:host([variant=orchid]),:host([variant=orchid][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--label-orchid-09,131 14 71));--mds-push-notification-item-icon-color:rgb(var(--label-orchid-05,245 163 203))}:host([variant=orchid][tone=text]){--mds-push-notification-item-icon-background-color:transparent;--mds-push-notification-item-icon-color:rgb(var(--label-orchid-05,245 163 203))}:host([variant=violet][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--label-violet-05,198 175 251));--mds-push-notification-item-icon-color:rgb(var(--label-violet-10,57 9 165))}:host([variant=violet]),:host([variant=violet][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--label-violet-09,67 11 195));--mds-push-notification-item-icon-color:rgb(var(--label-violet-05,198 175 251))}:host([variant=violet][tone=text]){--mds-push-notification-item-icon-background-color:transparent;--mds-push-notification-item-icon-color:rgb(var(--label-violet-05,198 175 251))}:host([variant=blue][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--label-blue-05,170 184 252));--mds-push-notification-item-icon-color:rgb(var(--label-blue-10,6 34 166))}:host([variant=blue]),:host([variant=blue][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--label-blue-09,7 40 196));--mds-push-notification-item-icon-color:rgb(var(--label-blue-05,170 184 252))}:host([variant=blue][tone=text]){--mds-push-notification-item-icon-background-color:transparent;--mds-push-notification-item-icon-color:rgb(var(--label-blue-05,170 184 252))}:host([variant=sky][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--label-sky-05,94 198 245));--mds-push-notification-item-icon-color:rgb(var(--label-sky-10,5 63 90))}:host([variant=sky]),:host([variant=sky][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--label-sky-09,6 76 107));--mds-push-notification-item-icon-color:rgb(var(--label-sky-05,94 198 245))}:host([variant=sky][tone=text]){--mds-push-notification-item-icon-background-color:transparent;--mds-push-notification-item-icon-color:rgb(var(--label-sky-05,94 198 245))}:host([variant=aqua][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--label-aqua-05,7 203 237));--mds-push-notification-item-icon-color:rgb(var(--label-aqua-10,2 65 76))}:host([variant=aqua]),:host([variant=aqua][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--label-aqua-09,3 77 90));--mds-push-notification-item-icon-color:rgb(var(--label-aqua-05,7 203 237))}:host([variant=aqua][tone=text]){--mds-push-notification-item-icon-background-color:transparent;--mds-push-notification-item-icon-color:rgb(var(--label-aqua-05,7 203 237))}:host([variant=green][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--label-green-05,37 213 102));--mds-push-notification-item-icon-color:rgb(var(--label-green-10,12 68 33))}:host([variant=green]),:host([variant=green][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--label-green-09,14 81 39));--mds-push-notification-item-icon-color:rgb(var(--label-green-05,37 213 102))}:host([variant=green][tone=text]){--mds-push-notification-item-icon-background-color:transparent;--mds-push-notification-item-icon-color:rgb(var(--label-green-05,37 213 102))}:host([variant=lime][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--label-lime-05,134 207 22));--mds-push-notification-item-icon-color:rgb(var(--label-lime-10,43 66 7))}:host([variant=lime]),:host([variant=lime][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--label-lime-09,51 79 8));--mds-push-notification-item-icon-color:rgb(var(--label-lime-05,134 207 22))}:host([variant=lime][tone=text]){--mds-push-notification-item-icon-background-color:transparent;--mds-push-notification-item-icon-color:rgb(var(--label-lime-05,134 207 22))}:host([variant=yellow][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--label-yellow-05,234 179 8));--mds-push-notification-item-icon-color:rgb(var(--label-yellow-10,75 57 3))}:host([variant=yellow]),:host([variant=yellow][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--label-yellow-09,89 68 3));--mds-push-notification-item-icon-color:rgb(var(--label-yellow-05,234 179 8))}:host([variant=yellow][tone=text]){--mds-push-notification-item-icon-background-color:transparent;--mds-push-notification-item-icon-color:rgb(var(--label-yellow-05,234 179 8))}:host([variant=error][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--status-error-05,250 165 160));--mds-push-notification-item-icon-color:rgb(var(--status-error-10,115 0 0))}:host([variant=error]),:host([variant=error][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--status-error-09,135 0 14));--mds-push-notification-item-icon-color:rgb(var(--status-error-05,250 165 160))}:host([variant=error][tone=text]){--mds-push-notification-item-icon-background-color:transparent;--mds-push-notification-item-icon-color:rgb(var(--status-error-05,250 165 160))}:host([variant=warning][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--status-warning-05,237 177 0));--mds-push-notification-item-icon-color:rgb(var(--status-warning-10,77 57 0))}:host([variant=warning]),:host([variant=warning][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--status-warning-09,90 67 0));--mds-push-notification-item-icon-color:rgb(var(--status-warning-05,237 177 0))}:host([variant=warning][tone=text]){--mds-push-notification-item-icon-background-color:transparent;--mds-push-notification-item-icon-color:rgb(var(--status-warning-05,237 177 0))}:host([variant=success][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--status-success-05,107 206 147));--mds-push-notification-item-icon-color:rgb(var(--status-success-10,0 69 0))}:host([variant=success]),:host([variant=success][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--status-success-09,0 82 9));--mds-push-notification-item-icon-color:rgb(var(--status-success-05,107 206 147))}:host([variant=success][tone=text]){--mds-push-notification-item-icon-background-color:transparent;--mds-push-notification-item-icon-color:rgb(var(--status-success-05,107 206 147))}:host([variant=info][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--status-info-05,112 198 234));--mds-push-notification-item-icon-color:rgb(var(--status-info-10,0 61 103))}:host([variant=info]),:host([variant=info][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--status-info-09,0 73 116));--mds-push-notification-item-icon-color:rgb(var(--status-info-05,112 198 234))}:host([variant=info][tone=text]){--mds-push-notification-item-icon-background-color:transparent;--mds-push-notification-item-icon-color:rgb(var(--status-info-05,112 198 234))}@media (prefers-reduced-motion){:is(:host-context(:root.pref-animation-system),:host-context(:root:not([data-magma-pref]))){transition-duration:0s}}@media (prefers-color-scheme:dark){:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))){--mds-push-notifications-shadow:var(--shadow-outline) inset;background-color:rgb(var(--tone-neutral-09,76 76 76))}}@media (prefers-contrast:more){:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))){--mds-push-notification-item-shadow:var(--shadow-outline-strong-50) inset;color:rgb(var(--tone-neutral-01,255 255 255))}}`;
+const mdsPushNotificationItemCss = () => `@layer reset,vendor,theme,base,components,utilities;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--mds-push-notification-item-duration:.3s;--mds-push-notification-item-icon-background-color:#0000;--mds-push-notification-item-icon-color:rgb(var(--tone-neutral-04,218 218 218));--mds-push-notification-item-message-line-clamp:2;--mds-push-notification-item-subject-line-clamp:1}}}:host(:not(:is([hydrated],.hydrated))),:is(mds-avatar,mds-button,mds-img,mds-text):not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}@property --mds-push-notification-item-duration{syntax:"<time>";inherits:false;initial-value:.3s}@property --mds-push-notification-item-icon-background-color{syntax:"<color>";inherits:false;initial-value:#0000}@property --mds-push-notification-item-message-line-clamp{syntax:"<integer>";inherits:false;initial-value:2}@property --mds-push-notification-item-subject-line-clamp{syntax:"<integer>";inherits:false;initial-value:1}:host{--mds-push-notification-item-duration:.3s;--private-push-notification-item-duration:var(--mds-push-notification-item-duration,.3s);--mds-push-notification-item-icon-background-color:#0000;--mds-push-notification-item-icon-color:rgb(var(--tone-neutral-04,218 218 218));--mds-push-notification-item-message-line-clamp:2;--mds-push-notification-item-shadow:var(--shadow-sm-sharp,0 0 1px 1px #0000000f,0 1px 3px 0 #0000001a);--mds-push-notification-item-subject-line-clamp:1;--mds-push-notification-item-timing-function:var(--ease-in-out-quint,cubic-bezier(.86,0,.07,1));align-items:flex-start;background-color:rgb(var(--tone-neutral,0 0 0));border-radius:var(--radius-lg,16px);-webkit-box-shadow:var(--mds-push-notification-item-shadow);box-shadow:var(--mds-push-notification-item-shadow);color:rgb(var(--tone-neutral-02,244 244 244));display:flex;gap:calc(var(--spacing,.0025rem)*400);max-width:calc(var(--spacing,.0025rem)*8000);min-width:calc(var(--spacing,.0025rem)*7200);padding:calc(var(--spacing,.0025rem)*400);pointer-events:auto;position:relative;-webkit-transition-duration:var(--private-push-notification-item-duration);transition-duration:var(--private-push-notification-item-duration);transition-property:background-color,box-shadow,color,margin,transform;-webkit-transition-timing-function:var(--mds-push-notification-item-timing-function);transition-timing-function:var(--mds-push-notification-item-timing-function)}:host([deletable]:not([deletable=false])){padding-right:calc(var(--spacing,.0025rem)*800)}.content{display:grid;flex-grow:1}.actions{display:flex;flex-wrap:wrap;gap:calc(var(--spacing,.0025rem)*200);min-width:1px;padding-top:calc(var(--spacing,.0025rem)*200)}.avatar,.picture{flex-shrink:0}.picture{border-radius:.25rem;-webkit-box-shadow:var(--shadow-sm-sharp,0 0 1px 1px #0000000f,0 1px 3px 0 #0000001a);box-shadow:var(--shadow-sm-sharp,0 0 1px 1px #0000000f,0 1px 3px 0 #0000001a);max-width:calc(var(--spacing,.0025rem)*1200);width:100%}.close-button{opacity:0;padding:calc(var(--spacing,.0025rem)*150);position:absolute;right:0;top:0;transition-duration:var(--default-transition-duration);transition-property:background-color,border-color,box-shadow,color,fill,height,margin,opacity,padding,transform,width;transition-timing-function:var(--default-transition-timing-function)}:host(:hover) .close-button{opacity:1}.close-button:focus-visible,.close-button:hover{fill:rgb(var(--tone-neutral-03,233 233 233));opacity:1}.header{align-items:baseline;display:flex;gap:calc(var(--spacing,.0025rem)*100);justify-content:space-between;min-width:0;overflow:hidden;text-overflow:ellipsis}.infos{display:flex;flex-direction:column}.time{flex-shrink:0;margin-right:calc(var(--spacing,.0025rem)*100);white-space:nowrap}.subject{--mds-text-line-clamp:var(--mds-push-notification-item-subject-line-clamp,1);line-height:var(--leading-sm,1.25rem)}.message,.subject{text-overflow:ellipsis}.message{--mds-text-line-clamp:var(--mds-push-notification-item-message-line-clamp,2)}.avatar{background-color:var(--mds-push-notification-item-icon-background-color,#0000);border-radius:1000px;fill:var(--mds-push-notification-item-icon-color,rgb(var(--tone-neutral-04,218 218 218)));height:calc(var(--spacing,.0025rem)*900);width:calc(var(--spacing,.0025rem)*900)}.avatar::part(svg){width:calc(var(--spacing,.0025rem)*600)}:host([src]) .avatar{background-color:#0000}:host([icon]) .avatar::part(wrapper){padding:calc(var(--spacing,.0025rem)*150)}:host([pref-animation=reduce]){--private-push-notification-item-duration:0s}:host([pref-theme=dark]:not([pref-theme-scheme=light])){--mds-push-notifications-shadow:var(--shadow-outline) inset;background-color:rgb(var(--tone-neutral-09,76 76 76))}:host([pref-contrast=more]){--mds-push-notification-item-shadow:var(--shadow-outline-strong-50) inset;color:rgb(var(--tone-neutral-01,255 255 255))}:host([variant=primary][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--variant-primary-05,152 188 255));--mds-push-notification-item-icon-color:rgb(var(--variant-primary-10,0 49 142))}:host([variant=primary]),:host([variant=primary][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--variant-primary-09,0 58 168));--mds-push-notification-item-icon-color:rgb(var(--variant-primary-05,152 188 255))}:host([variant=primary][tone=text]){--mds-push-notification-item-icon-background-color:#0000;--mds-push-notification-item-icon-color:rgb(var(--variant-primary-05,152 188 255))}:host([variant=orange][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--label-orange-05,251 168 111));--mds-push-notification-item-icon-color:rgb(var(--label-orange-10,99 42 3))}:host([variant=orange]),:host([variant=orange][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--label-orange-09,116 49 3));--mds-push-notification-item-icon-color:rgb(var(--label-orange-05,251 168 111))}:host([variant=orange][tone=text]){--mds-push-notification-item-icon-background-color:#0000;--mds-push-notification-item-icon-color:rgb(var(--label-orange-05,251 168 111))}:host([variant=amaranth][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--label-amaranth-05,250 163 178));--mds-push-notification-item-icon-color:rgb(var(--label-amaranth-10,114 7 25))}:host([variant=amaranth]),:host([variant=amaranth][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--label-amaranth-09,135 8 30));--mds-push-notification-item-icon-color:rgb(var(--label-amaranth-05,250 163 178))}:host([variant=amaranth][tone=text]){--mds-push-notification-item-icon-background-color:#0000;--mds-push-notification-item-icon-color:rgb(var(--label-amaranth-05,250 163 178))}:host([variant=orchid][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--label-orchid-05,245 163 203));--mds-push-notification-item-icon-color:rgb(var(--label-orchid-10,111 12 61))}:host([variant=orchid]),:host([variant=orchid][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--label-orchid-09,131 14 71));--mds-push-notification-item-icon-color:rgb(var(--label-orchid-05,245 163 203))}:host([variant=orchid][tone=text]){--mds-push-notification-item-icon-background-color:#0000;--mds-push-notification-item-icon-color:rgb(var(--label-orchid-05,245 163 203))}:host([variant=violet][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--label-violet-05,198 175 251));--mds-push-notification-item-icon-color:rgb(var(--label-violet-10,57 9 165))}:host([variant=violet]),:host([variant=violet][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--label-violet-09,67 11 195));--mds-push-notification-item-icon-color:rgb(var(--label-violet-05,198 175 251))}:host([variant=violet][tone=text]){--mds-push-notification-item-icon-background-color:#0000;--mds-push-notification-item-icon-color:rgb(var(--label-violet-05,198 175 251))}:host([variant=blue][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--label-blue-05,170 184 252));--mds-push-notification-item-icon-color:rgb(var(--label-blue-10,6 34 166))}:host([variant=blue]),:host([variant=blue][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--label-blue-09,7 40 196));--mds-push-notification-item-icon-color:rgb(var(--label-blue-05,170 184 252))}:host([variant=blue][tone=text]){--mds-push-notification-item-icon-background-color:#0000;--mds-push-notification-item-icon-color:rgb(var(--label-blue-05,170 184 252))}:host([variant=sky][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--label-sky-05,94 198 245));--mds-push-notification-item-icon-color:rgb(var(--label-sky-10,5 63 90))}:host([variant=sky]),:host([variant=sky][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--label-sky-09,6 76 107));--mds-push-notification-item-icon-color:rgb(var(--label-sky-05,94 198 245))}:host([variant=sky][tone=text]){--mds-push-notification-item-icon-background-color:#0000;--mds-push-notification-item-icon-color:rgb(var(--label-sky-05,94 198 245))}:host([variant=aqua][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--label-aqua-05,7 203 237));--mds-push-notification-item-icon-color:rgb(var(--label-aqua-10,2 65 76))}:host([variant=aqua]),:host([variant=aqua][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--label-aqua-09,3 77 90));--mds-push-notification-item-icon-color:rgb(var(--label-aqua-05,7 203 237))}:host([variant=aqua][tone=text]){--mds-push-notification-item-icon-background-color:#0000;--mds-push-notification-item-icon-color:rgb(var(--label-aqua-05,7 203 237))}:host([variant=green][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--label-green-05,37 213 102));--mds-push-notification-item-icon-color:rgb(var(--label-green-10,12 68 33))}:host([variant=green]),:host([variant=green][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--label-green-09,14 81 39));--mds-push-notification-item-icon-color:rgb(var(--label-green-05,37 213 102))}:host([variant=green][tone=text]){--mds-push-notification-item-icon-background-color:#0000;--mds-push-notification-item-icon-color:rgb(var(--label-green-05,37 213 102))}:host([variant=lime][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--label-lime-05,134 207 22));--mds-push-notification-item-icon-color:rgb(var(--label-lime-10,43 66 7))}:host([variant=lime]),:host([variant=lime][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--label-lime-09,51 79 8));--mds-push-notification-item-icon-color:rgb(var(--label-lime-05,134 207 22))}:host([variant=lime][tone=text]){--mds-push-notification-item-icon-background-color:#0000;--mds-push-notification-item-icon-color:rgb(var(--label-lime-05,134 207 22))}:host([variant=yellow][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--label-yellow-05,234 179 8));--mds-push-notification-item-icon-color:rgb(var(--label-yellow-10,75 57 3))}:host([variant=yellow]),:host([variant=yellow][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--label-yellow-09,89 68 3));--mds-push-notification-item-icon-color:rgb(var(--label-yellow-05,234 179 8))}:host([variant=yellow][tone=text]){--mds-push-notification-item-icon-background-color:#0000;--mds-push-notification-item-icon-color:rgb(var(--label-yellow-05,234 179 8))}:host([variant=error][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--status-error-05,250 165 160));--mds-push-notification-item-icon-color:rgb(var(--status-error-10,115 0 0))}:host([variant=error]),:host([variant=error][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--status-error-09,135 0 14));--mds-push-notification-item-icon-color:rgb(var(--status-error-05,250 165 160))}:host([variant=error][tone=text]){--mds-push-notification-item-icon-background-color:#0000;--mds-push-notification-item-icon-color:rgb(var(--status-error-05,250 165 160))}:host([variant=warning][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--status-warning-05,237 177 0));--mds-push-notification-item-icon-color:rgb(var(--status-warning-10,77 57 0))}:host([variant=warning]),:host([variant=warning][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--status-warning-09,90 67 0));--mds-push-notification-item-icon-color:rgb(var(--status-warning-05,237 177 0))}:host([variant=warning][tone=text]){--mds-push-notification-item-icon-background-color:#0000;--mds-push-notification-item-icon-color:rgb(var(--status-warning-05,237 177 0))}:host([variant=success][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--status-success-05,107 206 147));--mds-push-notification-item-icon-color:rgb(var(--status-success-10,0 69 0))}:host([variant=success]),:host([variant=success][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--status-success-09,0 82 9));--mds-push-notification-item-icon-color:rgb(var(--status-success-05,107 206 147))}:host([variant=success][tone=text]){--mds-push-notification-item-icon-background-color:#0000;--mds-push-notification-item-icon-color:rgb(var(--status-success-05,107 206 147))}:host([variant=info][tone=strong]){--mds-push-notification-item-icon-background-color:rgb(var(--status-info-05,112 198 234));--mds-push-notification-item-icon-color:rgb(var(--status-info-10,0 61 103))}:host([variant=info]),:host([variant=info][tone=weak]){--mds-push-notification-item-icon-background-color:rgb(var(--status-info-09,0 73 116));--mds-push-notification-item-icon-color:rgb(var(--status-info-05,112 198 234))}:host([variant=info][tone=text]){--mds-push-notification-item-icon-background-color:#0000;--mds-push-notification-item-icon-color:rgb(var(--status-info-05,112 198 234))}@media (prefers-reduced-motion:reduce){:host(:not([pref-animation])),:host([pref-animation=system]){--private-push-notification-item-duration:0s}}@media (prefers-color-scheme:dark){:host(:not([pref-theme])),:host([pref-theme=system]:not([pref-theme-scheme=light])){--mds-push-notifications-shadow:var(--shadow-outline) inset;background-color:rgb(var(--tone-neutral-09,76 76 76))}}@media (prefers-contrast:more){:host(:not([pref-contrast])),:host([pref-contrast=system]){--mds-push-notification-item-shadow:var(--shadow-outline-strong-50) inset;color:rgb(var(--tone-neutral-01,255 255 255))}}`;
 
-dayjs.extend(relativeTime);
 const MdsPushNotificationItem = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
@@ -184,9 +184,9 @@ const MdsPushNotificationItem = class {
          */
         this.dateFormat = 'timeago';
         /**
-         * Specifies if the component is dismissable or not, it should be set to true by default is used with it's parent component `mds-push-notification-items`
+         * Specifies if the component is dismissable; when set, a dismiss button is shown.
          */
-        this.deletable = true;
+        this.deletable = false;
         /**
          * Specifies the message of the component
          */
@@ -204,17 +204,42 @@ const MdsPushNotificationItem = class {
             this.closedEvent.emit();
         };
     }
+    /**
+     * Updates the component's texts to the locale currently set on the host element.
+     */
     async updateLang() {
         this.language = this.t.lang(this.host);
     }
+    connectedCallback() {
+        this.unsubscribePrefAnimation = preference.subscribePreference('animation', (value) => {
+            this.prefAnimation = value;
+        });
+        this.unsubscribePrefContrast = preference.subscribePreference('contrast', (value) => {
+            this.prefContrast = value;
+        });
+        this.unsubscribePrefTheme = preference.subscribePreference('theme', (value) => {
+            this.prefTheme = value;
+        });
+        this.unsubscribePrefThemeScheme = preference.subscribePreference('theme-scheme', (value) => {
+            this.prefThemeScheme = value;
+        });
+    }
+    disconnectedCallback() {
+        var _a, _b, _c, _d;
+        (_a = this.unsubscribePrefAnimation) === null || _a === void 0 ? void 0 : _a.call(this);
+        (_b = this.unsubscribePrefContrast) === null || _b === void 0 ? void 0 : _b.call(this);
+        (_c = this.unsubscribePrefTheme) === null || _c === void 0 ? void 0 : _c.call(this);
+        (_d = this.unsubscribePrefThemeScheme) === null || _d === void 0 ? void 0 : _d.call(this);
+    }
     componentDidLoad() {
         this.handleDeletableChange(this.deletable);
     }
     componentWillLoad() {
         var _a;
+        dayjs.extend(relativeTime);
         this.hasActions = this.host.querySelector(':scope > [slot="action"]') !== null;
         this.hasBadge = this.host.querySelector(':scope > [slot="badge"]') !== null;
-        if (this.datetime) {
+        if (this.datetime !== undefined && this.datetime !== '') {
             this.datetime = date.sanitizeISO8601Date((_a = this.datetime) === null || _a === void 0 ? void 0 : _a.toString());
         }
         this.t.lang(this.host);
@@ -242,9 +267,9 @@ const MdsPushNotificationItem = class {
     }
     render() {
         var _a;
-        return (index.h(index.Host, { key: 'cef1482e9e16dcc52b6fc255c7392f575f0c1772' }, ((_a = this.icon) !== null && _a !== void 0 ? _a : this.preview === 'avatar') && (index.h("mds-avatar", { key: '0bfdb9ecf0fa36599c981aa778a02f73d0b80a32', class: "avatar", icon: this.icon, initials: this.initials, part: "avatar", src: this.src, tone: this.tone, variant: this.variant })), this.src && this.preview !== 'avatar' && (index.h("mds-img", { key: '719fe7dae8dc94021f0efd96c50b86b614572aca', class: "picture", part: "picture", src: this.src })), index.h("div", { key: 'a5ead1ed262e19ed60a37f23cce81a29889daedb', class: "content", part: "content" }, index.h("div", { key: 'a747e13b1fcb292b193db53ebf2c6174eac99fd9', class: "header" }, index.h("div", { key: '4a402d86378e9b5269dc4ffbbc25a1b0b54be36d', class: "infos" }, this.hasBadge && (index.h("div", { key: '40eb647711cb32839e9ee5cec391c800b5a8d983' }, index.h("slot", { key: 'f73ddcfd20ebb75f62a0ff3b7dfe5dfa0a9477a4', name: "badge" }))), this.subject && (index.h("mds-text", { key: 'aab0df869115c44eecc4d5fa180210392c72e1e1', class: "subject", typography: "h6", variant: "title", truncate: "all" }, this.subject))), this.datetime && (index.h("mds-text", { key: 'e93ee1684aeb8a4df9203a9b416df5181bc2342f', class: "time", typography: "option" }, this.dateFormat === 'timeago'
+        return (index.h(index.Host, { key: 'f88bb513bce95850a6047ac54f4dcfa63978363e', "pref-animation": this.prefAnimation, "pref-contrast": this.prefContrast, "pref-theme": this.prefTheme, "pref-theme-scheme": this.prefThemeScheme }, ((_a = this.icon) !== null && _a !== void 0 ? _a : this.preview === 'avatar') && (index.h("mds-avatar", { key: 'f8cad6d2fae73aff043e52fef79075abede6df96', class: "avatar", icon: this.icon, initials: this.initials, part: "avatar", src: this.src, tone: this.tone, variant: this.variant })), this.src && this.preview !== 'avatar' && (index.h("mds-img", { key: '72f96d01bc55784f8c2c35e62da263e62d32a00b', class: "picture", part: "picture", src: this.src })), index.h("div", { key: 'fb71c722dec7dd0216b415c1469cd4af03be5d4e', class: "content", part: "content" }, index.h("div", { key: '6f6b128e2c72fa831a5603f05d3cb6141fdaec89', class: "header" }, index.h("div", { key: '8381e70ddf528dda33765863ed8e6c67af6afaab', class: "infos" }, this.hasBadge && (index.h("div", { key: '21882a488827403f500705436c23e4795aeea948' }, index.h("slot", { key: '262d5394fae6e68f5556f561ecff8582e34b6b9d', name: "badge" }))), this.subject && (index.h("mds-text", { key: '730388a07d901d1e742fb528db3e1bd2963fbd19', class: "subject", typography: "h6", variant: "title", truncate: "all" }, this.subject))), this.datetime && (index.h("mds-text", { key: '96cb3254f601083ce3f96b9d5fd635e9e92fc857', class: "time", typography: "option" }, this.dateFormat === 'timeago'
             ? dayjs(this.datetime).fromNow()
-            : dayjs(this.datetime).format(this.dateFormat)))), index.h("mds-text", { key: '4554d9ae482fefec3899d740d74227657d612fd5', class: "message", truncate: "all", typography: "caption", variant: "info" }, this.message), this.hasActions && (index.h("div", { key: 'ddc27141fb944f8ecf6c1e72082c9fc2428edb4e', class: "actions", part: "actions" }, index.h("slot", { key: '315db21f5d2f6e3f43849c64de4407422dfafed2', name: "action" })))), this.deletable && (index.h("mds-button", { key: '25190761bcc0b1afb4ae807bc6e880edd98d7dcc', class: "close-button", variant: "dark", tone: "text", title: this.t.get('dismiss'), icon: cancel.miBaselineCancel, onClick: this.onClickClose.bind(this) }))));
+            : dayjs(this.datetime).format(this.dateFormat)))), index.h("mds-text", { key: 'd4fa3358afbde90b5416a08cbf117fbd256eb8c5', class: "message", truncate: "all", typography: "caption", variant: "info" }, this.message), this.hasActions && (index.h("div", { key: '83b296d9cdadfe0a9e483f2d48b4b35ea3d40338', class: "actions", part: "actions" }, index.h("slot", { key: '91e29832a0de8bad5f5c37528dc2c1e3e09eeebf', name: "action" })))), this.deletable && (index.h("mds-button", { key: 'e4f30edac40e73e6ea41d9d48391b9d9d077f118', class: "close-button", variant: "dark", tone: "text", title: this.t.get('dismiss'), icon: cancel.miBaselineCancel, onClick: this.onClickClose }))));
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {