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

package/dist/esm/mds-entity.entry.js

@@ -1,6 +1,6 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-BfAC4pqU.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-CAd5312P.js';
 
-const mdsEntityCss = "@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-entity-background:rgb(var(--tone-neutral,0 0 0));--mds-entity-color:rgb(var(--tone-neutral-02,244 244 244));--mds-entity-detail-color:rgb(var(--tone-neutral-03,233 233 233));--mds-entity-icon-background:rgb(var(--label-blue-09,7 40 196));--mds-entity-icon-radius:var(--radius-md,12px);--mds-entity-icon-color:rgb(var(--label-blue-04,196 206 253))}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),:is(mds-avatar,mds-spinner):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-entity-background:rgb(var(--tone-neutral,0 0 0));--mds-entity-color:rgb(var(--tone-neutral-02,244 244 244));--mds-entity-detail-color:rgb(var(--tone-neutral-03,233 233 233));--mds-entity-icon-background:rgb(var(--label-blue-09,7 40 196));--mds-entity-icon-radius:var(--radius-md,12px);--mds-entity-icon-color:rgb(var(--label-blue-04,196 206 253));align-items:stretch;background-color:var(--mds-entity-background,rgb(var(--tone-neutral,0 0 0)));border-radius:var(--radius-lg,16px);-webkit-box-shadow:var(--shadow-outline-weak,0 0 0 1px #0000000d,0 1px 2px 0 #0000000d);box-shadow:var(--shadow-outline-weak,0 0 0 1px #0000000d,0 1px 2px 0 #0000000d);color:var(--mds-entity-color,rgb(var(--tone-neutral-02,244 244 244)));display:flex;gap:calc(var(--spacing,.0025rem)*200);padding:calc(var(--spacing,.0025rem)*200)}.delete,.preview,.spinner{border-radius:var(--radius-md,12px);flex-shrink:0;width:calc(var(--spacing,.0025rem)*1100)}.preview{--mds-avatar-radius:var(--mds-entity-icon-radius,var(--radius-md,12px))}.preview:not([variant]){--mds-avatar-color:var(--mds-entity-icon-color,rgb(var(--label-blue-04,196 206 253)));--mds-avatar-background-color:var(--mds-entity-icon-background,rgb(var(--label-blue-09,7 40 196)))}.preview,.spinner{align-items:center;aspect-ratio:1;aspect-ratio:var(--aspect-square,1/1);display:inline-flex;justify-content:center}.spinner{background-color:#0000;display:none;fill:var(--mds-entity-icon-color,rgb(var(--label-blue-04,196 206 253)))}:host([await]:not([await=false])) .spinner{display:inline-flex}mds-spinner{height:calc(var(--spacing,.0025rem)*900);width:calc(var(--spacing,.0025rem)*900)}.infos{display:flex;flex-direction:column;flex-grow:1;gap:calc(var(--spacing,.0025rem)*0);justify-content:center;min-width:0;white-space:nowrap}.details{align-items:baseline;color:var(--mds-entity-detail-color,rgb(var(--tone-neutral-03,233 233 233)));display:flex;gap:calc(var(--spacing,.0025rem)*100)}.actions{align-items:center;display:flex;gap:calc(var(--spacing,.0025rem)*200)}::slotted([slot=action]){aspect-ratio:1;aspect-ratio:var(--aspect-square,1/1);height:auto;width:calc(var(--spacing,.0025rem)*1100)}::slotted(*){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.title{display:flex;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host-context(:root.pref-contrast-more){--mds-entity-background:rgb(var(--tone-neutral,0 0 0));--mds-entity-color:rgb(var(--tone-neutral-01,255 255 255));--mds-entity-detail-color:rgb(var(--tone-neutral-02,244 244 244));--mds-entity-icon-background:rgb(var(--label-blue-08,42 77 247));--mds-entity-icon-color:rgb(var(--label-blue-03,218 224 254));--mds-entity-shadow:var(--shadow-outline-50)}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){--mds-entity-shadow:var(--shadow-outline)}@media (prefers-contrast:more){:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))){--mds-entity-background:rgb(var(--tone-neutral,0 0 0));--mds-entity-color:rgb(var(--tone-neutral-01,255 255 255));--mds-entity-detail-color:rgb(var(--tone-neutral-02,244 244 244));--mds-entity-icon-background:rgb(var(--label-blue-08,42 77 247));--mds-entity-icon-color:rgb(var(--label-blue-03,218 224 254));--mds-entity-shadow:var(--shadow-outline-50)}}@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-entity-shadow:var(--shadow-outline)}}";
+const mdsEntityCss = () => `@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-entity-background:rgb(var(--tone-neutral,0 0 0));--mds-entity-color:rgb(var(--tone-neutral-02,244 244 244));--mds-entity-detail-color:rgb(var(--tone-neutral-03,233 233 233));--mds-entity-icon-background:rgb(var(--label-blue-09,7 40 196));--mds-entity-icon-radius:var(--radius-md,12px);--mds-entity-icon-color:rgb(var(--label-blue-04,196 206 253))}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),:is(mds-avatar,mds-spinner):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-entity-background:rgb(var(--tone-neutral,0 0 0));--mds-entity-color:rgb(var(--tone-neutral-02,244 244 244));--mds-entity-detail-color:rgb(var(--tone-neutral-03,233 233 233));--mds-entity-icon-background:rgb(var(--label-blue-09,7 40 196));--mds-entity-icon-radius:var(--radius-md,12px);--mds-entity-icon-color:rgb(var(--label-blue-04,196 206 253));align-items:stretch;background-color:var(--mds-entity-background,rgb(var(--tone-neutral,0 0 0)));border-radius:var(--radius-lg,16px);-webkit-box-shadow:var(--shadow-outline-weak,0 0 0 1px #0000000d,0 1px 2px 0 #0000000d);box-shadow:var(--shadow-outline-weak,0 0 0 1px #0000000d,0 1px 2px 0 #0000000d);color:var(--mds-entity-color,rgb(var(--tone-neutral-02,244 244 244)));display:flex;gap:calc(var(--spacing,.0025rem)*200);padding:calc(var(--spacing,.0025rem)*200)}.delete,.preview,.spinner{border-radius:var(--radius-md,12px);flex-shrink:0;width:calc(var(--spacing,.0025rem)*1100)}.preview{--mds-avatar-radius:var(--mds-entity-icon-radius,var(--radius-md,12px))}.preview:not([variant]){--mds-avatar-color:var(--mds-entity-icon-color,rgb(var(--label-blue-04,196 206 253)));--mds-avatar-background-color:var(--mds-entity-icon-background,rgb(var(--label-blue-09,7 40 196)))}.preview,.spinner{align-items:center;aspect-ratio:var(--aspect-square,1/1);display:inline-flex;justify-content:center}.spinner{background-color:#0000;display:none;fill:var(--mds-entity-icon-color,rgb(var(--label-blue-04,196 206 253)))}:host([await]:not([await=false])) .spinner{display:inline-flex}mds-spinner{height:calc(var(--spacing,.0025rem)*900);width:calc(var(--spacing,.0025rem)*900)}.infos{display:flex;flex-direction:column;flex-grow:1;gap:calc(var(--spacing,.0025rem)*0);justify-content:center;min-width:0;white-space:nowrap}.details{align-items:baseline;color:var(--mds-entity-detail-color,rgb(var(--tone-neutral-03,233 233 233)));display:flex;gap:calc(var(--spacing,.0025rem)*100)}.actions{align-items:center;display:flex;gap:calc(var(--spacing,.0025rem)*200)}::slotted([slot=action]){aspect-ratio:var(--aspect-square,1/1);height:auto;width:calc(var(--spacing,.0025rem)*1100)}::slotted(*){overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.title{display:flex;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}:host-context(:root.pref-contrast-more){--mds-entity-background:rgb(var(--tone-neutral,0 0 0));--mds-entity-color:rgb(var(--tone-neutral-01,255 255 255));--mds-entity-detail-color:rgb(var(--tone-neutral-02,244 244 244));--mds-entity-icon-background:rgb(var(--label-blue-08,42 77 247));--mds-entity-icon-color:rgb(var(--label-blue-03,218 224 254));--mds-entity-shadow:var(--shadow-outline-50)}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){--mds-entity-shadow:var(--shadow-outline)}@media (prefers-contrast:more){:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))){--mds-entity-background:rgb(var(--tone-neutral,0 0 0));--mds-entity-color:rgb(var(--tone-neutral-01,255 255 255));--mds-entity-detail-color:rgb(var(--tone-neutral-02,244 244 244));--mds-entity-icon-background:rgb(var(--label-blue-08,42 77 247));--mds-entity-icon-color:rgb(var(--label-blue-03,218 224 254));--mds-entity-shadow:var(--shadow-outline-50)}}@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-entity-shadow:var(--shadow-outline)}}`;
 
 const MdsEntity = class {
     constructor(hostRef) {
@@ -31,6 +31,6 @@ const MdsEntity = class {
     }
     get hostElement() { return getElement(this); }
 };
-MdsEntity.style = mdsEntityCss;
+MdsEntity.style = mdsEntityCss();
 
 export { MdsEntity as mds_entity };

package/dist/esm/mds-file-preview.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-BfAC4pqU.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-CAd5312P.js';
 import { m as miBaselineCancel } from './cancel-BJ8rpzfj.js';
 import { c as clsx } from './clsx-ChV9xqsO.js';
 import { f as fileDescriptionLocaleIt, a as fileDescriptionLocaleEs, b as fileDescriptionLocaleEn, c as fileDescriptionLocaleEl, g as getExtensionInfos, d as getSuffix, e as getFormatsVariant } from './locale.it-Dj8sWDfj.js';
@@ -218,7 +218,7 @@ var localeIt = {
 	remove: remove
 };
 
-const mdsFilePreviewCss = "@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-file-preview-background-color:rgb(var(--tone-neutral,0 0 0));--mds-file-preview-border-radius:var(--radius-lg,16px);--mds-file-preview-color:rgb(var(--tone-neutral-03,233 233 233));--mds-file-preview-icon-background:inherit;--mds-file-preview-icon-color:var(--mds-file-preview-color,rgb(var(--tone-neutral-03,233 233 233)))}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),:is(mds-badge,mds-button,mds-icon,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}:host{--mds-file-preview-background-color:rgb(var(--tone-neutral,0 0 0));--mds-file-preview-border-radius:var(--radius-2xl,24px);--mds-file-preview-color:rgb(var(--tone-neutral-03,233 233 233));--mds-file-preview-icon-background:inherit;--mds-file-preview-icon-color:var(--mds-file-preview-color,rgb(var(--tone-neutral-03,233 233 233)));background-color:var(--mds-file-preview-background-color,rgb(var(--tone-neutral,0 0 0)));border-radius:var(--mds-file-preview-border-radius,var(--radius-lg,16px));-webkit-box-shadow:var(--shadow-box-md,#0000000f 0 0 0 1px,#00000008 0 1px 1px -.5px,#0000000a 0 2px 2px -1px,#0000000a 0 3px 3px -1.5px,#00000008 0 5px 5px -2.5px,#00000008 0 10px 10px -5px,#00000008 0 24px 24px -8px);box-shadow:var(--shadow-box-md,#0000000f 0 0 0 1px,#00000008 0 1px 1px -.5px,#0000000a 0 2px 2px -1px,#0000000a 0 3px 3px -1.5px,#00000008 0 5px 5px -2.5px,#00000008 0 10px 10px -5px,#00000008 0 24px 24px -8px);corner-shape:var(--magma-corner-shape,round);align-items:stretch;fill:var(--mds-file-preview-color,rgb(var(--tone-neutral-03,233 233 233)));-ms-flex-pack:stretch;display:flex;justify-content:stretch;overflow:hidden;position:relative}.card{display:grid;gap:calc(var(--spacing,.0025rem)*200);grid-template-columns:repeat(1,minmax(1px,100%));padding:calc(var(--spacing,.0025rem)*400)}.card,.preview{corner-shape:inherit;width:100%}.preview{aspect-ratio:1;aspect-ratio:var(--aspect-square,1/1);background-color:var(--mds-file-preview-icon-background,inherit);border-radius:calc(var(--mds-file-preview-border-radius,var(--radius-lg,16px)) - var(--spacing,.0025rem)*200);box-sizing:border-box;color:var(--mds-file-preview-color,rgb(var(--tone-neutral-03,233 233 233)));fill:var(--mds-file-preview-icon-color,var(--mds-file-preview-color,rgb(var(--tone-neutral-03,233 233 233))))}.preview--image{filter:brightness(.975);padding:0!important}.preview--icon,.preview--status{align-items:center;display:flex;flex-direction:column;justify-content:center}.preview--status{gap:calc(var(--spacing,.0025rem)*200);padding:calc(var(--spacing,.0025rem)*400)}.icon{height:calc(var(--spacing,.0025rem)*1200);width:calc(var(--spacing,.0025rem)*1200)}.message{text-align:center}.action-delete{background-color:var(--mds-file-preview-background-color,rgb(var(--tone-neutral,0 0 0)));position:absolute;right:0;top:0;z-index:10}.infos{align-items:baseline;display:flex;gap:calc(var(--spacing,.0025rem)*200)}.suffix{flex-shrink:0}.infos--has-file-size{justify-content:space-between}.file-name{--mds-text-line-clamp:2}:host([format=archive]),:host([format=executable]){--mds-file-preview-color:rgb(var(--label-amaranth-04,251 192 203));--mds-file-preview-icon-background:rgb(var(--label-amaranth-10,114 7 25));--mds-file-preview-icon-color:rgb(var(--label-amaranth-04,251 192 203))}:host([format=attachment]){--mds-file-preview-color:rgb(var(--tone-neutral-04,218 218 218));--mds-file-preview-icon-background:rgb(var(--tone-neutral-10,60 60 60));--mds-file-preview-icon-color:rgb(var(--tone-neutral-04,218 218 218))}:host([format=audio]),:host([format=video]){--mds-file-preview-color:rgb(var(--label-violet-04,216 200 252));--mds-file-preview-icon-background:rgb(var(--label-violet-10,57 9 165));--mds-file-preview-icon-color:rgb(var(--label-violet-04,216 200 252))}:host([format=code]),:host([format=data]),:host([format=markup]){--mds-file-preview-color:rgb(var(--label-yellow-04,248 202 60));--mds-file-preview-icon-background:rgb(var(--label-yellow-10,75 57 3));--mds-file-preview-icon-color:rgb(var(--label-yellow-04,248 202 60))}:host([format=certificate]),:host([format=document]){--mds-file-preview-color:rgb(var(--label-orange-04,252 196 158));--mds-file-preview-icon-background:rgb(var(--label-orange-10,99 42 3));--mds-file-preview-icon-color:rgb(var(--label-orange-04,252 196 158))}:host([format=email]),:host([format=text]){--mds-file-preview-color:rgb(var(--label-blue-04,196 206 253));--mds-file-preview-icon-background:rgb(var(--label-blue-10,6 34 166));--mds-file-preview-icon-color:rgb(var(--label-blue-04,196 206 253))}:host([format=image]){--mds-file-preview-color:rgb(var(--label-green-04,113 230 156));--mds-file-preview-icon-background:rgb(var(--label-green-10,12 68 33));--mds-file-preview-icon-color:rgb(var(--label-green-04,113 230 156))}:host([format=slide]){--mds-file-preview-color:rgb(var(--label-orchid-04,248 192 220));--mds-file-preview-icon-background:rgb(var(--label-orchid-10,111 12 61));--mds-file-preview-icon-color:rgb(var(--label-orchid-04,248 192 220))}:host([format=spreadsheet]){--mds-file-preview-color:rgb(var(--label-lime-04,148 229 25));--mds-file-preview-icon-background:rgb(var(--label-lime-10,43 66 7));--mds-file-preview-icon-color:rgb(var(--label-lime-04,148 229 25))}:host([format=vector]){--mds-file-preview-color:rgb(var(--label-aqua-04,81 225 250));--mds-file-preview-icon-background:rgb(var(--label-aqua-10,2 65 76));--mds-file-preview-icon-color:rgb(var(--label-aqua-04,81 225 250))}:host([variant=primary][message]){--mds-file-preview-icon-background:rgb(var(--variant-primary-09,0 58 168));--mds-file-preview-icon-color:rgb(var(--variant-primary-04,184 208 255))}:host([variant=info][message]){--mds-file-preview-icon-background:rgb(var(--status-info-09,0 73 116));--mds-file-preview-icon-color:rgb(var(--status-info-04,159 216 241));--mds-file-preview-color:rgb(var(--status-info-03,198 231 247))}:host([variant=success][message]){--mds-file-preview-icon-background:rgb(var(--status-success-09,0 82 9));--mds-file-preview-icon-color:rgb(var(--status-success-04,158 222 181));--mds-file-preview-color:rgb(var(--status-success-03,196 235 209))}:host([variant=warning][message]){--mds-file-preview-icon-background:rgb(var(--status-warning-09,90 67 0));--mds-file-preview-icon-color:rgb(var(--status-warning-04,255 200 33));--mds-file-preview-color:rgb(var(--status-warning-03,255 223 129))}:host([variant=error][message]){--mds-file-preview-icon-background:rgb(var(--status-error-09,135 0 14));--mds-file-preview-icon-color:rgb(var(--status-error-04,254 193 189));--mds-file-preview-color:rgb(var(--status-error-03,255 217 214))}:host([variant=amaranth][message]){--mds-file-preview-icon-background:rgb(var(--label-amaranth-09,135 8 30));--mds-file-preview-icon-color:rgb(var(--label-amaranth-04,251 192 203));--mds-file-preview-color:rgb(var(--label-amaranth-03,253 217 223))}:host([variant=aqua][message]){--mds-file-preview-icon-background:rgb(var(--label-aqua-09,3 77 90));--mds-file-preview-icon-color:rgb(var(--label-aqua-04,81 225 250));--mds-file-preview-color:rgb(var(--label-aqua-03,158 238 252))}:host([variant=blue][message]){--mds-file-preview-icon-background:rgb(var(--label-blue-09,7 40 196));--mds-file-preview-icon-color:rgb(var(--label-blue-04,196 206 253));--mds-file-preview-color:rgb(var(--label-blue-03,218 224 254))}:host([variant=green][message]){--mds-file-preview-icon-background:rgb(var(--label-green-09,14 81 39));--mds-file-preview-icon-color:rgb(var(--label-green-04,113 230 156));--mds-file-preview-color:rgb(var(--label-green-03,173 241 198))}:host([variant=lime][message]){--mds-file-preview-icon-background:rgb(var(--label-lime-09,51 79 8));--mds-file-preview-icon-color:rgb(var(--label-lime-04,148 229 25));--mds-file-preview-color:rgb(var(--label-lime-03,193 241 122))}:host([variant=orange][message]){--mds-file-preview-icon-background:rgb(var(--label-orange-09,116 49 3));--mds-file-preview-icon-color:rgb(var(--label-orange-04,252 196 158));--mds-file-preview-color:rgb(var(--label-orange-03,253 219 196))}:host([variant=orchid][message]){--mds-file-preview-icon-background:rgb(var(--label-orchid-09,131 14 71));--mds-file-preview-icon-color:rgb(var(--label-orchid-04,248 192 220));--mds-file-preview-color:rgb(var(--label-orchid-03,251 216 234))}:host([variant=sky][message]){--mds-file-preview-icon-background:rgb(var(--label-sky-09,6 76 107));--mds-file-preview-icon-color:rgb(var(--label-sky-04,148 217 249));--mds-file-preview-color:rgb(var(--label-sky-03,191 232 251))}:host([variant=violet][message]){--mds-file-preview-icon-background:rgb(var(--label-violet-09,67 11 195));--mds-file-preview-icon-color:rgb(var(--label-violet-04,216 200 252));--mds-file-preview-color:rgb(var(--label-violet-03,231 221 253))}:host([variant=yellow][message]){--mds-file-preview-icon-background:rgb(var(--label-yellow-09,89 68 3));--mds-file-preview-icon-color:rgb(var(--label-yellow-04,248 202 60));--mds-file-preview-color:rgb(var(--label-yellow-03,251 224 142))}:host-context(:root.pref-contrast-more):host([variant=primary][message]){--mds-file-preview-icon-background:rgb(var(--variant-primary-10,0 49 142));--mds-file-preview-icon-color:rgb(var(--variant-primary-02,230 239 255));--mds-file-preview-color:rgb(var(--variant-primary-01,242 246 255))}:host-context(:root.pref-contrast-more):host([variant=info][message]){--mds-file-preview-icon-background:rgb(var(--status-info-10,0 61 103));--mds-file-preview-icon-color:rgb(var(--status-info-02,222 242 250));--mds-file-preview-color:rgb(var(--status-info-01,237 248 253))}:host-context(:root.pref-contrast-more):host([variant=success][message]){--mds-file-preview-icon-background:rgb(var(--status-success-10,0 69 0));--mds-file-preview-icon-color:rgb(var(--status-success-02,222 244 228));--mds-file-preview-color:rgb(var(--status-success-01,237 249 241))}:host-context(:root.pref-contrast-more):host([variant=warning][message]){--mds-file-preview-icon-background:rgb(var(--status-warning-10,77 57 0));--mds-file-preview-icon-color:rgb(var(--status-warning-02,255 237 185));--mds-file-preview-color:rgb(var(--status-warning-01,255 246 217))}:host-context(:root.pref-contrast-more):host([variant=error][message]){--mds-file-preview-icon-background:rgb(var(--status-error-10,115 0 0));--mds-file-preview-icon-color:rgb(var(--status-error-02,255 234 231));--mds-file-preview-color:rgb(var(--status-error-01,255 243 242))}:host-context(:root.pref-contrast-more):host([variant=amaranth][message]){--mds-file-preview-icon-background:rgb(var(--label-amaranth-10,114 7 25));--mds-file-preview-icon-color:rgb(var(--label-amaranth-02,254 233 237));--mds-file-preview-color:rgb(var(--label-amaranth-01,254 243 245))}:host-context(:root.pref-contrast-more):host([variant=aqua][message]){--mds-file-preview-icon-background:rgb(var(--label-aqua-10,2 65 76));--mds-file-preview-icon-color:rgb(var(--label-aqua-02,203 246 254));--mds-file-preview-color:rgb(var(--label-aqua-01,229 251 254))}:host-context(:root.pref-contrast-more):host([variant=blue][message]){--mds-file-preview-icon-background:rgb(var(--label-blue-10,6 34 166));--mds-file-preview-icon-color:rgb(var(--label-blue-02,234 238 254));--mds-file-preview-color:rgb(var(--label-blue-01,244 245 255))}:host-context(:root.pref-contrast-more):host([variant=green][message]){--mds-file-preview-icon-background:rgb(var(--label-green-10,12 68 33));--mds-file-preview-icon-color:rgb(var(--label-green-02,211 247 224));--mds-file-preview-color:rgb(var(--label-green-01,231 251 239))}:host-context(:root.pref-contrast-more):host([variant=lime][message]){--mds-file-preview-icon-background:rgb(var(--label-lime-10,43 66 7));--mds-file-preview-icon-color:rgb(var(--label-lime-02,223 247 185));--mds-file-preview-color:rgb(var(--label-lime-01,238 251 217))}:host-context(:root.pref-contrast-more):host([variant=orange][message]){--mds-file-preview-icon-background:rgb(var(--label-orange-10,99 42 3));--mds-file-preview-icon-color:rgb(var(--label-orange-02,254 235 222));--mds-file-preview-color:rgb(var(--label-orange-01,255 244 237))}:host-context(:root.pref-contrast-more):host([variant=orchid][message]){--mds-file-preview-icon-background:rgb(var(--label-orchid-10,111 12 61));--mds-file-preview-icon-color:rgb(var(--label-orchid-02,253 233 243));--mds-file-preview-color:rgb(var(--label-orchid-01,254 243 249))}:host-context(:root.pref-contrast-more):host([variant=sky][message]){--mds-file-preview-icon-background:rgb(var(--label-sky-10,5 63 90));--mds-file-preview-icon-color:rgb(var(--label-sky-02,219 242 253));--mds-file-preview-color:rgb(var(--label-sky-01,236 248 254))}:host-context(:root.pref-contrast-more):host([variant=violet][message]){--mds-file-preview-icon-background:rgb(var(--label-violet-10,57 9 165));--mds-file-preview-icon-color:rgb(var(--label-violet-02,241 235 254));--mds-file-preview-color:rgb(var(--label-violet-01,248 244 254))}:host-context(:root.pref-contrast-more):host([variant=yellow][message]){--mds-file-preview-icon-background:rgb(var(--label-yellow-10,75 57 3));--mds-file-preview-icon-color:rgb(var(--label-yellow-02,253 238 190));--mds-file-preview-color:rgb(var(--label-yellow-01,254 246 221))}:host-context(:root.pref-animation-reduce){transition-duration:0s}:host-context(:root.pref-animation-reduce) .preview{transition-duration:0s}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){-webkit-box-shadow:var(--shadow-outline);box-shadow:var(--shadow-outline)}:host-context(:root.pref-contrast-more){--mds-file-preview-color:rgb(var(--tone-neutral-01,255 255 255));-webkit-box-shadow:var(--shadow-outline-50);box-shadow:var(--shadow-outline-50)}@media (prefers-contrast:more){:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=primary][message]){--mds-file-preview-icon-background:rgb(var(--variant-primary-10,0 49 142));--mds-file-preview-icon-color:rgb(var(--variant-primary-02,230 239 255));--mds-file-preview-color:rgb(var(--variant-primary-01,242 246 255))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=info][message]){--mds-file-preview-icon-background:rgb(var(--status-info-10,0 61 103));--mds-file-preview-icon-color:rgb(var(--status-info-02,222 242 250));--mds-file-preview-color:rgb(var(--status-info-01,237 248 253))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=success][message]){--mds-file-preview-icon-background:rgb(var(--status-success-10,0 69 0));--mds-file-preview-icon-color:rgb(var(--status-success-02,222 244 228));--mds-file-preview-color:rgb(var(--status-success-01,237 249 241))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=warning][message]){--mds-file-preview-icon-background:rgb(var(--status-warning-10,77 57 0));--mds-file-preview-icon-color:rgb(var(--status-warning-02,255 237 185));--mds-file-preview-color:rgb(var(--status-warning-01,255 246 217))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=error][message]){--mds-file-preview-icon-background:rgb(var(--status-error-10,115 0 0));--mds-file-preview-icon-color:rgb(var(--status-error-02,255 234 231));--mds-file-preview-color:rgb(var(--status-error-01,255 243 242))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=amaranth][message]){--mds-file-preview-icon-background:rgb(var(--label-amaranth-10,114 7 25));--mds-file-preview-icon-color:rgb(var(--label-amaranth-02,254 233 237));--mds-file-preview-color:rgb(var(--label-amaranth-01,254 243 245))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=aqua][message]){--mds-file-preview-icon-background:rgb(var(--label-aqua-10,2 65 76));--mds-file-preview-icon-color:rgb(var(--label-aqua-02,203 246 254));--mds-file-preview-color:rgb(var(--label-aqua-01,229 251 254))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=blue][message]){--mds-file-preview-icon-background:rgb(var(--label-blue-10,6 34 166));--mds-file-preview-icon-color:rgb(var(--label-blue-02,234 238 254));--mds-file-preview-color:rgb(var(--label-blue-01,244 245 255))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=green][message]){--mds-file-preview-icon-background:rgb(var(--label-green-10,12 68 33));--mds-file-preview-icon-color:rgb(var(--label-green-02,211 247 224));--mds-file-preview-color:rgb(var(--label-green-01,231 251 239))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=lime][message]){--mds-file-preview-icon-background:rgb(var(--label-lime-10,43 66 7));--mds-file-preview-icon-color:rgb(var(--label-lime-02,223 247 185));--mds-file-preview-color:rgb(var(--label-lime-01,238 251 217))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=orange][message]){--mds-file-preview-icon-background:rgb(var(--label-orange-10,99 42 3));--mds-file-preview-icon-color:rgb(var(--label-orange-02,254 235 222));--mds-file-preview-color:rgb(var(--label-orange-01,255 244 237))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=orchid][message]){--mds-file-preview-icon-background:rgb(var(--label-orchid-10,111 12 61));--mds-file-preview-icon-color:rgb(var(--label-orchid-02,253 233 243));--mds-file-preview-color:rgb(var(--label-orchid-01,254 243 249))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=sky][message]){--mds-file-preview-icon-background:rgb(var(--label-sky-10,5 63 90));--mds-file-preview-icon-color:rgb(var(--label-sky-02,219 242 253));--mds-file-preview-color:rgb(var(--label-sky-01,236 248 254))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=violet][message]){--mds-file-preview-icon-background:rgb(var(--label-violet-10,57 9 165));--mds-file-preview-icon-color:rgb(var(--label-violet-02,241 235 254));--mds-file-preview-color:rgb(var(--label-violet-01,248 244 254))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=yellow][message]){--mds-file-preview-icon-background:rgb(var(--label-yellow-10,75 57 3));--mds-file-preview-icon-color:rgb(var(--label-yellow-02,253 238 190));--mds-file-preview-color:rgb(var(--label-yellow-01,254 246 221))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))){--mds-file-preview-color:rgb(var(--tone-neutral-01,255 255 255));-webkit-box-shadow:var(--shadow-outline-50);box-shadow:var(--shadow-outline-50)}}@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]))) .preview{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]))){-webkit-box-shadow:var(--shadow-outline);box-shadow:var(--shadow-outline)}}";
+const mdsFilePreviewCss = () => `@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-file-preview-background-color:rgb(var(--tone-neutral,0 0 0));--mds-file-preview-border-radius:var(--radius-lg,16px);--mds-file-preview-color:rgb(var(--tone-neutral-03,233 233 233));--mds-file-preview-icon-background:inherit;--mds-file-preview-icon-color:var(--mds-file-preview-color,rgb(var(--tone-neutral-03,233 233 233)))}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),:is(mds-badge,mds-button,mds-icon,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}:host{--mds-file-preview-background-color:rgb(var(--tone-neutral,0 0 0));--mds-file-preview-border-radius:var(--radius-2xl,24px);--mds-file-preview-color:rgb(var(--tone-neutral-03,233 233 233));--mds-file-preview-icon-background:inherit;--mds-file-preview-icon-color:var(--mds-file-preview-color,rgb(var(--tone-neutral-03,233 233 233)));background-color:var(--mds-file-preview-background-color,rgb(var(--tone-neutral,0 0 0)));border-radius:var(--mds-file-preview-border-radius,var(--radius-lg,16px));-webkit-box-shadow:var(--shadow-box-md,#0000000f 0 0 0 1px,#00000008 0 1px 1px -.5px,#0000000a 0 2px 2px -1px,#0000000a 0 3px 3px -1.5px,#00000008 0 5px 5px -2.5px,#00000008 0 10px 10px -5px,#00000008 0 24px 24px -8px);box-shadow:var(--shadow-box-md,#0000000f 0 0 0 1px,#00000008 0 1px 1px -.5px,#0000000a 0 2px 2px -1px,#0000000a 0 3px 3px -1.5px,#00000008 0 5px 5px -2.5px,#00000008 0 10px 10px -5px,#00000008 0 24px 24px -8px);corner-shape:var(--magma-corner-shape,round);align-items:stretch;fill:var(--mds-file-preview-color,rgb(var(--tone-neutral-03,233 233 233)));-ms-flex-pack:stretch;display:flex;justify-content:stretch;overflow:hidden;position:relative}.card{display:grid;gap:calc(var(--spacing,.0025rem)*200);grid-template-columns:repeat(1,minmax(1px,100%));padding:calc(var(--spacing,.0025rem)*400)}.card,.preview{corner-shape:inherit;width:100%}.preview{aspect-ratio:var(--aspect-square,1/1);background-color:var(--mds-file-preview-icon-background,inherit);border-radius:calc(var(--mds-file-preview-border-radius,var(--radius-lg,16px)) - var(--spacing,.0025rem)*200);box-sizing:border-box;color:var(--mds-file-preview-color,rgb(var(--tone-neutral-03,233 233 233)));fill:var(--mds-file-preview-icon-color,var(--mds-file-preview-color,rgb(var(--tone-neutral-03,233 233 233))))}.preview--image{filter:brightness(.975);padding:0!important}.preview--icon,.preview--status{align-items:center;display:flex;flex-direction:column;justify-content:center}.preview--status{gap:calc(var(--spacing,.0025rem)*200);padding:calc(var(--spacing,.0025rem)*400)}.icon{height:calc(var(--spacing,.0025rem)*1200);width:calc(var(--spacing,.0025rem)*1200)}.message{text-align:center}.action-delete{background-color:var(--mds-file-preview-background-color,rgb(var(--tone-neutral,0 0 0)));position:absolute;right:0;top:0;z-index:10}.infos{align-items:baseline;display:flex;gap:calc(var(--spacing,.0025rem)*200)}.suffix{flex-shrink:0}.infos--has-file-size{justify-content:space-between}.file-name{--mds-text-line-clamp:2}:host([format=archive]),:host([format=executable]){--mds-file-preview-color:rgb(var(--label-amaranth-04,251 192 203));--mds-file-preview-icon-background:rgb(var(--label-amaranth-10,114 7 25));--mds-file-preview-icon-color:rgb(var(--label-amaranth-04,251 192 203))}:host([format=attachment]){--mds-file-preview-color:rgb(var(--tone-neutral-04,218 218 218));--mds-file-preview-icon-background:rgb(var(--tone-neutral-10,60 60 60));--mds-file-preview-icon-color:rgb(var(--tone-neutral-04,218 218 218))}:host([format=audio]),:host([format=video]){--mds-file-preview-color:rgb(var(--label-violet-04,216 200 252));--mds-file-preview-icon-background:rgb(var(--label-violet-10,57 9 165));--mds-file-preview-icon-color:rgb(var(--label-violet-04,216 200 252))}:host([format=code]),:host([format=data]),:host([format=markup]){--mds-file-preview-color:rgb(var(--label-yellow-04,248 202 60));--mds-file-preview-icon-background:rgb(var(--label-yellow-10,75 57 3));--mds-file-preview-icon-color:rgb(var(--label-yellow-04,248 202 60))}:host([format=certificate]),:host([format=document]){--mds-file-preview-color:rgb(var(--label-orange-04,252 196 158));--mds-file-preview-icon-background:rgb(var(--label-orange-10,99 42 3));--mds-file-preview-icon-color:rgb(var(--label-orange-04,252 196 158))}:host([format=email]),:host([format=text]){--mds-file-preview-color:rgb(var(--label-blue-04,196 206 253));--mds-file-preview-icon-background:rgb(var(--label-blue-10,6 34 166));--mds-file-preview-icon-color:rgb(var(--label-blue-04,196 206 253))}:host([format=image]){--mds-file-preview-color:rgb(var(--label-green-04,113 230 156));--mds-file-preview-icon-background:rgb(var(--label-green-10,12 68 33));--mds-file-preview-icon-color:rgb(var(--label-green-04,113 230 156))}:host([format=slide]){--mds-file-preview-color:rgb(var(--label-orchid-04,248 192 220));--mds-file-preview-icon-background:rgb(var(--label-orchid-10,111 12 61));--mds-file-preview-icon-color:rgb(var(--label-orchid-04,248 192 220))}:host([format=spreadsheet]){--mds-file-preview-color:rgb(var(--label-lime-04,148 229 25));--mds-file-preview-icon-background:rgb(var(--label-lime-10,43 66 7));--mds-file-preview-icon-color:rgb(var(--label-lime-04,148 229 25))}:host([format=vector]){--mds-file-preview-color:rgb(var(--label-aqua-04,81 225 250));--mds-file-preview-icon-background:rgb(var(--label-aqua-10,2 65 76));--mds-file-preview-icon-color:rgb(var(--label-aqua-04,81 225 250))}:host([variant=primary][message]){--mds-file-preview-icon-background:rgb(var(--variant-primary-09,0 58 168));--mds-file-preview-icon-color:rgb(var(--variant-primary-04,184 208 255))}:host([variant=info][message]){--mds-file-preview-icon-background:rgb(var(--status-info-09,0 73 116));--mds-file-preview-icon-color:rgb(var(--status-info-04,159 216 241));--mds-file-preview-color:rgb(var(--status-info-03,198 231 247))}:host([variant=success][message]){--mds-file-preview-icon-background:rgb(var(--status-success-09,0 82 9));--mds-file-preview-icon-color:rgb(var(--status-success-04,158 222 181));--mds-file-preview-color:rgb(var(--status-success-03,196 235 209))}:host([variant=warning][message]){--mds-file-preview-icon-background:rgb(var(--status-warning-09,90 67 0));--mds-file-preview-icon-color:rgb(var(--status-warning-04,255 200 33));--mds-file-preview-color:rgb(var(--status-warning-03,255 223 129))}:host([variant=error][message]){--mds-file-preview-icon-background:rgb(var(--status-error-09,135 0 14));--mds-file-preview-icon-color:rgb(var(--status-error-04,254 193 189));--mds-file-preview-color:rgb(var(--status-error-03,255 217 214))}:host([variant=amaranth][message]){--mds-file-preview-icon-background:rgb(var(--label-amaranth-09,135 8 30));--mds-file-preview-icon-color:rgb(var(--label-amaranth-04,251 192 203));--mds-file-preview-color:rgb(var(--label-amaranth-03,253 217 223))}:host([variant=aqua][message]){--mds-file-preview-icon-background:rgb(var(--label-aqua-09,3 77 90));--mds-file-preview-icon-color:rgb(var(--label-aqua-04,81 225 250));--mds-file-preview-color:rgb(var(--label-aqua-03,158 238 252))}:host([variant=blue][message]){--mds-file-preview-icon-background:rgb(var(--label-blue-09,7 40 196));--mds-file-preview-icon-color:rgb(var(--label-blue-04,196 206 253));--mds-file-preview-color:rgb(var(--label-blue-03,218 224 254))}:host([variant=green][message]){--mds-file-preview-icon-background:rgb(var(--label-green-09,14 81 39));--mds-file-preview-icon-color:rgb(var(--label-green-04,113 230 156));--mds-file-preview-color:rgb(var(--label-green-03,173 241 198))}:host([variant=lime][message]){--mds-file-preview-icon-background:rgb(var(--label-lime-09,51 79 8));--mds-file-preview-icon-color:rgb(var(--label-lime-04,148 229 25));--mds-file-preview-color:rgb(var(--label-lime-03,193 241 122))}:host([variant=orange][message]){--mds-file-preview-icon-background:rgb(var(--label-orange-09,116 49 3));--mds-file-preview-icon-color:rgb(var(--label-orange-04,252 196 158));--mds-file-preview-color:rgb(var(--label-orange-03,253 219 196))}:host([variant=orchid][message]){--mds-file-preview-icon-background:rgb(var(--label-orchid-09,131 14 71));--mds-file-preview-icon-color:rgb(var(--label-orchid-04,248 192 220));--mds-file-preview-color:rgb(var(--label-orchid-03,251 216 234))}:host([variant=sky][message]){--mds-file-preview-icon-background:rgb(var(--label-sky-09,6 76 107));--mds-file-preview-icon-color:rgb(var(--label-sky-04,148 217 249));--mds-file-preview-color:rgb(var(--label-sky-03,191 232 251))}:host([variant=violet][message]){--mds-file-preview-icon-background:rgb(var(--label-violet-09,67 11 195));--mds-file-preview-icon-color:rgb(var(--label-violet-04,216 200 252));--mds-file-preview-color:rgb(var(--label-violet-03,231 221 253))}:host([variant=yellow][message]){--mds-file-preview-icon-background:rgb(var(--label-yellow-09,89 68 3));--mds-file-preview-icon-color:rgb(var(--label-yellow-04,248 202 60));--mds-file-preview-color:rgb(var(--label-yellow-03,251 224 142))}:host-context(:root.pref-contrast-more):host([variant=primary][message]){--mds-file-preview-icon-background:rgb(var(--variant-primary-10,0 49 142));--mds-file-preview-icon-color:rgb(var(--variant-primary-02,230 239 255));--mds-file-preview-color:rgb(var(--variant-primary-01,242 246 255))}:host-context(:root.pref-contrast-more):host([variant=info][message]){--mds-file-preview-icon-background:rgb(var(--status-info-10,0 61 103));--mds-file-preview-icon-color:rgb(var(--status-info-02,222 242 250));--mds-file-preview-color:rgb(var(--status-info-01,237 248 253))}:host-context(:root.pref-contrast-more):host([variant=success][message]){--mds-file-preview-icon-background:rgb(var(--status-success-10,0 69 0));--mds-file-preview-icon-color:rgb(var(--status-success-02,222 244 228));--mds-file-preview-color:rgb(var(--status-success-01,237 249 241))}:host-context(:root.pref-contrast-more):host([variant=warning][message]){--mds-file-preview-icon-background:rgb(var(--status-warning-10,77 57 0));--mds-file-preview-icon-color:rgb(var(--status-warning-02,255 237 185));--mds-file-preview-color:rgb(var(--status-warning-01,255 246 217))}:host-context(:root.pref-contrast-more):host([variant=error][message]){--mds-file-preview-icon-background:rgb(var(--status-error-10,115 0 0));--mds-file-preview-icon-color:rgb(var(--status-error-02,255 234 231));--mds-file-preview-color:rgb(var(--status-error-01,255 243 242))}:host-context(:root.pref-contrast-more):host([variant=amaranth][message]){--mds-file-preview-icon-background:rgb(var(--label-amaranth-10,114 7 25));--mds-file-preview-icon-color:rgb(var(--label-amaranth-02,254 233 237));--mds-file-preview-color:rgb(var(--label-amaranth-01,254 243 245))}:host-context(:root.pref-contrast-more):host([variant=aqua][message]){--mds-file-preview-icon-background:rgb(var(--label-aqua-10,2 65 76));--mds-file-preview-icon-color:rgb(var(--label-aqua-02,203 246 254));--mds-file-preview-color:rgb(var(--label-aqua-01,229 251 254))}:host-context(:root.pref-contrast-more):host([variant=blue][message]){--mds-file-preview-icon-background:rgb(var(--label-blue-10,6 34 166));--mds-file-preview-icon-color:rgb(var(--label-blue-02,234 238 254));--mds-file-preview-color:rgb(var(--label-blue-01,244 245 255))}:host-context(:root.pref-contrast-more):host([variant=green][message]){--mds-file-preview-icon-background:rgb(var(--label-green-10,12 68 33));--mds-file-preview-icon-color:rgb(var(--label-green-02,211 247 224));--mds-file-preview-color:rgb(var(--label-green-01,231 251 239))}:host-context(:root.pref-contrast-more):host([variant=lime][message]){--mds-file-preview-icon-background:rgb(var(--label-lime-10,43 66 7));--mds-file-preview-icon-color:rgb(var(--label-lime-02,223 247 185));--mds-file-preview-color:rgb(var(--label-lime-01,238 251 217))}:host-context(:root.pref-contrast-more):host([variant=orange][message]){--mds-file-preview-icon-background:rgb(var(--label-orange-10,99 42 3));--mds-file-preview-icon-color:rgb(var(--label-orange-02,254 235 222));--mds-file-preview-color:rgb(var(--label-orange-01,255 244 237))}:host-context(:root.pref-contrast-more):host([variant=orchid][message]){--mds-file-preview-icon-background:rgb(var(--label-orchid-10,111 12 61));--mds-file-preview-icon-color:rgb(var(--label-orchid-02,253 233 243));--mds-file-preview-color:rgb(var(--label-orchid-01,254 243 249))}:host-context(:root.pref-contrast-more):host([variant=sky][message]){--mds-file-preview-icon-background:rgb(var(--label-sky-10,5 63 90));--mds-file-preview-icon-color:rgb(var(--label-sky-02,219 242 253));--mds-file-preview-color:rgb(var(--label-sky-01,236 248 254))}:host-context(:root.pref-contrast-more):host([variant=violet][message]){--mds-file-preview-icon-background:rgb(var(--label-violet-10,57 9 165));--mds-file-preview-icon-color:rgb(var(--label-violet-02,241 235 254));--mds-file-preview-color:rgb(var(--label-violet-01,248 244 254))}:host-context(:root.pref-contrast-more):host([variant=yellow][message]){--mds-file-preview-icon-background:rgb(var(--label-yellow-10,75 57 3));--mds-file-preview-icon-color:rgb(var(--label-yellow-02,253 238 190));--mds-file-preview-color:rgb(var(--label-yellow-01,254 246 221))}:host-context(:root.pref-animation-reduce){transition-duration:0s}:host-context(:root.pref-animation-reduce) .preview{transition-duration:0s}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){-webkit-box-shadow:var(--shadow-outline);box-shadow:var(--shadow-outline)}:host-context(:root.pref-contrast-more){--mds-file-preview-color:rgb(var(--tone-neutral-01,255 255 255));-webkit-box-shadow:var(--shadow-outline-50);box-shadow:var(--shadow-outline-50)}@media (prefers-contrast:more){:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=primary][message]){--mds-file-preview-icon-background:rgb(var(--variant-primary-10,0 49 142));--mds-file-preview-icon-color:rgb(var(--variant-primary-02,230 239 255));--mds-file-preview-color:rgb(var(--variant-primary-01,242 246 255))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=info][message]){--mds-file-preview-icon-background:rgb(var(--status-info-10,0 61 103));--mds-file-preview-icon-color:rgb(var(--status-info-02,222 242 250));--mds-file-preview-color:rgb(var(--status-info-01,237 248 253))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=success][message]){--mds-file-preview-icon-background:rgb(var(--status-success-10,0 69 0));--mds-file-preview-icon-color:rgb(var(--status-success-02,222 244 228));--mds-file-preview-color:rgb(var(--status-success-01,237 249 241))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=warning][message]){--mds-file-preview-icon-background:rgb(var(--status-warning-10,77 57 0));--mds-file-preview-icon-color:rgb(var(--status-warning-02,255 237 185));--mds-file-preview-color:rgb(var(--status-warning-01,255 246 217))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=error][message]){--mds-file-preview-icon-background:rgb(var(--status-error-10,115 0 0));--mds-file-preview-icon-color:rgb(var(--status-error-02,255 234 231));--mds-file-preview-color:rgb(var(--status-error-01,255 243 242))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=amaranth][message]){--mds-file-preview-icon-background:rgb(var(--label-amaranth-10,114 7 25));--mds-file-preview-icon-color:rgb(var(--label-amaranth-02,254 233 237));--mds-file-preview-color:rgb(var(--label-amaranth-01,254 243 245))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=aqua][message]){--mds-file-preview-icon-background:rgb(var(--label-aqua-10,2 65 76));--mds-file-preview-icon-color:rgb(var(--label-aqua-02,203 246 254));--mds-file-preview-color:rgb(var(--label-aqua-01,229 251 254))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=blue][message]){--mds-file-preview-icon-background:rgb(var(--label-blue-10,6 34 166));--mds-file-preview-icon-color:rgb(var(--label-blue-02,234 238 254));--mds-file-preview-color:rgb(var(--label-blue-01,244 245 255))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=green][message]){--mds-file-preview-icon-background:rgb(var(--label-green-10,12 68 33));--mds-file-preview-icon-color:rgb(var(--label-green-02,211 247 224));--mds-file-preview-color:rgb(var(--label-green-01,231 251 239))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=lime][message]){--mds-file-preview-icon-background:rgb(var(--label-lime-10,43 66 7));--mds-file-preview-icon-color:rgb(var(--label-lime-02,223 247 185));--mds-file-preview-color:rgb(var(--label-lime-01,238 251 217))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=orange][message]){--mds-file-preview-icon-background:rgb(var(--label-orange-10,99 42 3));--mds-file-preview-icon-color:rgb(var(--label-orange-02,254 235 222));--mds-file-preview-color:rgb(var(--label-orange-01,255 244 237))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=orchid][message]){--mds-file-preview-icon-background:rgb(var(--label-orchid-10,111 12 61));--mds-file-preview-icon-color:rgb(var(--label-orchid-02,253 233 243));--mds-file-preview-color:rgb(var(--label-orchid-01,254 243 249))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=sky][message]){--mds-file-preview-icon-background:rgb(var(--label-sky-10,5 63 90));--mds-file-preview-icon-color:rgb(var(--label-sky-02,219 242 253));--mds-file-preview-color:rgb(var(--label-sky-01,236 248 254))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=violet][message]){--mds-file-preview-icon-background:rgb(var(--label-violet-10,57 9 165));--mds-file-preview-icon-color:rgb(var(--label-violet-02,241 235 254));--mds-file-preview-color:rgb(var(--label-violet-01,248 244 254))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([variant=yellow][message]){--mds-file-preview-icon-background:rgb(var(--label-yellow-10,75 57 3));--mds-file-preview-icon-color:rgb(var(--label-yellow-02,253 238 190));--mds-file-preview-color:rgb(var(--label-yellow-01,254 246 221))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))){--mds-file-preview-color:rgb(var(--tone-neutral-01,255 255 255));-webkit-box-shadow:var(--shadow-outline-50);box-shadow:var(--shadow-outline-50)}}@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]))) .preview{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]))){-webkit-box-shadow:var(--shadow-outline);box-shadow:var(--shadow-outline)}}`;
 
 const MdsFilePreview = class {
     constructor(hostRef) {
@@ -281,10 +281,14 @@ const MdsFilePreview = class {
     }
     get host() { return getElement(this); }
     static get watchers() { return {
-        "filename": ["handleFilename"],
-        "downloadable": ["handleDownloadable"]
+        "filename": [{
+                "handleFilename": 0
+            }],
+        "downloadable": [{
+                "handleDownloadable": 0
+            }]
     }; }
 };
-MdsFilePreview.style = mdsFilePreviewCss;
+MdsFilePreview.style = mdsFilePreviewCss();
 
 export { MdsFilePreview as mds_file_preview };

package/dist/esm/mds-file.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-BfAC4pqU.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-CAd5312P.js';
 import { a as getAugmentedNamespace, c as commonjsGlobal } from './_commonjsHelpers-E-ZsRS8r.js';
 import { f as fileDescriptionLocaleIt, a as fileDescriptionLocaleEs, b as fileDescriptionLocaleEn, c as fileDescriptionLocaleEl, g as getExtensionInfos, d as getSuffix, h as getName, e as getFormatsVariant } from './locale.it-Dj8sWDfj.js';
 import { L as Locale } from './locale-a4oAcjYG.js';
@@ -7541,7 +7541,7 @@ var localeIt = {
 	alreadyDownloaded: alreadyDownloaded
 };
 
-const mdsFileCss = "@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-file-preview-icon-color:rgb(var(--tone-neutral-04,218 218 218));--mds-file-preview-color:rgb(var(--tone-neutral-04,218 218 218));--mds-file-preview-icon-bacground:rgb(var(--tone-neutral-10,60 60 60))}}}@layer reset,vendor,theme,base,components,utilities;@keyframes focus-bounce{0%,75%,to{outline-offset:var(--magma-outline-focus-offset,6px)}50%{outline-offset:var(--magma-outline-blur-offset,2px)}}:host(:not(:is([hydrated],.hydrated))),:is(mds-badge,mds-icon,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-file-preview-icon-color:rgb(var(--tone-neutral-04,218 218 218));--mds-file-preview-color:rgb(var(--tone-neutral-04,218 218 218));--mds-file-preview-icon-bacground:rgb(var(--tone-neutral-10,60 60 60));--private-icon-download-offset:10%;animation-duration:var(--magma-outline-animation-duration,1s);animation-fill-mode:forwards;animation-iteration-count:infinite;animation-name:focus-bounce;animation-play-state:paused;animation-timing-function:var(--ease-out,cubic-bezier(0,0,.2,1));background-color:rgb(var(--tone-neutral,0 0 0));border-radius:var(--radius-xl,20px);-webkit-box-shadow:var(--shadow-outline-weak,0 0 0 1px #0000000d,0 1px 2px 0 #0000000d);box-shadow:var(--shadow-outline-weak,0 0 0 1px #0000000d,0 1px 2px 0 #0000000d);color:rgb(var(--tone-neutral-04,218 218 218));outline:var(--magma-outline-blur,2px solid var(--magma-outline-blur-color,#0000));transition-duration:.2s;transition-property:background-color,border-color,box-shadow,color,fill,outline,outline-offset,transform;transition-timing-function:ease-in-out;corner-shape:var(--magma-corner-shape,round);align-items:stretch;cursor:pointer;display:inline-flex;overflow:hidden;-webkit-transition-duration:var(--duration-200,.2s);transition-duration:var(--duration-200,.2s);transition-property:box-shadow,outline,outline-offset;-webkit-transition-timing-function:var(--ease-out);transition-timing-function:var(--ease-out);width:100%}:host:focus-visible{--magma-outline-blur:var(--magma-outline-focus);animation-play-state:running}:host(:focus-visible){--magma-outline-blur:var(--magma-outline-focus);animation-play-state:running}:host(:hover){-webkit-box-shadow:var(--shadow-box-md,#0000000f 0 0 0 1px,#00000008 0 1px 1px -.5px,#0000000a 0 2px 2px -1px,#0000000a 0 3px 3px -1.5px,#00000008 0 5px 5px -2.5px,#00000008 0 10px 10px -5px,#00000008 0 24px 24px -8px);box-shadow:var(--shadow-box-md,#0000000f 0 0 0 1px,#00000008 0 1px 1px -.5px,#0000000a 0 2px 2px -1px,#0000000a 0 3px 3px -1.5px,#00000008 0 5px 5px -2.5px,#00000008 0 10px 10px -5px,#00000008 0 24px 24px -8px)}:host(:hover) .download-icon{opacity:1;transform:translateY(0)}:host(:hover) .icon-preview,:host(:hover) .image-preview{opacity:0;-webkit-transform:translateY(var(--private-icon-download-offset));transform:translateY(var(--private-icon-download-offset))}.download-icon{inset:0;opacity:0;position:absolute;-webkit-transform:translateY(calc(var(--private-icon-download-offset)*-1));transform:translateY(calc(var(--private-icon-download-offset)*-1));-webkit-transition-duration:inherit;transition-duration:inherit;transition-property:opacity,transform;-webkit-transition-timing-function:inherit;transition-timing-function:inherit}.download-icon,.preview{align-items:center;display:flex;justify-content:center}.preview{background-color:var(--mds-file-preview-icon-bacground,rgb(var(--tone-neutral-10,60 60 60)));color:var(--mds-file-preview-color,rgb(var(--tone-neutral-03,233 233 233)));fill:var(--mds-file-preview-icon-color,var(--mds-file-preview-color,rgb(var(--tone-neutral-03,233 233 233))));flex-shrink:0;position:relative;-webkit-transition-duration:inherit;transition-duration:inherit;transition-property:color,background-color,fill;-webkit-transition-timing-function:var(--ease-in-out);transition-timing-function:var(--ease-in-out);width:calc(var(--spacing,.0025rem)*1400)}.image-preview{background-position:50%;background-repeat:no-repeat;background-size:contain;inset:calc(var(--spacing,.0025rem)*300);position:absolute}.icon-preview,.image-preview{-webkit-transition-duration:inherit;transition-duration:inherit;transition-property:opacity,transform;-webkit-transition-timing-function:inherit;transition-timing-function:inherit}.info{flex-direction:column;flex-grow:1;gap:calc(var(--spacing,.0025rem)*100);height:calc(var(--spacing,.0025rem)*1400);justify-content:center;padding:0 calc(var(--spacing,.0025rem)*300)}.filename,.info{display:flex;min-width:0}.name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.extension{flex-shrink:0}.detail{align-items:baseline;display:flex;gap:calc(var(--spacing,.0025rem)*200);min-width:0}.suffix{flex-shrink:0;pointer-events:none}.description{color:rgb(var(--tone-neutral-05,197 197 197));min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.indicator{align-items:center;display:flex;justify-content:center;padding-right:calc(var(--spacing,.0025rem)*400)}.downloaded{display:flex;fill:rgb(var(--status-success-06,0 171 97))}.downloaded svg{aspect-ratio:1;aspect-ratio:var(--aspect-square,1/1);height:100%;width:100%}:host([format=archive]),:host([format=executable]){--mds-file-preview-icon-color:rgb(var(--label-amaranth-04,251 192 203));--mds-file-preview-color:rgb(var(--label-amaranth-04,251 192 203));--mds-file-preview-icon-bacground:rgb(var(--label-amaranth-10,114 7 25))}:host([format=attachment]){--mds-file-preview-icon-color:rgb(var(--tone-neutral-04,218 218 218));--mds-file-preview-color:rgb(var(--tone-neutral-04,218 218 218));--mds-file-preview-icon-bacground:rgb(var(--tone-neutral-10,60 60 60))}:host([format=audio]),:host([format=video]){--mds-file-preview-icon-color:rgb(var(--label-violet-04,216 200 252));--mds-file-preview-color:rgb(var(--label-violet-04,216 200 252));--mds-file-preview-icon-bacground:rgb(var(--label-violet-10,57 9 165))}:host([format=code]),:host([format=data]),:host([format=markup]){--mds-file-preview-icon-color:rgb(var(--label-yellow-04,248 202 60));--mds-file-preview-color:rgb(var(--label-yellow-04,248 202 60));--mds-file-preview-icon-bacground:rgb(var(--label-yellow-10,75 57 3))}:host([format=certificate]),:host([format=document]){--mds-file-preview-icon-color:rgb(var(--label-orange-04,252 196 158));--mds-file-preview-color:rgb(var(--label-orange-04,252 196 158));--mds-file-preview-icon-bacground:rgb(var(--label-orange-10,99 42 3))}:host([format=email]),:host([format=text]){--mds-file-preview-icon-color:rgb(var(--label-blue-04,196 206 253));--mds-file-preview-color:rgb(var(--label-blue-04,196 206 253));--mds-file-preview-icon-bacground:rgb(var(--label-blue-10,6 34 166))}:host([format=image]){--mds-file-preview-icon-color:rgb(var(--label-green-04,113 230 156));--mds-file-preview-color:rgb(var(--label-green-04,113 230 156));--mds-file-preview-icon-bacground:rgb(var(--label-green-10,12 68 33))}:host([format=slide]){--mds-file-preview-icon-color:rgb(var(--label-orchid-04,248 192 220));--mds-file-preview-color:rgb(var(--label-orchid-04,248 192 220));--mds-file-preview-icon-bacground:rgb(var(--label-orchid-10,111 12 61))}:host([format=spreadsheet]){--mds-file-preview-icon-color:rgb(var(--label-lime-04,148 229 25));--mds-file-preview-color:rgb(var(--label-lime-04,148 229 25));--mds-file-preview-icon-bacground:rgb(var(--label-lime-10,43 66 7))}:host([format=vector]){--mds-file-preview-icon-color:rgb(var(--label-aqua-04,81 225 250));--mds-file-preview-color:rgb(var(--label-aqua-04,81 225 250));--mds-file-preview-icon-bacground:rgb(var(--label-aqua-10,2 65 76))}:host-context(:root.pref-animation-reduce){transition-duration:0s}:host-context(:root.pref-animation-reduce) .preview{transition-duration:0s}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){-webkit-box-shadow:var(--shadow-outline);box-shadow:var(--shadow-outline)}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)):host(:hover){-webkit-box-shadow:var(--shadow-outline-50);box-shadow:var(--shadow-outline-50)}:host-context(:root.pref-contrast-more){background-color:rgb(var(--tone-neutral,0 0 0));-webkit-box-shadow:var(--shadow-outline-50);box-shadow:var(--shadow-outline-50);color:rgb(var(--tone-neutral-01,255 255 255))}:host-context(:root.pref-contrast-more):host(:hover){-webkit-box-shadow:var(--shadow-outline-strong-100);box-shadow:var(--shadow-outline-strong-100)}@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]))) .preview{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]))){-webkit-box-shadow:var(--shadow-outline);box-shadow:var(--shadow-outline)}:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))):host(:hover){-webkit-box-shadow:var(--shadow-outline-50);box-shadow:var(--shadow-outline-50)}}@media (prefers-contrast:more){:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))){background-color:rgb(var(--tone-neutral,0 0 0));-webkit-box-shadow:var(--shadow-outline-50);box-shadow:var(--shadow-outline-50);color:rgb(var(--tone-neutral-01,255 255 255))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host(:hover){-webkit-box-shadow:var(--shadow-outline-strong-100);box-shadow:var(--shadow-outline-strong-100)}}";
+const mdsFileCss = () => `@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-file-preview-icon-color:rgb(var(--tone-neutral-04,218 218 218));--mds-file-preview-color:rgb(var(--tone-neutral-04,218 218 218));--mds-file-preview-icon-bacground:rgb(var(--tone-neutral-10,60 60 60))}}}@layer reset,vendor,theme,base,components,utilities;@keyframes focus-bounce{0%,75%,to{outline-offset:var(--magma-outline-focus-offset,6px)}50%{outline-offset:var(--magma-outline-blur-offset,2px)}}:host(:not(:is([hydrated],.hydrated))),:is(mds-badge,mds-icon,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-file-preview-icon-color:rgb(var(--tone-neutral-04,218 218 218));--mds-file-preview-color:rgb(var(--tone-neutral-04,218 218 218));--mds-file-preview-icon-bacground:rgb(var(--tone-neutral-10,60 60 60));--private-icon-download-offset:10%;animation-duration:var(--magma-outline-animation-duration,1s);animation-fill-mode:forwards;animation-iteration-count:infinite;animation-name:focus-bounce;animation-play-state:paused;animation-timing-function:var(--ease-out,cubic-bezier(0,0,.2,1));background-color:rgb(var(--tone-neutral,0 0 0));border-radius:var(--radius-xl,20px);-webkit-box-shadow:var(--shadow-outline-weak,0 0 0 1px #0000000d,0 1px 2px 0 #0000000d);box-shadow:var(--shadow-outline-weak,0 0 0 1px #0000000d,0 1px 2px 0 #0000000d);color:rgb(var(--tone-neutral-04,218 218 218));outline:var(--magma-outline-blur,2px solid var(--magma-outline-blur-color,#0000));transition-duration:.2s;transition-property:background-color,border-color,box-shadow,color,fill,outline,outline-offset,transform;transition-timing-function:ease-in-out;corner-shape:var(--magma-corner-shape,round);align-items:stretch;cursor:pointer;display:inline-flex;overflow:hidden;-webkit-transition-duration:var(--duration-200,.2s);transition-duration:var(--duration-200,.2s);transition-property:box-shadow,outline,outline-offset;-webkit-transition-timing-function:var(--ease-out);transition-timing-function:var(--ease-out);width:100%}:host:focus-visible{--magma-outline-blur:var(--magma-outline-focus);animation-play-state:running}:host(:focus-visible){--magma-outline-blur:var(--magma-outline-focus);animation-play-state:running}:host(:hover){-webkit-box-shadow:var(--shadow-box-md,#0000000f 0 0 0 1px,#00000008 0 1px 1px -.5px,#0000000a 0 2px 2px -1px,#0000000a 0 3px 3px -1.5px,#00000008 0 5px 5px -2.5px,#00000008 0 10px 10px -5px,#00000008 0 24px 24px -8px);box-shadow:var(--shadow-box-md,#0000000f 0 0 0 1px,#00000008 0 1px 1px -.5px,#0000000a 0 2px 2px -1px,#0000000a 0 3px 3px -1.5px,#00000008 0 5px 5px -2.5px,#00000008 0 10px 10px -5px,#00000008 0 24px 24px -8px)}:host(:hover) .download-icon{opacity:1;transform:translateY(0)}:host(:hover) .icon-preview,:host(:hover) .image-preview{opacity:0;-webkit-transform:translateY(var(--private-icon-download-offset));transform:translateY(var(--private-icon-download-offset))}.download-icon{inset:0;opacity:0;position:absolute;-webkit-transform:translateY(calc(var(--private-icon-download-offset)*-1));transform:translateY(calc(var(--private-icon-download-offset)*-1));-webkit-transition-duration:inherit;transition-duration:inherit;transition-property:opacity,transform;-webkit-transition-timing-function:inherit;transition-timing-function:inherit}.download-icon,.preview{align-items:center;display:flex;justify-content:center}.preview{background-color:var(--mds-file-preview-icon-bacground,rgb(var(--tone-neutral-10,60 60 60)));color:var(--mds-file-preview-color,rgb(var(--tone-neutral-03,233 233 233)));fill:var(--mds-file-preview-icon-color,var(--mds-file-preview-color,rgb(var(--tone-neutral-03,233 233 233))));flex-shrink:0;position:relative;-webkit-transition-duration:inherit;transition-duration:inherit;transition-property:color,background-color,fill;-webkit-transition-timing-function:var(--ease-in-out);transition-timing-function:var(--ease-in-out);width:calc(var(--spacing,.0025rem)*1400)}.image-preview{background-position:50%;background-repeat:no-repeat;background-size:contain;inset:calc(var(--spacing,.0025rem)*300);position:absolute}.icon-preview,.image-preview{-webkit-transition-duration:inherit;transition-duration:inherit;transition-property:opacity,transform;-webkit-transition-timing-function:inherit;transition-timing-function:inherit}.info{flex-direction:column;flex-grow:1;gap:calc(var(--spacing,.0025rem)*100);height:calc(var(--spacing,.0025rem)*1400);justify-content:center;padding:0 calc(var(--spacing,.0025rem)*300)}.filename,.info{display:flex;min-width:0}.name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.extension{flex-shrink:0}.detail{align-items:baseline;display:flex;gap:calc(var(--spacing,.0025rem)*200);min-width:0}.suffix{flex-shrink:0;pointer-events:none}.description{color:rgb(var(--tone-neutral-05,197 197 197));min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.indicator{align-items:center;display:flex;justify-content:center;padding-right:calc(var(--spacing,.0025rem)*400)}.downloaded{display:flex;fill:rgb(var(--status-success-06,0 171 97))}.downloaded svg{aspect-ratio:var(--aspect-square,1/1);height:100%;width:100%}:host([format=archive]),:host([format=executable]){--mds-file-preview-icon-color:rgb(var(--label-amaranth-04,251 192 203));--mds-file-preview-color:rgb(var(--label-amaranth-04,251 192 203));--mds-file-preview-icon-bacground:rgb(var(--label-amaranth-10,114 7 25))}:host([format=attachment]){--mds-file-preview-icon-color:rgb(var(--tone-neutral-04,218 218 218));--mds-file-preview-color:rgb(var(--tone-neutral-04,218 218 218));--mds-file-preview-icon-bacground:rgb(var(--tone-neutral-10,60 60 60))}:host([format=audio]),:host([format=video]){--mds-file-preview-icon-color:rgb(var(--label-violet-04,216 200 252));--mds-file-preview-color:rgb(var(--label-violet-04,216 200 252));--mds-file-preview-icon-bacground:rgb(var(--label-violet-10,57 9 165))}:host([format=code]),:host([format=data]),:host([format=markup]){--mds-file-preview-icon-color:rgb(var(--label-yellow-04,248 202 60));--mds-file-preview-color:rgb(var(--label-yellow-04,248 202 60));--mds-file-preview-icon-bacground:rgb(var(--label-yellow-10,75 57 3))}:host([format=certificate]),:host([format=document]){--mds-file-preview-icon-color:rgb(var(--label-orange-04,252 196 158));--mds-file-preview-color:rgb(var(--label-orange-04,252 196 158));--mds-file-preview-icon-bacground:rgb(var(--label-orange-10,99 42 3))}:host([format=email]),:host([format=text]){--mds-file-preview-icon-color:rgb(var(--label-blue-04,196 206 253));--mds-file-preview-color:rgb(var(--label-blue-04,196 206 253));--mds-file-preview-icon-bacground:rgb(var(--label-blue-10,6 34 166))}:host([format=image]){--mds-file-preview-icon-color:rgb(var(--label-green-04,113 230 156));--mds-file-preview-color:rgb(var(--label-green-04,113 230 156));--mds-file-preview-icon-bacground:rgb(var(--label-green-10,12 68 33))}:host([format=slide]){--mds-file-preview-icon-color:rgb(var(--label-orchid-04,248 192 220));--mds-file-preview-color:rgb(var(--label-orchid-04,248 192 220));--mds-file-preview-icon-bacground:rgb(var(--label-orchid-10,111 12 61))}:host([format=spreadsheet]){--mds-file-preview-icon-color:rgb(var(--label-lime-04,148 229 25));--mds-file-preview-color:rgb(var(--label-lime-04,148 229 25));--mds-file-preview-icon-bacground:rgb(var(--label-lime-10,43 66 7))}:host([format=vector]){--mds-file-preview-icon-color:rgb(var(--label-aqua-04,81 225 250));--mds-file-preview-color:rgb(var(--label-aqua-04,81 225 250));--mds-file-preview-icon-bacground:rgb(var(--label-aqua-10,2 65 76))}:host-context(:root.pref-animation-reduce){transition-duration:0s}:host-context(:root.pref-animation-reduce) .preview{transition-duration:0s}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){-webkit-box-shadow:var(--shadow-outline);box-shadow:var(--shadow-outline)}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)):host(:hover){-webkit-box-shadow:var(--shadow-outline-50);box-shadow:var(--shadow-outline-50)}:host-context(:root.pref-contrast-more){background-color:rgb(var(--tone-neutral,0 0 0));-webkit-box-shadow:var(--shadow-outline-50);box-shadow:var(--shadow-outline-50);color:rgb(var(--tone-neutral-01,255 255 255))}:host-context(:root.pref-contrast-more):host(:hover){-webkit-box-shadow:var(--shadow-outline-strong-100);box-shadow:var(--shadow-outline-strong-100)}@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]))) .preview{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]))){-webkit-box-shadow:var(--shadow-outline);box-shadow:var(--shadow-outline)}:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))):host(:hover){-webkit-box-shadow:var(--shadow-outline-50);box-shadow:var(--shadow-outline-50)}}@media (prefers-contrast:more){:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))){background-color:rgb(var(--tone-neutral,0 0 0));-webkit-box-shadow:var(--shadow-outline-50);box-shadow:var(--shadow-outline-50);color:rgb(var(--tone-neutral-01,255 255 255))}:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host(:hover){-webkit-box-shadow:var(--shadow-outline-strong-100);box-shadow:var(--shadow-outline-strong-100)}}`;
 
 const MdsFile = class {
     constructor(hostRef) {
@@ -7597,9 +7597,11 @@ const MdsFile = class {
     }
     get host() { return getElement(this); }
     static get watchers() { return {
-        "filename": ["handleFilename"]
+        "filename": [{
+                "handleFilename": 0
+            }]
     }; }
 };
-MdsFile.style = mdsFileCss;
+MdsFile.style = mdsFileCss();
 
 export { MdsFile as mds_file };

package/dist/esm/mds-filter-item.entry.js

@@ -1,7 +1,7 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-BfAC4pqU.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-CAd5312P.js';
 import { K as KeyboardManager } from './keyboard-manager-BudfaWhu.js';
 
-const mdsFilterItemCss = "@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-filter-item-count-background-default:rgb(var(--tone-neutral-08,107 107 107));--mds-filter-item-count-color-default:rgb(var(--tone-neutral-02,244 244 244));--mds-filter-item-count-background-selected:rgb(var(--tone-neutral-05,197 197 197));--mds-filter-item-count-color-selected:rgb(var(--tone-neutral,0 0 0))}}}@layer reset,vendor,theme,base,components,utilities;@keyframes focus-bounce{0%,75%,to{outline-offset:var(--magma-outline-focus-offset,6px)}50%{outline-offset:var(--magma-outline-blur-offset,2px)}}:host(:not(:is([hydrated],.hydrated))),:is(mds-icon,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-filter-item-count-background-default:rgb(var(--tone-neutral-08,107 107 107));--mds-filter-item-count-color-default:rgb(var(--tone-neutral-02,244 244 244));--mds-filter-item-count-background-selected:rgb(var(--tone-neutral-05,197 197 197));--mds-filter-item-count-color-selected:rgb(var(--tone-neutral,0 0 0));align-items:center;animation-duration:var(--magma-outline-animation-duration,1s);animation-fill-mode:forwards;animation-iteration-count:infinite;animation-name:focus-bounce;animation-play-state:paused;animation-timing-function:var(--ease-out,cubic-bezier(0,0,.2,1));border-radius:1000px;color:rgb(var(--tone-neutral-03,233 233 233));cursor:pointer;display:flex;fill:currentColor;gap:calc(var(--spacing,.0025rem)*100);justify-content:center;outline:var(--magma-outline-blur,2px solid var(--magma-outline-blur-color,#0000));padding:calc(var(--spacing,.0025rem)*200)calc(var(--spacing,.0025rem)*400);transition-duration:.2s;-webkit-transition-duration:var(--duration-200,.2s);transition-duration:var(--duration-200,.2s);transition-property:background-color,border-color,box-shadow,color,fill,outline,outline-offset,transform;transition-property:background-color,box-shadow,color,outline,outline-offset;transition-timing-function:ease-in-out;-webkit-transition-timing-function:var(--ease-out);transition-timing-function:var(--ease-out);-webkit-user-select:none;user-select:none;white-space:nowrap}:host:focus-visible{--magma-outline-blur:var(--magma-outline-focus);animation-play-state:running}mds-text{white-space:nowrap}.count{align-items:center;background-color:var(--mds-filter-item-count-background-default,rgb(var(--tone-neutral-08,107 107 107)));border-radius:calc(var(--spacing,.0025rem)*400);box-sizing:border-box;color:var(--mds-filter-item-count-color-default,rgb(var(--tone-neutral-02,244 244 244)));display:inline-flex;flex-shrink:0;height:calc(var(--spacing,.0025rem)*400);justify-content:center;min-width:calc(var(--spacing,.0025rem)*400);padding-left:calc(var(--spacing,.0025rem)*150);padding-right:calc(var(--spacing,.0025rem)*150);-webkit-transition-duration:var(--duration-200,.2s);transition-duration:var(--duration-200,.2s);transition-property:background-color,color;-webkit-transition-timing-function:var(--ease-out);transition-timing-function:var(--ease-out);-webkit-user-select:none;user-select:none}:host(:focus-visible){--magma-outline-blur:var(--magma-outline-focus);animation-play-state:running}:host([icon]:not([label])){height:calc(var(--spacing,.0025rem)*900);padding:0;width:calc(var(--spacing,.0025rem)*900)}:host(:hover),:host([selected]:not([selected=false])){background-color:rgb(var(--tone-neutral,0 0 0))}:host(:hover){-webkit-box-shadow:var(--shadow-sm,0 1px 3px 0 #0000001a,0 1px 2px -1px #0000001a);box-shadow:var(--shadow-sm,0 1px 3px 0 #0000001a,0 1px 2px -1px #0000001a)}:host([selected]:not([selected=false])){color:rgb(var(--tone-neutral-01,255 255 255))}:host([selected]:not([selected=false])) .count{background-color:var(--mds-filter-item-count-background-selected,rgb(var(--tone-neutral-05,197 197 197)));color:var(--mds-filter-item-count-color-selected,rgb(var(--tone-neutral,0 0 0)))}:host-context(:root.pref-animation-reduce){transition-duration:0s}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){background-color:rgb(var(--tone-neutral-10,60 60 60))}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)):host([selected]:not([selected=false])){background-color:rgb(var(--tone-neutral-08,107 107 107));-webkit-box-shadow:var(--shadow-outline);box-shadow:var(--shadow-outline)}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)):host(:hover){-webkit-box-shadow:var(--shadow-outline);box-shadow:var(--shadow-outline)}:host-context(:root.pref-contrast-more):host([selected]:not([selected=false])){-webkit-box-shadow:var(--shadow-outline-strong-50);box-shadow:var(--shadow-outline-strong-50)}:host-context(:root.pref-contrast-more):host(:hover){-webkit-box-shadow:var(--shadow-outline-strong-50);box-shadow:var(--shadow-outline-strong-50)}@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]))){background-color:rgb(var(--tone-neutral-10,60 60 60))}:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))):host([selected]:not([selected=false])){background-color:rgb(var(--tone-neutral-08,107 107 107));-webkit-box-shadow:var(--shadow-outline);box-shadow:var(--shadow-outline)}:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))):host(:hover){-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]))):host(:hover),:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([selected]:not([selected=false])){-webkit-box-shadow:var(--shadow-outline-strong-50);box-shadow:var(--shadow-outline-strong-50)}}";
+const mdsFilterItemCss = () => `@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-filter-item-count-background-default:rgb(var(--tone-neutral-08,107 107 107));--mds-filter-item-count-color-default:rgb(var(--tone-neutral-02,244 244 244));--mds-filter-item-count-background-selected:rgb(var(--tone-neutral-05,197 197 197));--mds-filter-item-count-color-selected:rgb(var(--tone-neutral,0 0 0))}}}@layer reset,vendor,theme,base,components,utilities;@keyframes focus-bounce{0%,75%,to{outline-offset:var(--magma-outline-focus-offset,6px)}50%{outline-offset:var(--magma-outline-blur-offset,2px)}}:host(:not(:is([hydrated],.hydrated))),:is(mds-icon,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-filter-item-count-background-default:rgb(var(--tone-neutral-08,107 107 107));--mds-filter-item-count-color-default:rgb(var(--tone-neutral-02,244 244 244));--mds-filter-item-count-background-selected:rgb(var(--tone-neutral-05,197 197 197));--mds-filter-item-count-color-selected:rgb(var(--tone-neutral,0 0 0));align-items:center;animation-duration:var(--magma-outline-animation-duration,1s);animation-fill-mode:forwards;animation-iteration-count:infinite;animation-name:focus-bounce;animation-play-state:paused;animation-timing-function:var(--ease-out,cubic-bezier(0,0,.2,1));border-radius:1000px;color:rgb(var(--tone-neutral-03,233 233 233));cursor:pointer;display:flex;fill:currentColor;gap:calc(var(--spacing,.0025rem)*100);justify-content:center;outline:var(--magma-outline-blur,2px solid var(--magma-outline-blur-color,#0000));padding:calc(var(--spacing,.0025rem)*200) calc(var(--spacing,.0025rem)*400);transition-duration:.2s;-webkit-transition-duration:var(--duration-200,.2s);transition-duration:var(--duration-200,.2s);transition-property:background-color,border-color,box-shadow,color,fill,outline,outline-offset,transform;transition-property:background-color,box-shadow,color,outline,outline-offset;transition-timing-function:ease-in-out;-webkit-transition-timing-function:var(--ease-out);transition-timing-function:var(--ease-out);-webkit-user-select:none;user-select:none;white-space:nowrap}:host:focus-visible{--magma-outline-blur:var(--magma-outline-focus);animation-play-state:running}mds-text{white-space:nowrap}.count{align-items:center;background-color:var(--mds-filter-item-count-background-default,rgb(var(--tone-neutral-08,107 107 107)));border-radius:calc(var(--spacing,.0025rem)*400);box-sizing:border-box;color:var(--mds-filter-item-count-color-default,rgb(var(--tone-neutral-02,244 244 244)));display:inline-flex;flex-shrink:0;height:calc(var(--spacing,.0025rem)*400);justify-content:center;min-width:calc(var(--spacing,.0025rem)*400);padding-left:calc(var(--spacing,.0025rem)*150);padding-right:calc(var(--spacing,.0025rem)*150);-webkit-transition-duration:var(--duration-200,.2s);transition-duration:var(--duration-200,.2s);transition-property:background-color,color;-webkit-transition-timing-function:var(--ease-out);transition-timing-function:var(--ease-out);-webkit-user-select:none;user-select:none}:host(:focus-visible){--magma-outline-blur:var(--magma-outline-focus);animation-play-state:running}:host([icon]:not([label])){height:calc(var(--spacing,.0025rem)*900);padding:0;width:calc(var(--spacing,.0025rem)*900)}:host(:hover),:host([selected]:not([selected=false])){background-color:rgb(var(--tone-neutral,0 0 0))}:host(:hover){-webkit-box-shadow:var(--shadow-sm,0 1px 3px 0 #0000001a,0 1px 2px -1px #0000001a);box-shadow:var(--shadow-sm,0 1px 3px 0 #0000001a,0 1px 2px -1px #0000001a)}:host([selected]:not([selected=false])){color:rgb(var(--tone-neutral-01,255 255 255))}:host([selected]:not([selected=false])) .count{background-color:var(--mds-filter-item-count-background-selected,rgb(var(--tone-neutral-05,197 197 197)));color:var(--mds-filter-item-count-color-selected,rgb(var(--tone-neutral,0 0 0)))}:host-context(:root.pref-animation-reduce){transition-duration:0s}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){background-color:rgb(var(--tone-neutral-10,60 60 60))}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)):host([selected]:not([selected=false])){background-color:rgb(var(--tone-neutral-08,107 107 107));-webkit-box-shadow:var(--shadow-outline);box-shadow:var(--shadow-outline)}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)):host(:hover){-webkit-box-shadow:var(--shadow-outline);box-shadow:var(--shadow-outline)}:host-context(:root.pref-contrast-more):host([selected]:not([selected=false])){-webkit-box-shadow:var(--shadow-outline-strong-50);box-shadow:var(--shadow-outline-strong-50)}:host-context(:root.pref-contrast-more):host(:hover){-webkit-box-shadow:var(--shadow-outline-strong-50);box-shadow:var(--shadow-outline-strong-50)}@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]))){background-color:rgb(var(--tone-neutral-10,60 60 60))}:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))):host([selected]:not([selected=false])){background-color:rgb(var(--tone-neutral-08,107 107 107));-webkit-box-shadow:var(--shadow-outline);box-shadow:var(--shadow-outline)}:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))):host(:hover){-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]))):host(:hover),:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))):host([selected]:not([selected=false])){-webkit-box-shadow:var(--shadow-outline-strong-50);box-shadow:var(--shadow-outline-strong-50)}}`;
 
 const MdsFilterItem = class {
     constructor(hostRef) {
@@ -26,6 +26,6 @@ const MdsFilterItem = class {
     }
     get element() { return getElement(this); }
 };
-MdsFilterItem.style = mdsFilterItemCss;
+MdsFilterItem.style = mdsFilterItemCss();
 
 export { MdsFilterItem as mds_filter_item };

package/dist/esm/mds-filter.entry.js

@@ -1,8 +1,8 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-BfAC4pqU.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-CAd5312P.js';
 import { c as clsx } from './clsx-ChV9xqsO.js';
 import { m as miBaselineClose } from './close-J-ikDhyq.js';
 
-const mdsFilterCss = "@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-filter-items-background-active:rgb(var(--tone-neutral-09,76 76 76));--mds-filter-items-background:rgb(var(--tone-neutral-09,76 76 76));--mds-filter-items-gap:calc(var(--spacing,.0025rem)*200);--mds-filter-items-padding:calc(var(--spacing,.0025rem)*200);--mds-filter-items-radius:var(--radius-full,1000px);--mds-filter-items-scroll-behavior:smooth;--mds-filter-label-padding:0 calc(var(--spacing,.0025rem)*600);--mds-filter-wrapper-shadow-color:rgb(var(--tone-neutral-06,158 158 158));--mds-filter-wrapper-shadow-opacity:.1}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),:is(mds-filter-item,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-filter-items-scroll-behavior{syntax:\"smooth|auto\";inherits:false;initial-value:smooth}@property --mds-filter-wrapper-shadow-opacity{syntax:\"<number>\";inherits:false;initial-value:.1}:host{--mds-filter-items-background-active:rgb(var(--tone-neutral-09,76 76 76));--mds-filter-items-background:rgb(var(--tone-neutral-09,76 76 76));--mds-filter-items-gap:calc(var(--spacing,.0025rem)*200);--mds-filter-items-padding:calc(var(--spacing,.0025rem)*200);--mds-filter-items-radius:var(--radius-full,1000px);--mds-filter-items-scroll-behavior:smooth;--mds-filter-label-padding:0 calc(var(--spacing,.0025rem)*600);--mds-filter-wrapper-shadow-color:rgb(var(--tone-neutral-06,158 158 158));--mds-filter-wrapper-shadow:0 0 0 2px var(--mds-filter-wrapper-shadow-color,rgb(var(--tone-neutral-06,158 158 158)))inset;--mds-filter-wrapper-shadow-opacity:.1;display:grid;gap:calc(var(--spacing,.0025rem)*100);grid-auto-rows:-webkit-min-content;grid-auto-rows:min-content}.items{-webkit-overflow-scrolling:touch;-ms-overflow-style:none;background-color:var(--mds-filter-items-background,rgb(var(--tone-neutral-09,76 76 76)));border-radius:var(--mds-filter-items-radius,var(--radius-full,1000px));display:flex;gap:var(--mds-filter-items-gap,calc(var(--spacing,.0025rem)*200));overflow:auto;padding:var(--mds-filter-items-padding,calc(var(--spacing,.0025rem)*200));position:relative;scroll-behavior:var(--mds-filter-items-scroll-behavior,smooth);-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-transition-duration:var(--duration-300,.3s);transition-duration:var(--duration-300,.3s);transition-property:background-color;-webkit-transition-timing-function:var(--ease-in-out-expo,cubic-bezier(1,0,0,1));transition-timing-function:var(--ease-in-out-expo,cubic-bezier(1,0,0,1))}.items-wrapper{display:grid;overflow:hidden;position:relative}.items-wrapper:after{border-radius:var(--mds-filter-items-radius,var(--radius-full,1000px));-webkit-box-shadow:var(--mds-filter-wrapper-shadow);box-shadow:var(--mds-filter-wrapper-shadow);content:\"\";inset:0;opacity:var(--mds-filter-wrapper-shadow-opacity,.1);pointer-events:none;position:absolute}.items::-webkit-scrollbar{display:none}.label{padding:var(--mds-filter-label-padding,0 calc(var(--spacing,.0025rem)*600))}.active{background-color:var(--mds-filter-items-background-active,rgb(var(--tone-neutral-09,76 76 76)))}.reset{display:flex;flex-grow:1;justify-content:flex-end;transform-origin:50%}.reset,.reset-button{transform:scale(0);-webkit-transition-duration:var(--duration-300,.3s);transition-duration:var(--duration-300,.3s);transition-property:transform;-webkit-transition-timing-function:var(--ease-in-out-expo,cubic-bezier(1,0,0,1));transition-timing-function:var(--ease-in-out-expo,cubic-bezier(1,0,0,1))}.reset-button-opened,:host([reset]:not([reset=false])) .reset{transform:scale(1)}:host-context(:root.pref-animation-reduce){--mds-filter-items-scroll-behavior:auto;transition-duration:0s}:is(:host-context(:root.pref-animation-reduce) .reset-button,:host-context(:root.pref-animation-reduce) .items){transition-duration:0s}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)) .items{--mds-filter-items-background-active:rgb(var(--tone-neutral-10,60 60 60));--mds-filter-items-background:rgb(var(--tone-neutral-09,76 76 76))}:host-context(:root.pref-contrast-more){--mds-filter-items-background-active:rgb(var(--tone-neutral-09,76 76 76));--mds-filter-items-background:rgb(var(--tone-neutral-10,60 60 60));--mds-filter-wrapper-shadow-opacity:30%;--mds-filter-wrapper-shadow-color:rgb(var(--tone-neutral-07,134 134 134));--mds-filter-wrapper-shadow:0 0 0 calc(var(--spacing,.0025rem)*50)var(--mds-filter-wrapper-shadow-color,rgb(var(--tone-neutral-06,158 158 158)))inset}@media (prefers-reduced-motion){:is(:host-context(:root.pref-animation-system),:host-context(:root:not([data-magma-pref]))){--mds-filter-items-scroll-behavior:auto;transition-duration:0s}:is(:host-context(:root.pref-animation-system),:host-context(:root:not([data-magma-pref]))) .items,:is(:host-context(:root.pref-animation-system),:host-context(:root:not([data-magma-pref]))) .reset-button{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]))) .items{--mds-filter-items-background-active:rgb(var(--tone-neutral-10,60 60 60));--mds-filter-items-background: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-filter-items-background-active:rgb(var(--tone-neutral-09,76 76 76));--mds-filter-items-background:rgb(var(--tone-neutral-10,60 60 60));--mds-filter-wrapper-shadow-opacity:30%;--mds-filter-wrapper-shadow-color:rgb(var(--tone-neutral-07,134 134 134));--mds-filter-wrapper-shadow:0 0 0 calc(var(--spacing,.0025rem)*50)var(--mds-filter-wrapper-shadow-color,rgb(var(--tone-neutral-06,158 158 158)))inset}}";
+const mdsFilterCss = () => `@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-filter-items-background-active:rgb(var(--tone-neutral-09,76 76 76));--mds-filter-items-background:rgb(var(--tone-neutral-09,76 76 76));--mds-filter-items-gap:calc(var(--spacing,.0025rem)*200);--mds-filter-items-padding:calc(var(--spacing,.0025rem)*200);--mds-filter-items-radius:var(--radius-full,1000px);--mds-filter-items-scroll-behavior:smooth;--mds-filter-label-padding:0 calc(var(--spacing,.0025rem)*600);--mds-filter-wrapper-shadow-color:rgb(var(--tone-neutral-06,158 158 158));--mds-filter-wrapper-shadow-opacity:.1}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),:is(mds-filter-item,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-filter-items-scroll-behavior{syntax:"smooth|auto";inherits:false;initial-value:smooth}@property --mds-filter-wrapper-shadow-opacity{syntax:"<number>";inherits:false;initial-value:.1}:host{--mds-filter-items-background-active:rgb(var(--tone-neutral-09,76 76 76));--mds-filter-items-background:rgb(var(--tone-neutral-09,76 76 76));--mds-filter-items-gap:calc(var(--spacing,.0025rem)*200);--mds-filter-items-padding:calc(var(--spacing,.0025rem)*200);--mds-filter-items-radius:var(--radius-full,1000px);--mds-filter-items-scroll-behavior:smooth;--mds-filter-label-padding:0 calc(var(--spacing,.0025rem)*600);--mds-filter-wrapper-shadow-color:rgb(var(--tone-neutral-06,158 158 158));--mds-filter-wrapper-shadow:0 0 0 2px var(--mds-filter-wrapper-shadow-color,rgb(var(--tone-neutral-06,158 158 158))) inset;--mds-filter-wrapper-shadow-opacity:.1;display:grid;gap:calc(var(--spacing,.0025rem)*100);grid-auto-rows:-webkit-min-content;grid-auto-rows:min-content}.items{-webkit-overflow-scrolling:touch;-ms-overflow-style:none;background-color:var(--mds-filter-items-background,rgb(var(--tone-neutral-09,76 76 76)));border-radius:var(--mds-filter-items-radius,var(--radius-full,1000px));display:flex;gap:var(--mds-filter-items-gap,calc(var(--spacing,.0025rem)*200));overflow:auto;padding:var(--mds-filter-items-padding,calc(var(--spacing,.0025rem)*200));position:relative;scroll-behavior:var(--mds-filter-items-scroll-behavior,smooth);-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-transition-duration:var(--duration-300,.3s);transition-duration:var(--duration-300,.3s);transition-property:background-color;-webkit-transition-timing-function:var(--ease-in-out-expo,cubic-bezier(1,0,0,1));transition-timing-function:var(--ease-in-out-expo,cubic-bezier(1,0,0,1))}.items-wrapper{display:grid;overflow:hidden;position:relative}.items-wrapper:after{border-radius:var(--mds-filter-items-radius,var(--radius-full,1000px));-webkit-box-shadow:var(--mds-filter-wrapper-shadow);box-shadow:var(--mds-filter-wrapper-shadow);content:"";inset:0;opacity:var(--mds-filter-wrapper-shadow-opacity,.1);pointer-events:none;position:absolute}.items::-webkit-scrollbar{display:none}.label{padding:var(--mds-filter-label-padding,0 calc(var(--spacing,.0025rem)*600))}.active{background-color:var(--mds-filter-items-background-active,rgb(var(--tone-neutral-09,76 76 76)))}.reset{display:flex;flex-grow:1;justify-content:flex-end;transform-origin:50%}.reset,.reset-button{transform:scale(0);-webkit-transition-duration:var(--duration-300,.3s);transition-duration:var(--duration-300,.3s);transition-property:transform;-webkit-transition-timing-function:var(--ease-in-out-expo,cubic-bezier(1,0,0,1));transition-timing-function:var(--ease-in-out-expo,cubic-bezier(1,0,0,1))}.reset-button-opened,:host([reset]:not([reset=false])) .reset{transform:scale(1)}:host-context(:root.pref-animation-reduce){--mds-filter-items-scroll-behavior:auto;transition-duration:0s}:is(:host-context(:root.pref-animation-reduce) .reset-button,:host-context(:root.pref-animation-reduce) .items){transition-duration:0s}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)) .items{--mds-filter-items-background-active:rgb(var(--tone-neutral-10,60 60 60));--mds-filter-items-background:rgb(var(--tone-neutral-09,76 76 76))}:host-context(:root.pref-contrast-more){--mds-filter-items-background-active:rgb(var(--tone-neutral-09,76 76 76));--mds-filter-items-background:rgb(var(--tone-neutral-10,60 60 60));--mds-filter-wrapper-shadow-opacity:30%;--mds-filter-wrapper-shadow-color:rgb(var(--tone-neutral-07,134 134 134));--mds-filter-wrapper-shadow:0 0 0 calc(var(--spacing,.0025rem)*50) var(--mds-filter-wrapper-shadow-color,rgb(var(--tone-neutral-06,158 158 158))) inset}@media (prefers-reduced-motion){:is(:host-context(:root.pref-animation-system),:host-context(:root:not([data-magma-pref]))){--mds-filter-items-scroll-behavior:auto;transition-duration:0s}:is(:host-context(:root.pref-animation-system),:host-context(:root:not([data-magma-pref]))) .items,:is(:host-context(:root.pref-animation-system),:host-context(:root:not([data-magma-pref]))) .reset-button{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]))) .items{--mds-filter-items-background-active:rgb(var(--tone-neutral-10,60 60 60));--mds-filter-items-background: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-filter-items-background-active:rgb(var(--tone-neutral-09,76 76 76));--mds-filter-items-background:rgb(var(--tone-neutral-10,60 60 60));--mds-filter-wrapper-shadow-opacity:30%;--mds-filter-wrapper-shadow-color:rgb(var(--tone-neutral-07,134 134 134));--mds-filter-wrapper-shadow:0 0 0 calc(var(--spacing,.0025rem)*50) var(--mds-filter-wrapper-shadow-color,rgb(var(--tone-neutral-06,158 158 158))) inset}}`;
 
 const MdsFilter = class {
     constructor(hostRef) {
@@ -101,6 +101,6 @@ const MdsFilter = class {
     }
     get element() { return getElement(this); }
 };
-MdsFilter.style = mdsFilterCss;
+MdsFilter.style = mdsFilterCss();
 
 export { MdsFilter as mds_filter };

package/dist/esm/mds-header-bar.entry.js

@@ -1,8 +1,8 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-BfAC4pqU.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-CAd5312P.js';
 
 var miRoundMenu = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M4 18h16c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1s.45 1 1 1zm0-5h16c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1s.45 1 1 1zM3 7c0 .55.45 1 1 1h16c.55 0 1-.45 1-1s-.45-1-1-1H4c-.55 0-1 .45-1 1z"/></svg>`;
 
-const mdsHeaderBarCss = "@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-header-bar-hamburger-color:rgb(var(--tone-neutral-03,233 233 233))}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),mds-button: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-header-bar-hamburger-color:rgb(var(--tone-neutral-03,233 233 233));background-color:rgb(var(--tone-neutral,0 0 0));-webkit-box-shadow:var(--shadow-md-sharp,0 0 1px 1px #0000000f,0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f);box-shadow:var(--shadow-md-sharp,0 0 1px 1px #0000000f,0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f);interpolate-size:allow-keywords;display:flex;inset:0 0 auto;justify-content:center;margin-left:auto;margin-right:auto;max-width:100%;padding:calc(var(--spacing,.0025rem)*400)calc(var(--spacing,.0025rem)*600);position:fixed;transition-duration:.5s;transition-property:background-color,border-radius,margin,max-width,transform,width;-webkit-transition-timing-function:var(--ease-out-expo,cubic-bezier(.19,1,.22,1));transition-timing-function:var(--ease-out-expo,cubic-bezier(.19,1,.22,1));width:auto;z-index:var(--mds-header-z-index,1000)}.logo{color:inherit;display:flex}.content{align-items:center;display:flex;flex-grow:1;gap:calc(var(--spacing,.0025rem)*400);justify-content:space-between;max-width:var(--breakpoint-wide,1280px)}.actions{display:flex;gap:calc(var(--spacing,.0025rem)*600)}.nav{display:inline-flex;flex-shrink:0;gap:calc(var(--spacing,.0025rem)*400)}.menu{--mds-button-border-opacity:0;fill:var(--mds-header-bar-hamburger-color,rgb(var(--tone-neutral-03,233 233 233)));padding:0}.menu::part(icon){width:calc(var(--spacing,.0025rem)*800)}:host([menu=none]) .menu,:host([nav=none]) .nav{display:none}:host-context(:root.pref-animation-reduce){transition-duration:0s}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){background-color:rgb(var(--tone-neutral-10,60 60 60));-webkit-box-shadow:var(--shadow-outline),var(--shadow-lg,0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a);box-shadow:var(--shadow-outline),var(--shadow-lg,0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a)}:host-context(:root.pref-contrast-more){--mds-header-bar-hamburger-color:rgb(var(--tone-neutral-01,255 255 255));-webkit-box-shadow:var(--shadow-outline-strong-50),var(--shadow-2xl,0 25px 50px -12px #00000040);box-shadow:var(--shadow-outline-strong-50),var(--shadow-2xl,0 25px 50px -12px #00000040)}@media not all and (min-width:768px){:host([menu=desktop]) .menu,:host([nav=desktop]) .nav{display:none}}@media (min-width:1024px){:host([menu=mobile]) .menu,:host([nav=mobile]) .nav{display:none}}@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]))){background-color:rgb(var(--tone-neutral-10,60 60 60));-webkit-box-shadow:var(--shadow-outline),var(--shadow-lg,0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a);box-shadow:var(--shadow-outline),var(--shadow-lg,0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a)}}@media (prefers-contrast:more){:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))){--mds-header-bar-hamburger-color:rgb(var(--tone-neutral-01,255 255 255));-webkit-box-shadow:var(--shadow-outline-strong-50),var(--shadow-2xl,0 25px 50px -12px #00000040);box-shadow:var(--shadow-outline-strong-50),var(--shadow-2xl,0 25px 50px -12px #00000040)}}";
+const mdsHeaderBarCss = () => `@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-header-bar-hamburger-color:rgb(var(--tone-neutral-03,233 233 233))}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),mds-button: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-header-bar-hamburger-color:rgb(var(--tone-neutral-03,233 233 233));background-color:rgb(var(--tone-neutral,0 0 0));-webkit-box-shadow:var(--shadow-md-sharp,0 0 1px 1px #0000000f,0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f);box-shadow:var(--shadow-md-sharp,0 0 1px 1px #0000000f,0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f);interpolate-size:allow-keywords;display:flex;inset:0 0 auto;justify-content:center;margin-left:auto;margin-right:auto;max-width:100%;padding:calc(var(--spacing,.0025rem)*400) calc(var(--spacing,.0025rem)*600);position:fixed;transition-duration:.5s;transition-property:background-color,border-radius,margin,max-width,transform,width;-webkit-transition-timing-function:var(--ease-out-expo,cubic-bezier(.19,1,.22,1));transition-timing-function:var(--ease-out-expo,cubic-bezier(.19,1,.22,1));width:auto;z-index:var(--mds-header-z-index,1000)}.logo{color:inherit;display:flex}.content{align-items:center;display:flex;flex-grow:1;gap:calc(var(--spacing,.0025rem)*400);justify-content:space-between;max-width:var(--breakpoint-wide,1280px)}.actions{display:flex;gap:calc(var(--spacing,.0025rem)*600)}.nav{display:inline-flex;flex-shrink:0;gap:calc(var(--spacing,.0025rem)*400)}.menu{--mds-button-border-opacity:0;fill:var(--mds-header-bar-hamburger-color,rgb(var(--tone-neutral-03,233 233 233)));padding:0}.menu::part(icon){width:calc(var(--spacing,.0025rem)*800)}:host([menu=none]) .menu,:host([nav=none]) .nav{display:none}:host-context(:root.pref-animation-reduce){transition-duration:0s}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){background-color:rgb(var(--tone-neutral-10,60 60 60));-webkit-box-shadow:var(--shadow-outline),var(--shadow-lg,0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a);box-shadow:var(--shadow-outline),var(--shadow-lg,0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a)}:host-context(:root.pref-contrast-more){--mds-header-bar-hamburger-color:rgb(var(--tone-neutral-01,255 255 255));-webkit-box-shadow:var(--shadow-outline-strong-50),var(--shadow-2xl,0 25px 50px -12px #00000040);box-shadow:var(--shadow-outline-strong-50),var(--shadow-2xl,0 25px 50px -12px #00000040)}@media not all and (min-width:768px){:host([menu=desktop]) .menu,:host([nav=desktop]) .nav{display:none}}@media (min-width:1024px){:host([menu=mobile]) .menu,:host([nav=mobile]) .nav{display:none}}@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]))){background-color:rgb(var(--tone-neutral-10,60 60 60));-webkit-box-shadow:var(--shadow-outline),var(--shadow-lg,0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a);box-shadow:var(--shadow-outline),var(--shadow-lg,0 10px 15px -3px #0000001a,0 4px 6px -4px #0000001a)}}@media (prefers-contrast:more){:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))){--mds-header-bar-hamburger-color:rgb(var(--tone-neutral-01,255 255 255));-webkit-box-shadow:var(--shadow-outline-strong-50),var(--shadow-2xl,0 25px 50px -12px #00000040);box-shadow:var(--shadow-outline-strong-50),var(--shadow-2xl,0 25px 50px -12px #00000040)}}`;
 
 const MdsHeaderBar = class {
     constructor(hostRef) {
@@ -34,6 +34,6 @@ const MdsHeaderBar = class {
     }
     get host() { return getElement(this); }
 };
-MdsHeaderBar.style = mdsHeaderBarCss;
+MdsHeaderBar.style = mdsHeaderBarCss();
 
 export { MdsHeaderBar as mds_header_bar };

package/dist/esm/mds-header.entry.js

@@ -1,6 +1,6 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-BfAC4pqU.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-CAd5312P.js';
 
-const mdsHeaderCss = "@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-header-color:rgb(var(--tone-neutral-02,244 244 244));--mds-header-icon-color:var(--mds-header-color,rgb(var(--tone-neutral-02,244 244 244)));--mds-header-modal-icon-color:rgb(var(--tone-neutral,0 0 0));--mds-header-backdrop-height:calc(var(--spacing,.0025rem)*1600);--mds-header-inline-margin-mobile:calc(var(--spacing,.0025rem)*400);--mds-header-inline-margin:calc(var(--spacing,.0025rem)*600);--mds-header-z-index:var(--magma-header-z-index,1000);--mds-header-backdrop-show:true;--mds-header-backdrop-blur-strength:2px}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),mds-modal: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-header-backdrop-show{syntax:\"true|false\";inherits:false;initial-value:true}@property --mds-header-backdrop-blur-strength{syntax:\"<length>\";inherits:false;initial-value:2px}:host{--mds-header-color:rgb(var(--tone-neutral-02,244 244 244));--mds-header-hidden-bar-translate-inline:translateY(-150%);--mds-header-hidden-bar-translate-stripe:translateY(-110%);--mds-header-icon-color:var(--mds-header-color,rgb(var(--tone-neutral-02,244 244 244)));--mds-header-modal-icon-color:rgb(var(--tone-neutral,0 0 0));--mds-header-backdrop-blur-strength:2px;--mds-header-backdrop-height:calc(var(--spacing,.0025rem)*1600);--mds-header-backdrop-show:true;--mds-header-z-index:var(--magma-header-z-index,1000);--mds-header-inline-margin-mobile:calc(var(--spacing,.0025rem)*400);--mds-header-inline-margin:calc(var(--spacing,.0025rem)*600);--mds-header-backdrop-background-image:linear-gradient(0deg,#0000,#00000026);--private-mask-opacity:1;color:var(--mds-header-color,rgb(var(--tone-neutral-02,244 244 244)));fill:var(--mds-header-icon-color,var(--mds-header-color,rgb(var(--tone-neutral-02,244 244 244))));position:relative;z-index:var(--mds-header-z-index,var(--magma-header-z-index,1000))}.modal{--mds-modal-close-icon-color:var(--mds-header-modal-icon-color,rgb(var(--tone-neutral,0 0 0)));z-index:var(--mds-header-z-index,var(--magma-header-z-index,1000))}:host([appearance=inline]) ::slotted(mds-header-bar){--mds-header-inline-margin-current:var(--mds-header-inline-margin,calc(var(--spacing,.0025rem)*600));border-radius:var(--radius-lg,16px);margin-bottom:var(--mds-header-inline-margin-current);margin-top:var(--mds-header-inline-margin-current);max-width:var(--breakpoint-wide,1280px);width:calc(100% - var(--mds-header-inline-margin-current)*2)}:host([menu=none]) .menu{display:none}:host([visibility=hidden][appearance=stripe]) ::slotted(mds-header-bar){-webkit-transform:var(--mds-header-hidden-bar-translate-stripe);transform:var(--mds-header-hidden-bar-translate-stripe)}:host([visibility=hidden][appearance=inline]) ::slotted(mds-header-bar){-webkit-transform:var(--mds-header-hidden-bar-translate-inline);transform:var(--mds-header-hidden-bar-translate-inline)}.backdrop{align-items:center;-webkit-backdrop-filter:blur(var(--mds-header-backdrop-blur-strength,10px));backdrop-filter:blur(var(--mds-header-backdrop-blur-strength,10px));background-image:var(--mds-header-backdrop-background-image);content:\"\";display:flex;height:var(--mds-header-backdrop-height,calc(var(--spacing,.0025rem)*1600));inset:0;opacity:1;position:fixed;transform:translate(0);transition-duration:.2s;transition-property:opacity,transform;width:100%}.backdrop-blur-item{--private-gradient-position:calc(100% - (sibling-count() - sibling-index())*5%);display:none}.backdrop-blur-item:first-child{--private-gradient-position:100%}.backdrop-blur-item:nth-child(2){--private-gradient-position:95%}.backdrop-blur-item:nth-child(3){--private-gradient-position:90%}.backdrop-blur-item:nth-child(4){--private-gradient-position:85%}.backdrop-blur-item:nth-child(5){--private-gradient-position:80%}.backdrop-blur-item:nth-child(6){--private-gradient-position:75%}.backdrop-blur-item:nth-child(7){--private-gradient-position:70%}.backdrop-blur-item:nth-child(8){--private-gradient-position:65%}.backdrop-blur-item:nth-child(9){--private-gradient-position:60%}.backdrop-blur-item:nth-child(10){--private-gradient-position:55%}.backdrop-blur-item:nth-child(11){--private-gradient-position:50%}@supports ((-webkit-mask-image:linear-gradient(rgb(0 0 0/1),transparent)) or (mask-image:linear-gradient(rgb(0 0 0/1),transparent))){.backdrop{-webkit-backdrop-filter:none;backdrop-filter:none;background-image:none}.backdrop-blur-item{-webkit-backdrop-filter:blur(var(--mds-header-backdrop-blur-strength,1px));backdrop-filter:blur(var(--mds-header-backdrop-blur-strength,1px));display:flex;inset:0;-webkit-mask-image:-webkit-gradient(linear,left top,left bottom,color-stop(40%,rgb(0 0 0/var(--private-mask-opacity,1))),to(#0000));mask-image:-webkit-gradient(linear,left top,left bottom,color-stop(40%,rgb(0 0 0/var(--private-mask-opacity,1))),to(#0000));-webkit-mask-image:linear-gradient(to bottom,rgb(0 0 0/var(--private-mask-opacity,1)) 40%,#0000 var(--private-gradient-position,100%));mask-image:linear-gradient(to bottom,rgb(0 0 0/var(--private-mask-opacity,1)) 40%,#0000 var(--private-gradient-position,100%));pointer-events:none;position:absolute}}:host([appearance=inline]) .backdrop{transform:translate(0)}:host([appearance=stripe]) .backdrop,:host([visibility=hidden]) .backdrop{--mds-header-backdrop-blur-strength:0px;transform:translateY(-100%)}@container style(--mds-header-backdrop-show:false){:host-context(:not(.safari)) .backdrop{display:none}}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){--mds-header-modal-icon-color:rgb(var(--tone-neutral-01,255 255 255))}:host-context(:root.pref-consumption-high) .backdrop{--mds-header-backdrop-background-image:none}:host-context(:root.pref-consumption-medium) .backdrop{--mds-header-backdrop-blur-strength:1px}:host-context(:root.pref-consumption-low) .backdrop{--mds-header-backdrop-blur-strength:0px;display:none}@media (max-width:767px){:host([appearance=inline]) ::slotted(mds-header-bar){--mds-header-inline-margin-current:var(--mds-header-inline-margin-mobile,calc(var(--spacing,.0025rem)*400))}}@media not all and (min-width:768px){:host([menu=desktop]) .menu{display:none}}@media (min-width:1024px){:host([menu=mobile]) .menu{display:none}}@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-header-modal-icon-color:rgb(var(--tone-neutral-01,255 255 255))}}";
+const mdsHeaderCss = () => `@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-header-color:rgb(var(--tone-neutral-02,244 244 244));--mds-header-icon-color:var(--mds-header-color,rgb(var(--tone-neutral-02,244 244 244)));--mds-header-modal-icon-color:rgb(var(--tone-neutral,0 0 0));--mds-header-backdrop-height:calc(var(--spacing,.0025rem)*1600);--mds-header-inline-margin-mobile:calc(var(--spacing,.0025rem)*400);--mds-header-inline-margin:calc(var(--spacing,.0025rem)*600);--mds-header-z-index:var(--magma-header-z-index,1000);--mds-header-backdrop-show:true;--mds-header-backdrop-blur-strength:2px}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),mds-modal: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-header-backdrop-show{syntax:"true|false";inherits:false;initial-value:true}@property --mds-header-backdrop-blur-strength{syntax:"<length>";inherits:false;initial-value:2px}:host{--mds-header-color:rgb(var(--tone-neutral-02,244 244 244));--mds-header-hidden-bar-translate-inline:translateY(-150%);--mds-header-hidden-bar-translate-stripe:translateY(-110%);--mds-header-icon-color:var(--mds-header-color,rgb(var(--tone-neutral-02,244 244 244)));--mds-header-modal-icon-color:rgb(var(--tone-neutral,0 0 0));--mds-header-backdrop-blur-strength:2px;--mds-header-backdrop-height:calc(var(--spacing,.0025rem)*1600);--mds-header-backdrop-show:true;--mds-header-z-index:var(--magma-header-z-index,1000);--mds-header-inline-margin-mobile:calc(var(--spacing,.0025rem)*400);--mds-header-inline-margin:calc(var(--spacing,.0025rem)*600);--mds-header-backdrop-background-image:linear-gradient(0deg,#0000,#00000026);--private-mask-opacity:1;color:var(--mds-header-color,rgb(var(--tone-neutral-02,244 244 244)));fill:var(--mds-header-icon-color,var(--mds-header-color,rgb(var(--tone-neutral-02,244 244 244))));position:relative;z-index:var(--mds-header-z-index,var(--magma-header-z-index,1000))}.modal{--mds-modal-close-icon-color:var(--mds-header-modal-icon-color,rgb(var(--tone-neutral,0 0 0)));z-index:var(--mds-header-z-index,var(--magma-header-z-index,1000))}:host([appearance=inline]) ::slotted(mds-header-bar){--mds-header-inline-margin-current:var(--mds-header-inline-margin,calc(var(--spacing,.0025rem)*600));border-radius:var(--radius-lg,16px);margin-bottom:var(--mds-header-inline-margin-current);margin-top:var(--mds-header-inline-margin-current);max-width:var(--breakpoint-wide,1280px);width:calc(100% - var(--mds-header-inline-margin-current)*2)}:host([menu=none]) .menu{display:none}:host([visibility=hidden][appearance=stripe]) ::slotted(mds-header-bar){-webkit-transform:var(--mds-header-hidden-bar-translate-stripe);transform:var(--mds-header-hidden-bar-translate-stripe)}:host([visibility=hidden][appearance=inline]) ::slotted(mds-header-bar){-webkit-transform:var(--mds-header-hidden-bar-translate-inline);transform:var(--mds-header-hidden-bar-translate-inline)}.backdrop{align-items:center;-webkit-backdrop-filter:blur(var(--mds-header-backdrop-blur-strength,10px));backdrop-filter:blur(var(--mds-header-backdrop-blur-strength,10px));background-image:var(--mds-header-backdrop-background-image);content:"";display:flex;height:var(--mds-header-backdrop-height,calc(var(--spacing,.0025rem)*1600));inset:0;opacity:1;position:fixed;transform:translate(0);transition-duration:.2s;transition-property:opacity,transform;width:100%}.backdrop-blur-item{--private-gradient-position:calc(100% - (sibling-count() - sibling-index())*5%);display:none}.backdrop-blur-item:first-child{--private-gradient-position:100%}.backdrop-blur-item:nth-child(2){--private-gradient-position:95%}.backdrop-blur-item:nth-child(3){--private-gradient-position:90%}.backdrop-blur-item:nth-child(4){--private-gradient-position:85%}.backdrop-blur-item:nth-child(5){--private-gradient-position:80%}.backdrop-blur-item:nth-child(6){--private-gradient-position:75%}.backdrop-blur-item:nth-child(7){--private-gradient-position:70%}.backdrop-blur-item:nth-child(8){--private-gradient-position:65%}.backdrop-blur-item:nth-child(9){--private-gradient-position:60%}.backdrop-blur-item:nth-child(10){--private-gradient-position:55%}.backdrop-blur-item:nth-child(11){--private-gradient-position:50%}@supports ((-webkit-mask-image:linear-gradient(rgb(0 0 0/1),transparent)) or (mask-image:linear-gradient(rgb(0 0 0/1),transparent))){.backdrop{-webkit-backdrop-filter:none;backdrop-filter:none;background-image:none}.backdrop-blur-item{-webkit-backdrop-filter:blur(var(--mds-header-backdrop-blur-strength,1px));backdrop-filter:blur(var(--mds-header-backdrop-blur-strength,1px));display:flex;inset:0;-webkit-mask-image:-webkit-gradient(linear,left top,left bottom,color-stop(40%,rgb(0 0 0/var(--private-mask-opacity,1))),to(#0000));mask-image:-webkit-gradient(linear,left top,left bottom,color-stop(40%,rgb(0 0 0/var(--private-mask-opacity,1))),to(#0000));-webkit-mask-image:linear-gradient(to bottom,rgb(0 0 0/var(--private-mask-opacity,1)) 40%,#0000 var(--private-gradient-position,100%));mask-image:linear-gradient(to bottom,rgb(0 0 0/var(--private-mask-opacity,1)) 40%,#0000 var(--private-gradient-position,100%));pointer-events:none;position:absolute}}:host([appearance=inline]) .backdrop{transform:translate(0)}:host([appearance=stripe]) .backdrop,:host([visibility=hidden]) .backdrop{--mds-header-backdrop-blur-strength:0px;transform:translateY(-100%)}@container style(--mds-header-backdrop-show:false){:host-context(:not(.safari)) .backdrop{display:none}}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){--mds-header-modal-icon-color:rgb(var(--tone-neutral-01,255 255 255))}:host-context(:root.pref-consumption-high) .backdrop{--mds-header-backdrop-background-image:none}:host-context(:root.pref-consumption-medium) .backdrop{--mds-header-backdrop-blur-strength:1px}:host-context(:root.pref-consumption-low) .backdrop{--mds-header-backdrop-blur-strength:0px;display:none}@media (max-width:767px){:host([appearance=inline]) ::slotted(mds-header-bar){--mds-header-inline-margin-current:var(--mds-header-inline-margin-mobile,calc(var(--spacing,.0025rem)*400))}}@media not all and (min-width:768px){:host([menu=desktop]) .menu{display:none}}@media (min-width:1024px){:host([menu=mobile]) .menu{display:none}}@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-header-modal-icon-color:rgb(var(--tone-neutral-01,255 255 255))}}`;
 
 const MdsHeader = class {
     constructor(hostRef) {
@@ -178,12 +178,20 @@ const MdsHeader = class {
     }
     get host() { return getElement(this); }
     static get watchers() { return {
-        "menu": ["onMenuChangedHandler"],
-        "nav": ["onNavChangedHandler"],
-        "appearanceSet": ["onAppearanceSetChangedHandler"],
-        "visibility": ["handleVisibilityChange"]
+        "menu": [{
+                "onMenuChangedHandler": 0
+            }],
+        "nav": [{
+                "onNavChangedHandler": 0
+            }],
+        "appearanceSet": [{
+                "onAppearanceSetChangedHandler": 0
+            }],
+        "visibility": [{
+                "handleVisibilityChange": 0
+            }]
     }; }
 };
-MdsHeader.style = mdsHeaderCss;
+MdsHeader.style = mdsHeaderCss();
 
 export { MdsHeader as mds_header };

package/dist/esm/mds-horizontal-scroll.entry.js

@@ -1,10 +1,10 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-BfAC4pqU.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-CAd5312P.js';
 import { m as miBaselineArrowBack } from './arrow-back-DnEUG7st.js';
 import { m as miBaselineArrowForward } from './arrow-forward-Bd0uuNDE.js';
 import { c as clsx } from './clsx-ChV9xqsO.js';
 import { a as cssSizeToNumber } from './unit-D8eZRaSQ.js';
 
-const mdsHorizontalScrollCss = "@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-horizontal-scroll-dots-gap:calc(var(--spacing,.0025rem)*100);--mds-horizontal-scroll-dot-size:calc(var(--spacing,.0025rem)*200);--mds-horizontal-scroll-contents-padding:calc(var(--spacing,.0025rem)*600);--mds-horizontal-scroll-contents-scroll-padding:0 calc(var(--spacing,.0025rem)*600);--mds-horizontal-scroll-controls-margin:calc(var(--spacing,.0025rem)*1200);--mds-horizontal-scroll-gap:calc(var(--spacing,.0025rem)*600);--mds-horizontal-scroll-max-width:var(--breakpoint-wide,1280px);--mds-horizontal-scroll-scrollbar-margin:0;--mds-horizontal-scroll-scrollbar-radius:0;--mds-horizontal-scroll-scrollbar-size:calc(var(--spacing,.0025rem)*200);--mds-horizontal-scroll-dot-background:rgb(var(--tone-neutral,0 0 0));--mds-horizontal-scroll-dot-area-background:rgb(var(--tone-neutral-08,107 107 107));--mds-horizontal-scroll-scrollbar-thumb-background:rgb(var(--tone-neutral-02,244 244 244)/.3);--mds-horizontal-scroll-scrollbar-track-background:rgb(var(--tone-neutral-06,158 158 158)/.3)}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),mds-button: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-horizontal-scroll-scrollbar-margin{syntax:\"<length>\";inherits:false;initial-value:0}@property --mds-horizontal-scroll-scrollbar-radius{syntax:\"<length>\";inherits:false;initial-value:0}:host{--mds-horizontal-scroll-behavior:smooth;--mds-horizontal-scroll-dots-gap:calc(var(--spacing,.0025rem)*100);--mds-horizontal-scroll-dot-size:calc(var(--spacing,.0025rem)*200);--mds-horizontal-scroll-dot-max-width:auto;--mds-horizontal-scroll-dot-background:rgb(var(--tone-neutral,0 0 0));--mds-horizontal-scroll-dot-area-background:rgb(var(--tone-neutral-08,107 107 107));--mds-horizontal-scroll-contents-padding:calc(var(--spacing,.0025rem)*600);--mds-horizontal-scroll-contents-scroll-padding:0 calc(var(--spacing,.0025rem)*600);--mds-horizontal-scroll-controls-margin:calc(var(--spacing,.0025rem)*1200);--mds-horizontal-scroll-gap:calc(var(--spacing,.0025rem)*600);--mds-horizontal-scroll-max-width:var(--breakpoint-wide,1280px);--mds-horizontal-scroll-scrollbar-margin:0;--mds-horizontal-scroll-scrollbar-radius:0;--mds-horizontal-scroll-scrollbar-size:calc(var(--spacing,.0025rem)*200);--mds-horizontal-scroll-scrollbar-thumb-background:rgb(var(--tone-neutral-02,244 244 244)/.3);--mds-horizontal-scroll-scrollbar-track-background:rgb(var(--tone-neutral-06,158 158 158)/.3);--max-width:var(--mds-horizontal-scroll-max-width,var(--breakpoint-wide,1280px));--scroll-margin:calc(((100svw - var(--max-width))/2) + (var(--mds-horizontal-scroll-controls-margin,calc(var(--spacing,.0025rem)*1200))*2));align-items:center;container:mds-horizontal-scroll/inline-size;display:flex;flex-direction:column;justify-content:center;position:relative;width:100%}.navigation{border-radius:1000px;display:none;padding:0;position:absolute;top:50%;transform:translateY(-50%);transition-duration:.2s;transition-property:opacity,scale,transform}.contents{box-sizing:border-box;display:flex;gap:var(--mds-horizontal-scroll-gap,calc(var(--spacing,.0025rem)*600));overflow:auto;padding-bottom:var(--mds-horizontal-scroll-contents-padding,calc(var(--spacing,.0025rem)*600));padding-top:var(--mds-horizontal-scroll-contents-padding,calc(var(--spacing,.0025rem)*600));position:relative;scroll-behavior:var(--mds-horizontal-scroll-behavior);scroll-padding:var(--mds-horizontal-scroll-contents-scroll-padding,0 calc(var(--spacing,.0025rem)*600));-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;width:100%}.contents>::slotted(*){flex:0 0 0;scroll-margin:0 var(--scroll-margin)}.spacer{--width:calc(var(--scroll-margin) - var(--mds-horizontal-scroll-gap,calc(var(--spacing,.0025rem)*600)));content:\"\";display:block;flex:0 0 0;min-width:clamp(1px,var(--width),var(--width));scroll-margin:0 var(--scroll-margin)}@container (max-width:1024px){:host{--scroll-margin:var(--mds-horizontal-scroll-contents-scroll-padding,0 calc(var(--spacing,.0025rem)*600))}.contents{scroll-padding:var(--mds-horizontal-scroll-contents-scroll-padding,0 calc(var(--spacing,.0025rem)*600))}.contents>::slotted(*){scroll-margin:0 var(--mds-horizontal-scroll-contents-scroll-padding,0 calc(var(--spacing,.0025rem)*600))}}:host-context(:root.pref-animation-reduce){--mds-horizontal-scroll-behavior:auto}.navigation--back{left:clamp(calc(var(--mds-horizontal-scroll-gap,calc(var(--spacing,.0025rem)*600))/2),var(--position),var(--position))}.navigation--back,.navigation--forward{--position:calc(var(--scroll-margin) - var(--mds-horizontal-scroll-gap,calc(var(--spacing,.0025rem)*600)) - var(--mds-horizontal-scroll-controls-margin,calc(var(--spacing,.0025rem)*1200)))}.navigation--forward{right:clamp(calc(var(--mds-horizontal-scroll-gap,calc(var(--spacing,.0025rem)*600))/2),var(--position),var(--position))}.navigation--disabled{opacity:0;pointer-events:none;transform:translateY(-50%)scale(.5)}:host([controls=all]) .navigation{display:flex}.dot-navigation{align-self:center;background-color:var(--mds-horizontal-scroll-dot-area-background,rgb(var(--tone-neutral-08,107 107 107)));border-radius:200px;display:none;gap:var(--mds-horizontal-scroll-dots-gap,calc(var(--spacing,.0025rem)*100));justify-content:start;margin:0 auto var(--mds-horizontal-scroll-contents-padding,calc(var(--spacing,.0025rem)*600))auto;max-width:calc(var(--spacing,.0025rem)*4000);padding:calc(var(--spacing,.0025rem)*50);width:100%}:host([navigation=position]) .dot-navigation{display:inline-flex}.dot{background-color:var(--mds-horizontal-scroll-dot-background,rgb(var(--tone-neutral,0 0 0)));border-radius:200px;height:var(--mds-horizontal-scroll-dot-size,calc(var(--spacing,.0025rem)*200));max-width:var(--mds-horizontal-scroll-dot-max-width);min-width:var(--mds-horizontal-scroll-dot-size,calc(var(--spacing,.0025rem)*200));transition-duration:.3s;transition-property:width;-webkit-transition-timing-function:var(--ease-out-expo,cubic-bezier(.19,1,.22,1));transition-timing-function:var(--ease-out-expo,cubic-bezier(.19,1,.22,1));width:calc(var(--mds-horizontal-scroll-dot-size,calc(var(--spacing,.0025rem)*200))*2)}:host(:not([navigation=scrollbar])) .contents{-webkit-overflow-scrolling:touch;-ms-overflow-style:none;scrollbar-width:none}:host(:not([navigation=scrollbar])) .contents::-webkit-scrollbar{display:none}:host([navigation=scrollbar]) .contents::-webkit-scrollbar{height:var(--mds-horizontal-scroll-scrollbar-size,calc(var(--spacing,.0025rem)*200));width:var(--mds-horizontal-scroll-scrollbar-size,calc(var(--spacing,.0025rem)*200))}:host([navigation=scrollbar]) .contents::-webkit-scrollbar-track{background-color:var(--mds-horizontal-scroll-scrollbar-track-background,rgb(var(--tone-neutral-06,158 158 158)/.3));border-radius:var(--mds-horizontal-scroll-scrollbar-radius,0);margin-block:var(--mds-horizontal-scroll-scrollbar-margin,0);margin-inline:var(--mds-horizontal-scroll-scrollbar-margin,0)}:host([navigation=scrollbar]) .contents::-webkit-scrollbar-thumb{background-color:var(--mds-horizontal-scroll-scrollbar-thumb-background,rgb(var(--tone-neutral-02,244 244 244)/.3));border-radius:var(--mds-horizontal-scroll-scrollbar-radius,0)}@supports (scrollbar-color:transparent transparent){.contents{scrollbar-color:var(--mds-horizontal-scroll-scrollbar-thumb-background,rgb(var(--tone-neutral-02,244 244 244)/.3))var(--mds-horizontal-scroll-scrollbar-track-background,rgb(var(--tone-neutral-06,158 158 158)/.3));scrollbar-width:thin}}:host([snap=start]) .contents>::slotted(*){scroll-snap-align:start}:host([snap=center]) .contents>::slotted(*){scroll-snap-align:center}:host([snap=end]) .contents>::slotted(*){scroll-snap-align:end}@media (prefers-reduced-motion){:is(:host-context(:root.pref-animation-system),:host-context(:root:not([data-magma-pref]))){--mds-horizontal-scroll-behavior:auto}}@media (min-width:1920px){:host([controls=tv]) .navigation{display:flex}}@media (min-width:1600px){:host([controls=xlarge]) .navigation{display:flex}}@media (min-width:1440px){:host([controls=large]) .navigation{display:flex}}@media (min-width:1280px){:host([controls=wide]) .navigation{display:flex}}@media (min-width:1024px){:host([controls=desktop]) .navigation{display:flex}}@media (min-width:768px){:host([controls=tablet]) .navigation{display:flex}}";
+const mdsHorizontalScrollCss = () => `@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-horizontal-scroll-dots-gap:calc(var(--spacing,.0025rem)*100);--mds-horizontal-scroll-dot-size:calc(var(--spacing,.0025rem)*200);--mds-horizontal-scroll-contents-padding:calc(var(--spacing,.0025rem)*600);--mds-horizontal-scroll-contents-scroll-padding:0 calc(var(--spacing,.0025rem)*600);--mds-horizontal-scroll-controls-margin:calc(var(--spacing,.0025rem)*1200);--mds-horizontal-scroll-gap:calc(var(--spacing,.0025rem)*600);--mds-horizontal-scroll-max-width:var(--breakpoint-wide,1280px);--mds-horizontal-scroll-scrollbar-margin:0;--mds-horizontal-scroll-scrollbar-radius:0;--mds-horizontal-scroll-scrollbar-size:calc(var(--spacing,.0025rem)*200);--mds-horizontal-scroll-dot-background:rgb(var(--tone-neutral,0 0 0));--mds-horizontal-scroll-dot-area-background:rgb(var(--tone-neutral-08,107 107 107));--mds-horizontal-scroll-scrollbar-thumb-background:rgb(var(--tone-neutral-02,244 244 244)/.3);--mds-horizontal-scroll-scrollbar-track-background:rgb(var(--tone-neutral-06,158 158 158)/.3)}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),mds-button: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-horizontal-scroll-scrollbar-margin{syntax:"<length>";inherits:false;initial-value:0}@property --mds-horizontal-scroll-scrollbar-radius{syntax:"<length>";inherits:false;initial-value:0}:host{--mds-horizontal-scroll-behavior:smooth;--mds-horizontal-scroll-dots-gap:calc(var(--spacing,.0025rem)*100);--mds-horizontal-scroll-dot-size:calc(var(--spacing,.0025rem)*200);--mds-horizontal-scroll-dot-max-width:auto;--mds-horizontal-scroll-dot-background:rgb(var(--tone-neutral,0 0 0));--mds-horizontal-scroll-dot-area-background:rgb(var(--tone-neutral-08,107 107 107));--mds-horizontal-scroll-contents-padding:calc(var(--spacing,.0025rem)*600);--mds-horizontal-scroll-contents-scroll-padding:0 calc(var(--spacing,.0025rem)*600);--mds-horizontal-scroll-controls-margin:calc(var(--spacing,.0025rem)*1200);--mds-horizontal-scroll-gap:calc(var(--spacing,.0025rem)*600);--mds-horizontal-scroll-max-width:var(--breakpoint-wide,1280px);--mds-horizontal-scroll-scrollbar-margin:0;--mds-horizontal-scroll-scrollbar-radius:0;--mds-horizontal-scroll-scrollbar-size:calc(var(--spacing,.0025rem)*200);--mds-horizontal-scroll-scrollbar-thumb-background:rgb(var(--tone-neutral-02,244 244 244)/.3);--mds-horizontal-scroll-scrollbar-track-background:rgb(var(--tone-neutral-06,158 158 158)/.3);--max-width:var(--mds-horizontal-scroll-max-width,var(--breakpoint-wide,1280px));--scroll-margin:calc(((100svw - var(--max-width)) / 2) + (var(--mds-horizontal-scroll-controls-margin,calc(var(--spacing,.0025rem) * 1200)) * 2));align-items:center;container:mds-horizontal-scroll/inline-size;display:flex;flex-direction:column;justify-content:center;position:relative;width:100%}.navigation{border-radius:1000px;display:none;padding:0;position:absolute;top:50%;transform:translateY(-50%);transition-duration:.2s;transition-property:opacity,scale,transform}.contents{box-sizing:border-box;display:flex;gap:var(--mds-horizontal-scroll-gap,calc(var(--spacing,.0025rem)*600));overflow:auto;padding-bottom:var(--mds-horizontal-scroll-contents-padding,calc(var(--spacing,.0025rem)*600));padding-top:var(--mds-horizontal-scroll-contents-padding,calc(var(--spacing,.0025rem)*600));position:relative;scroll-behavior:var(--mds-horizontal-scroll-behavior);scroll-padding:var(--mds-horizontal-scroll-contents-scroll-padding,0 calc(var(--spacing,.0025rem)*600));-webkit-scroll-snap-type:x mandatory;-ms-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;width:100%}.contents>::slotted(*){flex:0 0 0;scroll-margin:0 var(--scroll-margin)}.spacer{--width:calc(var(--scroll-margin) - var(--mds-horizontal-scroll-gap,calc(var(--spacing,.0025rem) * 600)));content:"";display:block;flex:0 0 0;min-width:clamp(1px,var(--width),var(--width));scroll-margin:0 var(--scroll-margin)}@container (max-width:1024px){:host{--scroll-margin:var(--mds-horizontal-scroll-contents-scroll-padding,0 calc(var(--spacing,.0025rem)*600))}.contents{scroll-padding:var(--mds-horizontal-scroll-contents-scroll-padding,0 calc(var(--spacing,.0025rem)*600))}.contents>::slotted(*){scroll-margin:0 var(--mds-horizontal-scroll-contents-scroll-padding,0 calc(var(--spacing,.0025rem)*600))}}:host-context(:root.pref-animation-reduce){--mds-horizontal-scroll-behavior:auto}.navigation--back{left:clamp(calc(var(--mds-horizontal-scroll-gap,calc(var(--spacing,.0025rem) * 600)) / 2),var(--position),var(--position))}.navigation--back,.navigation--forward{--position:calc(var(--scroll-margin) - var(--mds-horizontal-scroll-gap,calc(var(--spacing,.0025rem) * 600)) - var(--mds-horizontal-scroll-controls-margin,calc(var(--spacing,.0025rem) * 1200)))}.navigation--forward{right:clamp(calc(var(--mds-horizontal-scroll-gap,calc(var(--spacing,.0025rem) * 600)) / 2),var(--position),var(--position))}.navigation--disabled{opacity:0;pointer-events:none;transform:translateY(-50%)scale(.5)}:host([controls=all]) .navigation{display:flex}.dot-navigation{align-self:center;background-color:var(--mds-horizontal-scroll-dot-area-background,rgb(var(--tone-neutral-08,107 107 107)));border-radius:200px;display:none;gap:var(--mds-horizontal-scroll-dots-gap,calc(var(--spacing,.0025rem)*100));justify-content:start;margin:0 auto var(--mds-horizontal-scroll-contents-padding,calc(var(--spacing,.0025rem)*600)) auto;max-width:calc(var(--spacing,.0025rem)*4000);padding:calc(var(--spacing,.0025rem)*50);width:100%}:host([navigation=position]) .dot-navigation{display:inline-flex}.dot{background-color:var(--mds-horizontal-scroll-dot-background,rgb(var(--tone-neutral,0 0 0)));border-radius:200px;height:var(--mds-horizontal-scroll-dot-size,calc(var(--spacing,.0025rem)*200));max-width:var(--mds-horizontal-scroll-dot-max-width);min-width:var(--mds-horizontal-scroll-dot-size,calc(var(--spacing,.0025rem)*200));transition-duration:.3s;transition-property:width;-webkit-transition-timing-function:var(--ease-out-expo,cubic-bezier(.19,1,.22,1));transition-timing-function:var(--ease-out-expo,cubic-bezier(.19,1,.22,1));width:calc(var(--mds-horizontal-scroll-dot-size,calc(var(--spacing,.0025rem) * 200)) * 2)}:host(:not([navigation=scrollbar])) .contents{-webkit-overflow-scrolling:touch;-ms-overflow-style:none;scrollbar-width:none}:host(:not([navigation=scrollbar])) .contents::-webkit-scrollbar{display:none}:host([navigation=scrollbar]) .contents::-webkit-scrollbar{height:var(--mds-horizontal-scroll-scrollbar-size,calc(var(--spacing,.0025rem)*200));width:var(--mds-horizontal-scroll-scrollbar-size,calc(var(--spacing,.0025rem)*200))}:host([navigation=scrollbar]) .contents::-webkit-scrollbar-track{background-color:var(--mds-horizontal-scroll-scrollbar-track-background,rgb(var(--tone-neutral-06,158 158 158)/.3));border-radius:var(--mds-horizontal-scroll-scrollbar-radius,0);margin-block:var(--mds-horizontal-scroll-scrollbar-margin,0);margin-inline:var(--mds-horizontal-scroll-scrollbar-margin,0)}:host([navigation=scrollbar]) .contents::-webkit-scrollbar-thumb{background-color:var(--mds-horizontal-scroll-scrollbar-thumb-background,rgb(var(--tone-neutral-02,244 244 244)/.3));border-radius:var(--mds-horizontal-scroll-scrollbar-radius,0)}@supports (scrollbar-color:transparent transparent){.contents{scrollbar-color:var(--mds-horizontal-scroll-scrollbar-thumb-background,rgb(var(--tone-neutral-02,244 244 244)/.3)) var(--mds-horizontal-scroll-scrollbar-track-background,rgb(var(--tone-neutral-06,158 158 158)/.3));scrollbar-width:thin}}:host([snap=start]) .contents>::slotted(*){scroll-snap-align:start}:host([snap=center]) .contents>::slotted(*){scroll-snap-align:center}:host([snap=end]) .contents>::slotted(*){scroll-snap-align:end}@media (prefers-reduced-motion){:is(:host-context(:root.pref-animation-system),:host-context(:root:not([data-magma-pref]))){--mds-horizontal-scroll-behavior:auto}}@media (min-width:1920px){:host([controls=tv]) .navigation{display:flex}}@media (min-width:1600px){:host([controls=xlarge]) .navigation{display:flex}}@media (min-width:1440px){:host([controls=large]) .navigation{display:flex}}@media (min-width:1280px){:host([controls=wide]) .navigation{display:flex}}@media (min-width:1024px){:host([controls=desktop]) .navigation{display:flex}}@media (min-width:768px){:host([controls=tablet]) .navigation{display:flex}}`;
 
 const MdsHorizontalScroll = class {
     constructor(hostRef) {
@@ -206,9 +206,11 @@ const MdsHorizontalScroll = class {
     }
     get host() { return getElement(this); }
     static get watchers() { return {
-        "navigation": ["watchNavigation"]
+        "navigation": [{
+                "watchNavigation": 0
+            }]
     }; }
 };
-MdsHorizontalScroll.style = mdsHorizontalScrollCss;
+MdsHorizontalScroll.style = mdsHorizontalScrollCss();
 
 export { MdsHorizontalScroll as mds_horizontal_scroll };

package/dist/esm/mds-hr.entry.js

@@ -1,6 +1,6 @@
-import { r as registerInstance, h, H as Host } from './index-BfAC4pqU.js';
+import { r as registerInstance, h, H as Host } from './index-CAd5312P.js';
 
-const mdsHrCss = "@layer reset,vendor,theme,base,components,utilities;@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}:host{background-color:rgb(var(--tone-neutral-08,107 107 107));border:0;border-radius:1000px;display:flex;height:1px;width:100%}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){background-color:rgb(var(--tone-neutral-07,134 134 134))}@media (prefers-color-scheme:dark){:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))){background-color:rgb(var(--tone-neutral-07,134 134 134))}}";
+const mdsHrCss = () => `@layer reset,vendor,theme,base,components,utilities;@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}:host{background-color:rgb(var(--tone-neutral-08,107 107 107));border:0;border-radius:1000px;display:flex;height:1px;width:100%}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){background-color:rgb(var(--tone-neutral-07,134 134 134))}@media (prefers-color-scheme:dark){:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))){background-color:rgb(var(--tone-neutral-07,134 134 134))}}`;
 
 const MdsHr = class {
     constructor(hostRef) {
@@ -10,6 +10,6 @@ const MdsHr = class {
         return h(Host, { key: 'e1055c3a5074fb93c5b51ce658a5eced9516b231' });
     }
 };
-MdsHr.style = mdsHrCss;
+MdsHr.style = mdsHrCss();
 
 export { MdsHr as mds_hr };

package/dist/esm/mds-img.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-BfAC4pqU.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-CAd5312P.js';
 import { s as setAttributeIfEmpty } from './aria-CSCy6TMW.js';
 import { m as miBaselinePanorama } from './panorama-b1ORvfSX.js';
 import { m as miBaselineBrokenImage } from './broken-image-0FAG3rkw.js';
@@ -24,7 +24,7 @@ var localeIt = {
 	clickToLoad: clickToLoad
 };
 
-const mdsImgCss = "@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 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-img-background:rgb(var(--variant-primary-03,211 226 255));--mds-img-color:rgb(var(--variant-primary-09,0 58 168));--mds-img-icon-color:rgb(var(--variant-primary-07,44 117 255));--mds-img-error-background:rgb(var(--status-error-09,135 0 14));--mds-img-error-color:rgb(var(--status-error-04,254 193 189));--mds-img-error-icon-color:rgb(var(--status-error-06,239 108 105))}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),:is(mds-button,mds-icon,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-img-background:rgb(var(--variant-primary-03,211 226 255));--mds-img-color:rgb(var(--variant-primary-09,0 58 168));--mds-img-icon-color:rgb(var(--variant-primary-07,44 117 255));--mds-img-error-background:rgb(var(--status-error-09,135 0 14));--mds-img-error-color:rgb(var(--status-error-04,254 193 189));--mds-img-error-icon-color:rgb(var(--status-error-06,239 108 105));display:flex;height:auto;-o-object-fit:contain;object-fit:contain;overflow:hidden;position:relative;width:100%}img{height:inherit;-o-object-fit:inherit;object-fit:inherit;width:inherit}.alt-text-container{align-items:center;background-color:var(--mds-img-background,rgb(var(--variant-primary-03,211 226 255)));color:var(--mds-img-color,rgb(var(--variant-primary-09,0 58 168)));display:flex;flex-direction:column;gap:calc(var(--spacing,.0025rem)*600);justify-content:center;padding:calc(var(--spacing,.0025rem)*600);text-align:center}.alt-text-container--absolute{cursor:pointer;inset:0;position:absolute}.alt-text-container--error{--mds-img-background:var(--mds-img-error-background,rgb(var(--status-error-09,135 0 14)));--mds-img-color:var(--mds-img-error-color,rgb(var(--status-error-04,254 193 189)));--mds-img-icon-color:var(--mds-img-error-icon-color,rgb(var(--status-error-06,239 108 105)));cursor:not-allowed}.alt-text-container--default-aspect-ratio{cursor:pointer;width:100%}.click-to-load{pointer-events:none}.icon{fill:var(--mds-img-icon-color,rgb(var(--variant-primary-07,44 117 255)));width:calc(var(--spacing,.0025rem)*900)}";
+const mdsImgCss = () => `@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 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-img-background:rgb(var(--variant-primary-03,211 226 255));--mds-img-color:rgb(var(--variant-primary-09,0 58 168));--mds-img-icon-color:rgb(var(--variant-primary-07,44 117 255));--mds-img-error-background:rgb(var(--status-error-09,135 0 14));--mds-img-error-color:rgb(var(--status-error-04,254 193 189));--mds-img-error-icon-color:rgb(var(--status-error-06,239 108 105))}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),:is(mds-button,mds-icon,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-img-background:rgb(var(--variant-primary-03,211 226 255));--mds-img-color:rgb(var(--variant-primary-09,0 58 168));--mds-img-icon-color:rgb(var(--variant-primary-07,44 117 255));--mds-img-error-background:rgb(var(--status-error-09,135 0 14));--mds-img-error-color:rgb(var(--status-error-04,254 193 189));--mds-img-error-icon-color:rgb(var(--status-error-06,239 108 105));display:flex;height:auto;-o-object-fit:contain;object-fit:contain;overflow:hidden;position:relative;width:100%}img{height:inherit;-o-object-fit:inherit;object-fit:inherit;width:inherit}.alt-text-container{align-items:center;background-color:var(--mds-img-background,rgb(var(--variant-primary-03,211 226 255)));color:var(--mds-img-color,rgb(var(--variant-primary-09,0 58 168)));display:flex;flex-direction:column;gap:calc(var(--spacing,.0025rem)*600);justify-content:center;padding:calc(var(--spacing,.0025rem)*600);text-align:center}.alt-text-container--absolute{cursor:pointer;inset:0;position:absolute}.alt-text-container--error{--mds-img-background:var(--mds-img-error-background,rgb(var(--status-error-09,135 0 14)));--mds-img-color:var(--mds-img-error-color,rgb(var(--status-error-04,254 193 189)));--mds-img-icon-color:var(--mds-img-error-icon-color,rgb(var(--status-error-06,239 108 105)));cursor:not-allowed}.alt-text-container--default-aspect-ratio{cursor:pointer;width:100%}.click-to-load{pointer-events:none}.icon{fill:var(--mds-img-icon-color,rgb(var(--variant-primary-07,44 117 255)));width:calc(var(--spacing,.0025rem)*900)}`;
 
 const MdsImg = class {
     constructor(hostRef) {
@@ -141,10 +141,14 @@ const MdsImg = class {
     }
     get host() { return getElement(this); }
     static get watchers() { return {
-        "srcsetConsumption": ["srcsetConsumptionHandler"],
-        "src": ["srcHandler"]
+        "srcsetConsumption": [{
+                "srcsetConsumptionHandler": 0
+            }],
+        "src": [{
+                "srcHandler": 0
+            }]
     }; }
 };
-MdsImg.style = mdsImgCss;
+MdsImg.style = mdsImgCss();
 
 export { MdsImg as mds_img };