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

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

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BoL6yK0y.js');
+var index = require('./index-CNuKb6Lv.js');
 var unit = require('./unit-Cm341q1R.js');
 
 function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
@@ -421,7 +421,7 @@ _postAddChecks = function _postAddChecks(timeline, child) {
       }
     }
 
-    timeline._zTime = -1e-8; // helps ensure that the next render() will be forced (crossingStart = true in render()), even if the duration hasn't changed (we're adding a child which would need to get rendered). Definitely an edge case. Note: we MUST do this AFTER the loop above where the totalTime() might trigger a render() because this _addToTimeline() method gets called from the Animation constructor, BEFORE tweens even record their targets, etc. so we wouldn't want things to get triggered in the wrong order.
+    timeline._zTime = -_tinyNum; // helps ensure that the next render() will be forced (crossingStart = true in render()), even if the duration hasn't changed (we're adding a child which would need to get rendered). Definitely an edge case. Note: we MUST do this AFTER the loop above where the totalTime() might trigger a render() because this _addToTimeline() method gets called from the Animation constructor, BEFORE tweens even record their targets, etc. so we wouldn't want things to get triggered in the wrong order.
   }
 },
     _addToTimeline = function _addToTimeline(timeline, child, position, skipChecks) {
@@ -727,7 +727,7 @@ distribute = function distribute(v) {
       wrapAt = vars.grid === "auto" ? 0 : (vars.grid || [1, _bigNum$1])[1];
 
       if (!wrapAt) {
-        max = -1e8;
+        max = -_bigNum$1;
 
         while (max < (max = a[wrapAt++].getBoundingClientRect().left) && wrapAt < l) {}
 
@@ -1763,7 +1763,7 @@ var Animation = /*#__PURE__*/function () {
 
   _proto.timeScale = function timeScale(value, suppressEvents) {
     if (!arguments.length) {
-      return this._rts === -1e-8 ? 0 : this._rts; // recorded timeScale. Special case: if someone calls reverse() on an animation with timeScale of 0, we assign it -_tinyNum to remember it's reversed.
+      return this._rts === -_tinyNum ? 0 : this._rts; // recorded timeScale. Special case: if someone calls reverse() on an animation with timeScale of 0, we assign it -_tinyNum to remember it's reversed.
     }
 
     if (this._rts === value) {
@@ -1776,7 +1776,7 @@ var Animation = /*#__PURE__*/function () {
     // prioritize rendering where the parent's playhead lines up instead of this._tTime because there could be a tween that's animating another tween's timeScale in the same rendering loop (same parent), thus if the timeScale tween renders first, it would alter _start BEFORE _tTime was set on that tick (in the rendering loop), effectively freezing it until the timeScale tween finishes.
 
     this._rts = +value || 0;
-    this._ts = this._ps || value === -1e-8 ? 0 : this._rts; // _ts is the functional timeScale which would be 0 if the animation is paused.
+    this._ts = this._ps || value === -_tinyNum ? 0 : this._rts; // _ts is the functional timeScale which would be 0 if the animation is paused.
 
     this.totalTime(_clamp(-Math.abs(this._delay), this.totalDuration(), tTime), suppressEvents !== false);
 
@@ -1900,7 +1900,7 @@ var Animation = /*#__PURE__*/function () {
 
   _proto.restart = function restart(includeDelay, suppressEvents) {
     this.play().totalTime(includeDelay ? -this._delay : 0, _isNotFalse(suppressEvents));
-    this._dur || (this._zTime = -1e-8); // ensures onComplete fires on a zero-duration animation that gets restarted.
+    this._dur || (this._zTime = -_tinyNum); // ensures onComplete fires on a zero-duration animation that gets restarted.
 
     return this;
   };
@@ -1926,7 +1926,7 @@ var Animation = /*#__PURE__*/function () {
 
   _proto.reversed = function reversed(value) {
     if (arguments.length) {
-      !!value !== this.reversed() && this.timeScale(-this._rts || (value ? -1e-8 : 0)); // in case timeScale is zero, reversing would have no effect so we use _tinyNum.
+      !!value !== this.reversed() && this.timeScale(-this._rts || (value ? -_tinyNum : 0)); // in case timeScale is zero, reversing would have no effect so we use _tinyNum.
 
       return this;
     }
@@ -1936,7 +1936,7 @@ var Animation = /*#__PURE__*/function () {
 
   _proto.invalidate = function invalidate() {
     this._initted = this._act = 0;
-    this._zTime = -1e-8;
+    this._zTime = -_tinyNum;
     return this;
   };
 
@@ -2008,7 +2008,7 @@ _setDefaults(Animation.prototype, {
   _ts: 1,
   _dp: 0,
   ratio: 0,
-  _zTime: -1e-8,
+  _zTime: -_tinyNum,
   _prom: 0,
   _ps: false,
   _rts: 1
@@ -2267,7 +2267,7 @@ var Timeline = /*#__PURE__*/function (_Animation) {
             if (time !== this._time || !this._ts && !prevPaused) {
               //in case a tween pauses or seeks the timeline when rendering, like inside of an onUpdate/onComplete
               pauseTween = 0;
-              next && (tTime += this._zTime = -1e-8); // it didn't finish rendering, so flag zTime as negative so that the next time render() is called it'll be forced (to render any remaining children)
+              next && (tTime += this._zTime = -_tinyNum); // it didn't finish rendering, so flag zTime as negative so that the next time render() is called it'll be forced (to render any remaining children)
 
               break;
             }
@@ -2293,7 +2293,7 @@ var Timeline = /*#__PURE__*/function (_Animation) {
             if (time !== this._time || !this._ts && !prevPaused) {
               //in case a tween pauses or seeks the timeline when rendering, like inside of an onUpdate/onComplete
               pauseTween = 0;
-              next && (tTime += this._zTime = adjustedTime ? -1e-8 : _tinyNum); // it didn't finish rendering, so adjust zTime so that so that the next time render() is called it'll be forced (to render any remaining children)
+              next && (tTime += this._zTime = adjustedTime ? -_tinyNum : _tinyNum); // it didn't finish rendering, so adjust zTime so that so that the next time render() is called it'll be forced (to render any remaining children)
 
               break;
             }
@@ -2305,7 +2305,7 @@ var Timeline = /*#__PURE__*/function (_Animation) {
 
       if (pauseTween && !suppressEvents) {
         this.pause();
-        pauseTween.render(time >= prevTime ? 0 : -1e-8)._zTime = time >= prevTime ? 1 : -1;
+        pauseTween.render(time >= prevTime ? 0 : -_tinyNum)._zTime = time >= prevTime ? 1 : -1;
 
         if (this._ts) {
           //the callback resumed playback! So since we may have held back the playhead due to where the pause is positioned, go ahead and jump to where it's SUPPOSED to be (if no pause happened).
@@ -2374,7 +2374,7 @@ var Timeline = /*#__PURE__*/function (_Animation) {
     }
 
     if (ignoreBeforeTime === void 0) {
-      ignoreBeforeTime = -1e8;
+      ignoreBeforeTime = -_bigNum$1;
     }
 
     var a = [],
@@ -3328,7 +3328,7 @@ var Tween = /*#__PURE__*/function (_Animation2) {
     vars.paused && _this3.paused(true);
 
     if (immediateRender || !duration && !keyframes && _this3._start === _roundPrecise(parent._time) && _isNotFalse(immediateRender) && _hasNoPausedAncestors(_assertThisInitialized(_this3)) && parent.data !== "nested") {
-      _this3._tTime = -1e-8; //forces a render without having to set the render() "force" parameter to true because we want to allow lazying by default (using the "force" parameter always forces an immediate full render)
+      _this3._tTime = -_tinyNum; //forces a render without having to set the render() "force" parameter to true because we want to allow lazying by default (using the "force" parameter always forces an immediate full render)
 
       _this3.render(Math.max(0, -delay) || 0); //in case delay is negative
 
@@ -5690,7 +5690,7 @@ _addPxTranslate = function _addPxTranslate(target, start, value) {
       change %= cap;
 
       if (change !== change % (cap / 2)) {
-        change += change < 0 ? cap : -360;
+        change += change < 0 ? cap : -cap;
       }
     }
 
@@ -6183,7 +6183,7 @@ var simiSvg = `<svg width="440" height="440" viewBox="0 0 440 440" fill="none" x
 </svg>
 `;
 
-const mdsEmojiCss = "@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-emoji-expression-follow-mouse-traits-duration:.2s;--mds-emoji-expression-follow-mouse-head-duration:.3s;--mds-emoji-expression-max-rotation:16deg;--mds-emoji-perspective:400px;--mds-emoji-offset-eyes:1px;--mds-emoji-offset-gadget:1px;--mds-emoji-offset-hands:2px;--mds-emoji-offset-head:0;--mds-emoji-offset-mouth:1px;--mds-emoji-offset-eyebrows:10px;--mds-emoji-offset-ears:0;--mds-emoji-mia-head:rgb(var(--variant-ai-08,118 44 246));--mds-emoji-mia-eyes:rgb(var(--variant-ai-03,233 220 254));--mds-emoji-mia-mouth:rgb(var(--variant-ai-06,172 126 249));--mds-emoji-mia-hands:rgb(var(--variant-ai-06,172 126 249));--mds-emoji-simi-eye:#40281b;--mds-emoji-simi-eye-light:#fff;--mds-emoji-simi-eyebrow:#feefd8;--mds-emoji-simi-gadget:#2b1c15;--mds-emoji-simi-mouth:#2b1c15;--mds-emoji-simi-nose-light:#7e695f;--mds-emoji-simi-nose:#2b1c15;--mds-emoji-simi-outline:#2b1c15;--mds-emoji-simi-skin-dark:#c3481b;--mds-emoji-simi-skin-light:#feefd8;--mds-emoji-simi-skin:#f36320;--mds-emoji-simi-mouth-teeth:#fff;--mds-emoji-simi-mouth-throat:#c3481b}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}@property --mds-emoji-expression-follow-mouse-traits-duration{syntax:\"<time>\";inherits:false;initial-value:.2s}@property --mds-emoji-expression-follow-mouse-head-duration{syntax:\"<time>\";inherits:false;initial-value:.3s}@property --mds-emoji-expression-max-rotation{syntax:\"<angle>\";inherits:false;initial-value:16deg}@property --mds-emoji-perspective{syntax:\"<length>\";inherits:false;initial-value:400px}@property --mds-emoji-offset-eyes{syntax:\"<length>\";inherits:false;initial-value:1px}@property --mds-emoji-offset-gadget{syntax:\"<length>\";inherits:false;initial-value:1px}@property --mds-emoji-offset-hands{syntax:\"<length>\";inherits:false;initial-value:2px}@property --mds-emoji-offset-head{syntax:\"<length>\";inherits:false;initial-value:0}@property --mds-emoji-offset-mouth{syntax:\"<length>\";inherits:false;initial-value:1px}@property --mds-emoji-offset-eyebrows{syntax:\"<length>\";inherits:false;initial-value:10px}@property --mds-emoji-offset-ears{syntax:\"<length>\";inherits:false;initial-value:0}:host{--mds-emoji-expression-follow-mouse-traits-duration:.2s;--mds-emoji-expression-follow-mouse-head-duration:.3s;--mds-emoji-expression-max-rotation:16deg;--mds-emoji-perspective:400px;align-items:stretch;aspect-ratio:1;height:calc(var(--spacing,.0025rem)*1200);-ms-flex-pack:stretch;display:flex;justify-content:stretch;-webkit-perspective:var(--mds-emoji-perspective,400px);perspective:var(--mds-emoji-perspective,400px);perspective-origin:50%;width:calc(var(--spacing,.0025rem)*1200)}svg{height:100%;overflow:visible;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;transition:transform .2s ease-out;width:100%}:host([name=mia]){--mds-emoji-mia-eyes-color:rgb(var(--variant-ai-03,233 220 254));--mds-emoji-mia-hands-color:rgb(var(--variant-ai-04,218 199 253));--mds-emoji-mia-head-color:rgb(var(--variant-ai-08,118 44 246));--mds-emoji-mia-head-stroke-color:rgb(var(--variant-ai-06,172 126 249));--mds-emoji-mia-head-stroke-width:0px;--mds-emoji-mia-mouth-color:rgb(var(--variant-ai-04,218 199 253));--mds-emoji-offset-eyes:1px;--mds-emoji-offset-gadget:1px;--mds-emoji-offset-hands:2px;--mds-emoji-offset-head:0;--mds-emoji-offset-mouth:1px;container-type:size}@property --mds-emoji-simi-eye{syntax:\"<color>\";inherits:false;initial-value:#40281b}@property --mds-emoji-simi-eye-light{syntax:\"<color>\";inherits:false;initial-value:#fff}@property --mds-emoji-simi-eyebrow{syntax:\"<color>\";inherits:false;initial-value:#feefd8}@property --mds-emoji-simi-gadget{syntax:\"<color>\";inherits:false;initial-value:#2b1c15}@property --mds-emoji-simi-mouth{syntax:\"<color>\";inherits:false;initial-value:#2b1c15}@property --mds-emoji-simi-nose-light{syntax:\"<color>\";inherits:false;initial-value:#7e695f}@property --mds-emoji-simi-nose{syntax:\"<color>\";inherits:false;initial-value:#2b1c15}@property --mds-emoji-simi-outline{syntax:\"<color>\";inherits:false;initial-value:#2b1c15}@property --mds-emoji-simi-skin-dark{syntax:\"<color>\";inherits:false;initial-value:#c3481b}@property --mds-emoji-simi-skin-light{syntax:\"<color>\";inherits:false;initial-value:#feefd8}@property --mds-emoji-simi-skin{syntax:\"<color>\";inherits:false;initial-value:#f36320}@property --mds-emoji-simi-mouth-teeth{syntax:\"<color>\";inherits:false;initial-value:#fff}@property --mds-emoji-simi-mouth-throat{syntax:\"<color>\";inherits:false;initial-value:#c3481b}:host([name=simi]){--mds-emoji-offset-ears:0;--mds-emoji-offset-eyebrows:10px;--mds-emoji-offset-eyes:7px;--mds-emoji-offset-gadget:14px;--mds-emoji-offset-hand:18px;--mds-emoji-offset-head:5px;--mds-emoji-offset-mouth:16px;--mds-emoji-simi-eye-light:#fff;--mds-emoji-simi-eye:#40281b;--mds-emoji-simi-eyebrow:#feefd8;--mds-emoji-simi-gadget:#2b1c15;--mds-emoji-simi-mouth-teeth:#fff;--mds-emoji-simi-mouth-throat:#c3481b;--mds-emoji-simi-mouth:#2b1c15;--mds-emoji-simi-nose-light:#7e695f;--mds-emoji-simi-nose:#2b1c15;--mds-emoji-simi-outline:#2b1c15;--mds-emoji-simi-skin-dark:#c3481b;--mds-emoji-simi-skin-light:#feefd8;--mds-emoji-simi-skin:#f36320}";
+const mdsEmojiCss = () => `@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-emoji-expression-follow-mouse-traits-duration:.2s;--mds-emoji-expression-follow-mouse-head-duration:.3s;--mds-emoji-expression-max-rotation:16deg;--mds-emoji-perspective:400px;--mds-emoji-offset-eyes:1px;--mds-emoji-offset-gadget:1px;--mds-emoji-offset-hands:2px;--mds-emoji-offset-head:0;--mds-emoji-offset-mouth:1px;--mds-emoji-offset-eyebrows:10px;--mds-emoji-offset-ears:0;--mds-emoji-mia-head:rgb(var(--variant-ai-08,118 44 246));--mds-emoji-mia-eyes:rgb(var(--variant-ai-03,233 220 254));--mds-emoji-mia-mouth:rgb(var(--variant-ai-06,172 126 249));--mds-emoji-mia-hands:rgb(var(--variant-ai-06,172 126 249));--mds-emoji-simi-eye:#40281b;--mds-emoji-simi-eye-light:#fff;--mds-emoji-simi-eyebrow:#feefd8;--mds-emoji-simi-gadget:#2b1c15;--mds-emoji-simi-mouth:#2b1c15;--mds-emoji-simi-nose-light:#7e695f;--mds-emoji-simi-nose:#2b1c15;--mds-emoji-simi-outline:#2b1c15;--mds-emoji-simi-skin-dark:#c3481b;--mds-emoji-simi-skin-light:#feefd8;--mds-emoji-simi-skin:#f36320;--mds-emoji-simi-mouth-teeth:#fff;--mds-emoji-simi-mouth-throat:#c3481b}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}@property --mds-emoji-expression-follow-mouse-traits-duration{syntax:"<time>";inherits:false;initial-value:.2s}@property --mds-emoji-expression-follow-mouse-head-duration{syntax:"<time>";inherits:false;initial-value:.3s}@property --mds-emoji-expression-max-rotation{syntax:"<angle>";inherits:false;initial-value:16deg}@property --mds-emoji-perspective{syntax:"<length>";inherits:false;initial-value:400px}@property --mds-emoji-offset-eyes{syntax:"<length>";inherits:false;initial-value:1px}@property --mds-emoji-offset-gadget{syntax:"<length>";inherits:false;initial-value:1px}@property --mds-emoji-offset-hands{syntax:"<length>";inherits:false;initial-value:2px}@property --mds-emoji-offset-head{syntax:"<length>";inherits:false;initial-value:0}@property --mds-emoji-offset-mouth{syntax:"<length>";inherits:false;initial-value:1px}@property --mds-emoji-offset-eyebrows{syntax:"<length>";inherits:false;initial-value:10px}@property --mds-emoji-offset-ears{syntax:"<length>";inherits:false;initial-value:0}:host{--mds-emoji-expression-follow-mouse-traits-duration:.2s;--mds-emoji-expression-follow-mouse-head-duration:.3s;--mds-emoji-expression-max-rotation:16deg;--mds-emoji-perspective:400px;align-items:stretch;aspect-ratio:1;height:calc(var(--spacing,.0025rem)*1200);-ms-flex-pack:stretch;display:flex;justify-content:stretch;-webkit-perspective:var(--mds-emoji-perspective,400px);perspective:var(--mds-emoji-perspective,400px);perspective-origin:50%;width:calc(var(--spacing,.0025rem)*1200)}svg{height:100%;overflow:visible;-webkit-transform-style:preserve-3d;transform-style:preserve-3d;transition:transform .2s ease-out;width:100%}:host([name=mia]){--mds-emoji-mia-eyes-color:rgb(var(--variant-ai-03,233 220 254));--mds-emoji-mia-hands-color:rgb(var(--variant-ai-04,218 199 253));--mds-emoji-mia-head-color:rgb(var(--variant-ai-08,118 44 246));--mds-emoji-mia-head-stroke-color:rgb(var(--variant-ai-06,172 126 249));--mds-emoji-mia-head-stroke-width:0px;--mds-emoji-mia-mouth-color:rgb(var(--variant-ai-04,218 199 253));--mds-emoji-offset-eyes:1px;--mds-emoji-offset-gadget:1px;--mds-emoji-offset-hands:2px;--mds-emoji-offset-head:0;--mds-emoji-offset-mouth:1px;container-type:size}@property --mds-emoji-simi-eye{syntax:"<color>";inherits:false;initial-value:#40281b}@property --mds-emoji-simi-eye-light{syntax:"<color>";inherits:false;initial-value:#fff}@property --mds-emoji-simi-eyebrow{syntax:"<color>";inherits:false;initial-value:#feefd8}@property --mds-emoji-simi-gadget{syntax:"<color>";inherits:false;initial-value:#2b1c15}@property --mds-emoji-simi-mouth{syntax:"<color>";inherits:false;initial-value:#2b1c15}@property --mds-emoji-simi-nose-light{syntax:"<color>";inherits:false;initial-value:#7e695f}@property --mds-emoji-simi-nose{syntax:"<color>";inherits:false;initial-value:#2b1c15}@property --mds-emoji-simi-outline{syntax:"<color>";inherits:false;initial-value:#2b1c15}@property --mds-emoji-simi-skin-dark{syntax:"<color>";inherits:false;initial-value:#c3481b}@property --mds-emoji-simi-skin-light{syntax:"<color>";inherits:false;initial-value:#feefd8}@property --mds-emoji-simi-skin{syntax:"<color>";inherits:false;initial-value:#f36320}@property --mds-emoji-simi-mouth-teeth{syntax:"<color>";inherits:false;initial-value:#fff}@property --mds-emoji-simi-mouth-throat{syntax:"<color>";inherits:false;initial-value:#c3481b}:host([name=simi]){--mds-emoji-offset-ears:0;--mds-emoji-offset-eyebrows:10px;--mds-emoji-offset-eyes:7px;--mds-emoji-offset-gadget:14px;--mds-emoji-offset-hand:18px;--mds-emoji-offset-head:5px;--mds-emoji-offset-mouth:16px;--mds-emoji-simi-eye-light:#fff;--mds-emoji-simi-eye:#40281b;--mds-emoji-simi-eyebrow:#feefd8;--mds-emoji-simi-gadget:#2b1c15;--mds-emoji-simi-mouth-teeth:#fff;--mds-emoji-simi-mouth-throat:#c3481b;--mds-emoji-simi-mouth:#2b1c15;--mds-emoji-simi-nose-light:#7e695f;--mds-emoji-simi-nose:#2b1c15;--mds-emoji-simi-outline:#2b1c15;--mds-emoji-simi-skin-dark:#c3481b;--mds-emoji-simi-skin-light:#feefd8;--mds-emoji-simi-skin:#f36320}`;
 
 const MdsEmoji = class {
     constructor(hostRef) {
@@ -6947,9 +6947,11 @@ const MdsEmoji = class {
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {
-        "name": ["checkNameChanged"]
+        "name": [{
+                "checkNameChanged": 0
+            }]
     }; }
 };
-MdsEmoji.style = mdsEmojiCss;
+MdsEmoji.style = mdsEmojiCss();
 
 exports.mds_emoji = MdsEmoji;

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

@@ -1,8 +1,8 @@
 'use strict';
 
-var index = require('./index-BoL6yK0y.js');
+var index = require('./index-CNuKb6Lv.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) {
@@ -33,6 +33,6 @@ const MdsEntity = class {
     }
     get hostElement() { return index.getElement(this); }
 };
-MdsEntity.style = mdsEntityCss;
+MdsEntity.style = mdsEntityCss();
 
 exports.mds_entity = MdsEntity;

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

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BoL6yK0y.js');
+var index = require('./index-CNuKb6Lv.js');
 var cancel = require('./cancel-_rS5f5_p.js');
 var clsx = require('./clsx-BtxeOLZW.js');
 var locale_it = require('./locale.it-D-rxNDkm.js');
@@ -220,7 +220,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) {
@@ -283,10 +283,14 @@ const MdsFilePreview = class {
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {
-        "filename": ["handleFilename"],
-        "downloadable": ["handleDownloadable"]
+        "filename": [{
+                "handleFilename": 0
+            }],
+        "downloadable": [{
+                "handleDownloadable": 0
+            }]
     }; }
 };
-MdsFilePreview.style = mdsFilePreviewCss;
+MdsFilePreview.style = mdsFilePreviewCss();
 
 exports.mds_file_preview = MdsFilePreview;

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

@@ -1,6 +1,6 @@
 'use strict';
 
-var index = require('./index-BoL6yK0y.js');
+var index = require('./index-CNuKb6Lv.js');
 var _commonjsHelpers = require('./_commonjsHelpers-B83fTs8d.js');
 var locale_it = require('./locale.it-D-rxNDkm.js');
 var locale = require('./locale-oGW3SvGJ.js');
@@ -7543,7 +7543,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) {
@@ -7599,9 +7599,11 @@ const MdsFile = class {
     }
     get host() { return index.getElement(this); }
     static get watchers() { return {
-        "filename": ["handleFilename"]
+        "filename": [{
+                "handleFilename": 0
+            }]
     }; }
 };
-MdsFile.style = mdsFileCss;
+MdsFile.style = mdsFileCss();
 
 exports.mds_file = MdsFile;

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

@@ -1,9 +1,9 @@
 'use strict';
 
-var index = require('./index-BoL6yK0y.js');
+var index = require('./index-CNuKb6Lv.js');
 var keyboardManager = require('./keyboard-manager-BXKT5TGW.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) {
@@ -28,6 +28,6 @@ const MdsFilterItem = class {
     }
     get element() { return index.getElement(this); }
 };
-MdsFilterItem.style = mdsFilterItemCss;
+MdsFilterItem.style = mdsFilterItemCss();
 
 exports.mds_filter_item = MdsFilterItem;

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

@@ -1,10 +1,10 @@
 'use strict';
 
-var index = require('./index-BoL6yK0y.js');
+var index = require('./index-CNuKb6Lv.js');
 var clsx = require('./clsx-BtxeOLZW.js');
 var close = require('./close-BS8N44H4.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) {
@@ -103,6 +103,6 @@ const MdsFilter = class {
     }
     get element() { return index.getElement(this); }
 };
-MdsFilter.style = mdsFilterCss;
+MdsFilter.style = mdsFilterCss();
 
 exports.mds_filter = MdsFilter;

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

@@ -1,10 +1,10 @@
 'use strict';
 
-var index = require('./index-BoL6yK0y.js');
+var index = require('./index-CNuKb6Lv.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) {
@@ -36,6 +36,6 @@ const MdsHeaderBar = class {
     }
     get host() { return index.getElement(this); }
 };
-MdsHeaderBar.style = mdsHeaderBarCss;
+MdsHeaderBar.style = mdsHeaderBarCss();
 
 exports.mds_header_bar = MdsHeaderBar;