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

package/dist/components/mds-pref-theme.js

@@ -1,333 +1 @@
-import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { c as cssDurationToMilliseconds } from './unit.js';
-import { m as miBaselineSettings } from './settings.js';
-import { L as Locale } from './locale.js';
-import { i as isSafari } from './browser.js';
-import { d as defineCustomElement$7 } from './mds-button2.js';
-import { d as defineCustomElement$6 } from './mds-icon2.js';
-import { d as defineCustomElement$5 } from './mds-spinner2.js';
-import { d as defineCustomElement$4 } from './mds-tab2.js';
-import { d as defineCustomElement$3 } from './mds-tab-item2.js';
-import { d as defineCustomElement$2 } from './mds-text2.js';
-
-var miBaselineLightMode = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5s5-2.24 5-5s-2.24-5-5-5zM2 13h2c.55 0 1-.45 1-1s-.45-1-1-1H2c-.55 0-1 .45-1 1s.45 1 1 1zm18 0h2c.55 0 1-.45 1-1s-.45-1-1-1h-2c-.55 0-1 .45-1 1s.45 1 1 1zM11 2v2c0 .55.45 1 1 1s1-.45 1-1V2c0-.55-.45-1-1-1s-1 .45-1 1zm0 18v2c0 .55.45 1 1 1s1-.45 1-1v-2c0-.55-.45-1-1-1s-1 .45-1 1zM5.99 4.58a.996.996 0 0 0-1.41 0a.996.996 0 0 0 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0s.39-1.03 0-1.41L5.99 4.58zm12.37 12.37a.996.996 0 0 0-1.41 0a.996.996 0 0 0 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0a.996.996 0 0 0 0-1.41l-1.06-1.06zm1.06-10.96a.996.996 0 0 0 0-1.41a.996.996 0 0 0-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0l1.06-1.06zM7.05 18.36a.996.996 0 0 0 0-1.41a.996.996 0 0 0-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0l1.06-1.06z"/></svg>`;
-
-var miOutlineDarkMode = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M9.37 5.51A7.35 7.35 0 0 0 9.1 7.5c0 4.08 3.32 7.4 7.4 7.4c.68 0 1.35-.09 1.99-.27A7.014 7.014 0 0 1 12 19c-3.86 0-7-3.14-7-7c0-2.93 1.81-5.45 4.37-6.49zM12 3a9 9 0 1 0 9 9c0-.46-.04-.92-.1-1.36a5.389 5.389 0 0 1-4.4 2.26a5.403 5.403 0 0 1-3.14-9.8c-.44-.06-.9-.1-1.36-.1z"/></svg>`;
-
-var miBaselineDarkMode = `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 3a9 9 0 1 0 9 9c0-.46-.04-.92-.1-1.36a5.389 5.389 0 0 1-4.4 2.26a5.403 5.403 0 0 1-3.14-9.8c-.44-.06-.9-.1-1.36-.1z"/></svg>`;
-
-const darkMode$3 = "Σκούρο";
-const label$3 = "Λειτουργία θέματος";
-const lightMode$3 = "Ανοιχτό{{#forced}} (επιβεβλημένο στο Safari){{/forced}}";
-const systemSettings$3 = "Με βάση το λειτουργικό σύστημα";
-var localeEl = {
-	darkMode: darkMode$3,
-	label: label$3,
-	lightMode: lightMode$3,
-	systemSettings: systemSettings$3
-};
-
-const darkMode$2 = "Dark";
-const label$2 = "Theme mode";
-const lightMode$2 = "Light{{#forced}} (forced on Safari){{/forced}}";
-const systemSettings$2 = "Based on operating system";
-var localeEn = {
-	darkMode: darkMode$2,
-	label: label$2,
-	lightMode: lightMode$2,
-	systemSettings: systemSettings$2
-};
-
-const darkMode$1 = "Oscura";
-const label$1 = "Modo de tema";
-const lightMode$1 = "Clara{{#forced}} (forzada en Safari){{/forced}}";
-const systemSettings$1 = "Basado en el sistema operativo";
-var localeEs = {
-	darkMode: darkMode$1,
-	label: label$1,
-	lightMode: lightMode$1,
-	systemSettings: systemSettings$1
-};
-
-const darkMode = "Scura";
-const label = "Modalità tema";
-const lightMode = "Chiara{{#forced}} (forzata su Safari){{/forced}}";
-const systemSettings = "Basato sul sistema operativo";
-var localeIt = {
-	darkMode: darkMode,
-	label: label,
-	lightMode: lightMode,
-	systemSettings: systemSettings
-};
-
-const mdsPrefThemeCss = "@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,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-pref-theme-overlay-fadeout-duration:.2s;--mds-pref-theme-overlay-show-duration:.3s;--mds-pref-theme-overlay-z-index:var(--magma-theme-overlay-z-index,6000)}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),:is(mds-tab,mds-tab-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-pref-theme-overlay-fadeout-duration{syntax:\"<time>\";inherits:false;initial-value:.2s}@property --mds-pref-theme-overlay-show-duration{syntax:\"<time>\";inherits:false;initial-value:.3s}:host{--mds-pref-theme-overlay-fadeout-duration:.2s;--mds-pref-theme-overlay-show-duration:.3s;--mds-pref-theme-overlay-z-index:var(--magma-theme-overlay-z-index,6000);display:grid;gap:calc(var(--spacing,.0025rem)*100)}.item{--mds-tab-item-default-color:rgb(var(--tone-neutral-05,197 197 197));flex-basis:0;flex-grow:1}.item--system{--mds-tab-item-selected-color:rgb(var(--tone-neutral-03,233 233 233))}.item--light{--mds-tab-item-selected-color:rgb(var(--label-yellow-06,188 143 6))}.item--dark{--mds-tab-item-selected-color:rgb(var(--label-sky-06,13 158 224))}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)) .item{--mds-tab-item-default-color:rgb(var(--tone-neutral-01,255 255 255))}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)) .item--system{--mds-tab-item-selected-color:rgb(var(--tone-neutral-03,233 233 233))}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)) .item--light{--mds-tab-item-selected-color:rgb(var(--label-yellow-03,251 224 142))}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)) .item--dark{--mds-tab-item-selected-color:rgb(var(--label-sky-03,191 232 251))}@media (prefers-color-scheme:dark){:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))) .item{--mds-tab-item-default-color:rgb(var(--tone-neutral-01,255 255 255))}:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))) .item--system{--mds-tab-item-selected-color:rgb(var(--tone-neutral-03,233 233 233))}:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))) .item--light{--mds-tab-item-selected-color:rgb(var(--label-yellow-03,251 224 142))}:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))) .item--dark{--mds-tab-item-selected-color:rgb(var(--label-sky-03,191 232 251))}}";
-
-const MdsPrefTheme$1 = /*@__PURE__*/ proxyCustomElement(class MdsPrefTheme extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-        this.prefChangeEvent = createEvent(this, "mdsPrefChange", 7);
-        this.defaultMode = 'system';
-        this.t = new Locale({
-            el: localeEl,
-            en: localeEn,
-            es: localeEs,
-            it: localeIt,
-        });
-        this.localStorageAlias = 'mdsPrefTheme';
-        this.customPropertyAlias = '--magma-pref-user-theme';
-        this.overlayBackgroundVisible = 'rgb(var(--tone-neutral))';
-        this.overlayBackgroundHidden = 'rgb(var(--tone-neutral) / 0)';
-        this.cssOverlayShowDuration = '300';
-        this.cssOverlayFadeoutDuration = '200';
-        this.cssOverlayZIndex = '6000';
-        this.overlayId = 'mds-pref-theme-overlay';
-        this.overlayShow = false;
-        this.disabled = false;
-        this.updateCSSCustomProps = () => {
-            var _a, _b, _c;
-            if (typeof window === 'undefined')
-                return;
-            const elementStyles = window.getComputedStyle(this.element);
-            this.cssOverlayShowDuration =
-                (_a = elementStyles.getPropertyValue('--mds-pref-theme-overlay-show-duration')) !== null && _a !== void 0 ? _a : '300';
-            this.cssOverlayFadeoutDuration =
-                (_b = elementStyles.getPropertyValue('--mds-pref-theme-overlay-fadeout-duration')) !== null && _b !== void 0 ? _b : '200';
-            this.cssOverlayZIndex =
-                (_c = elementStyles.getPropertyValue('--mds-pref-theme-overlay-z-index')) !== null && _c !== void 0 ? _c : '6000';
-        };
-        /**
-         * Specifies the transition of switching from a theme to another one
-         */
-        this.transition = 'smooth';
-        this.theme = {
-            dark: {
-                selector: 'pref-theme-dark',
-                label: 'darkMode',
-            },
-            system: {
-                selector: 'pref-theme-system',
-                label: 'systemSettings',
-            },
-            light: {
-                selector: 'pref-theme-light',
-                label: 'lightMode',
-            },
-        };
-        this.setTheme = (mode) => {
-            this.prefChangeEvent.emit({ preference: 'theme-mode' });
-            this.mode = mode;
-            localStorage.setItem(this.localStorageAlias, this.mode);
-            if (document) {
-                const element = document.querySelector('html');
-                for (const key in this.theme) {
-                    if ({}.hasOwnProperty.call(this.theme, key)) {
-                        element === null || element === void 0 ? void 0 : element.classList.remove(this.theme[key].selector);
-                    }
-                }
-                element === null || element === void 0 ? void 0 : element.classList.add(this.theme[mode].selector);
-                element === null || element === void 0 ? void 0 : element.style.setProperty(this.customPropertyAlias, this.mode);
-            }
-        };
-        this.isDarkMode = () => {
-            return window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches;
-        };
-        this.getColorScheme = (mode) => {
-            if (mode) {
-                if (mode === 'system') {
-                    return this.isDarkMode() ? 'dark' : 'light';
-                }
-                return mode;
-            }
-            if (this.mode === 'system') {
-                return this.isDarkMode() ? 'dark' : 'light';
-            }
-            return this.mode;
-        };
-        this.instanceOverlay = () => {
-            if (!this.overlayEl) {
-                this.overlayEl = document.createElement('div');
-                this.overlayEl.className = this.overlayId;
-                this.overlayEl.style.inset = '0';
-                this.overlayEl.style.pointerEvents = 'none';
-                this.overlayEl.style.position = 'fixed';
-                this.overlayEl.style.transition = `background-color ${this.cssOverlayFadeoutDuration} ease-out`;
-                this.overlayEl.style.zIndex = this.cssOverlayZIndex;
-            }
-            this.overlayEl.style.backgroundColor = this.overlayBackgroundHidden;
-        };
-        this.attachFlashOverlayTransition = () => {
-            this.overlayShow = true;
-            this.instanceOverlay();
-            this.overlayEl.style.backgroundColor = this.overlayBackgroundVisible;
-            document.body.appendChild(this.overlayEl);
-            clearTimeout(this.overlayTimer);
-            this.overlayTimer = setTimeout(() => {
-                this.overlayShow = false;
-                this.detachOverlayTransition();
-            }, cssDurationToMilliseconds(this.cssOverlayShowDuration));
-        };
-        this.attachSmoothOverlayTransition = (mode) => {
-            this.overlayShow = true;
-            this.instanceOverlay();
-            document.body.appendChild(this.overlayEl);
-            clearTimeout(this.overlaySmoothTimer);
-            this.overlaySmoothTimer = setTimeout(() => {
-                this.overlayEl.style.backgroundColor = this.overlayBackgroundVisible;
-                clearTimeout(this.overlayTimer);
-                this.overlayTimer = setTimeout(() => {
-                    this.setTheme(mode);
-                    clearTimeout(this.overlayTimer);
-                    this.overlayTimer = setTimeout(() => {
-                        this.overlayShow = false;
-                        this.detachOverlayTransition();
-                    }, cssDurationToMilliseconds(this.cssOverlayFadeoutDuration));
-                }, cssDurationToMilliseconds(this.cssOverlayShowDuration));
-            }, 1);
-        };
-        this.changeTheme = (mode) => {
-            if (this.disabled) {
-                return;
-            }
-            const prevColor = this.getColorScheme();
-            const nextColor = this.getColorScheme(mode);
-            if (prevColor === nextColor) {
-                this.setTheme(mode);
-                return;
-            }
-            switch (this.transition) {
-                case 'none':
-                    this.setTheme(mode);
-                    break;
-                case 'flash':
-                    this.setTheme(mode);
-                    this.attachFlashOverlayTransition();
-                    break;
-                case 'smooth':
-                    this.attachSmoothOverlayTransition(mode);
-                    break;
-                default:
-                    this.setTheme(mode);
-                    break;
-            }
-        };
-    }
-    async updateLang() {
-        this.language = this.t.lang(this.element);
-    }
-    componentWillRender() {
-        var _a, _b;
-        this.t.lang(this.element);
-        if (!isSafari()) {
-            this.setTheme((_b = (_a = this.mode) !== null && _a !== void 0 ? _a : localStorage.getItem(this.localStorageAlias)) !== null && _b !== void 0 ? _b : this.defaultMode);
-            return;
-        }
-        this.disabled = true;
-        this.mode = 'light';
-    }
-    componentDidLoad() {
-        this.updateCSSCustomProps();
-    }
-    modeChanged(newValue, oldValue) {
-        if (newValue === oldValue) {
-            return;
-        }
-        this.setTheme(newValue);
-    }
-    detachOverlayTransition() {
-        if (!this.overlayEl) {
-            return;
-        }
-        this.overlayEl.style.backgroundColor = this.overlayBackgroundHidden;
-        clearTimeout(this.overlayTimer);
-        this.overlayTimer = setTimeout(() => {
-            this.overlayEl.remove();
-        }, cssDurationToMilliseconds(this.cssOverlayFadeoutDuration));
-    }
-    render() {
-        var _a, _b;
-        return (h(Host, { key: 'c78474ccae6afb47766f571d86fe235c7d61d1ba' }, h("mds-text", { key: '3535c07209e5465959044593d89cce53ab128180', class: "info", typography: "caption" }, h("b", { key: '68be38f8895654dd40214f66fb7241012d392199' }, this.t.get('label')), ' ', this.disabled
-            ? this.t.get(this.theme[(_a = this.mode) !== null && _a !== void 0 ? _a : this.defaultMode].label, { forced: true })
-            : this.t.get(this.theme[(_b = this.mode) !== null && _b !== void 0 ? _b : this.defaultMode].label, { forced: false })), h("mds-tab", { key: '22fe4bd6c21908dc356a322226cfe7518952f68d', fill: true, size: this.size }, h("mds-tab-item", { key: 'c40a7c19794324a2156bd0cfa6a085e4ed98194e', disabled: this.disabled, selected: this.mode === 'light', onClick: () => {
-                if (this.overlayShow) {
-                    return;
-                }
-                this.changeTheme('light');
-            }, class: "item item--light", icon: miBaselineLightMode }), h("mds-tab-item", { key: '4986b3c390f38ffbe292d36180ab8b6799eda730', disabled: this.disabled, selected: this.mode === 'system', onClick: () => {
-                if (this.overlayShow) {
-                    return;
-                }
-                this.changeTheme('system');
-            }, class: "item item--system", icon: miBaselineSettings }), h("mds-tab-item", { key: '5e211984d3891daa894fe391277a1574d98ea1a1', disabled: this.disabled, selected: this.mode === 'dark', onClick: () => {
-                if (this.overlayShow) {
-                    return;
-                }
-                this.changeTheme('dark');
-            }, class: "item item--dark", icon: this.mode === 'dark' ? miBaselineDarkMode : miOutlineDarkMode }))));
-    }
-    get element() { return this; }
-    static get watchers() { return {
-        "mode": ["modeChanged"]
-    }; }
-    static get style() { return mdsPrefThemeCss; }
-}, [257, "mds-pref-theme", {
-        "size": [513],
-        "mode": [1537],
-        "transition": [1537],
-        "language": [32],
-        "disabled": [32],
-        "updateLang": [64]
-    }, undefined, {
-        "mode": ["modeChanged"]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["mds-pref-theme", "mds-button", "mds-icon", "mds-spinner", "mds-tab", "mds-tab-item", "mds-text"];
-    components.forEach(tagName => { switch (tagName) {
-        case "mds-pref-theme":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, MdsPrefTheme$1);
-            }
-            break;
-        case "mds-button":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$7();
-            }
-            break;
-        case "mds-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$6();
-            }
-            break;
-        case "mds-spinner":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$5();
-            }
-            break;
-        case "mds-tab":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$4();
-            }
-            break;
-        case "mds-tab-item":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$3();
-            }
-            break;
-        case "mds-text":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-
-const MdsPrefTheme = MdsPrefTheme$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { MdsPrefTheme, defineCustomElement };
+import{proxyCustomElement as e,HTMLElement as t,createEvent as s,h as i,Host as o,transformTag as a}from"@stencil/core/internal/client";import{c as r}from"./unit.js";import{m}from"./settings.js";import{L as h}from"./locale.js";import{i as d}from"./browser.js";import{d as l}from"./mds-button2.js";import{d as n}from"./mds-icon2.js";import{d as c}from"./mds-spinner2.js";import{d as f}from"./mds-tab2.js";import{d as b}from"./mds-tab-item2.js";import{d as p}from"./mds-text2.js";var u={darkMode:"Σκούρο",label:"Λειτουργία θέματος",lightMode:"Ανοιχτό{{#forced}} (επιβεβλημένο στο Safari){{/forced}}",systemSettings:"Με βάση το λειτουργικό σύστημα"},g={darkMode:"Dark",label:"Theme mode",lightMode:"Light{{#forced}} (forced on Safari){{/forced}}",systemSettings:"Based on operating system"},y={darkMode:"Oscura",label:"Modo de tema",lightMode:"Clara{{#forced}} (forzada en Safari){{/forced}}",systemSettings:"Basado en el sistema operativo"},v={darkMode:"Scura",label:"Modalità tema",lightMode:"Chiara{{#forced}} (forzata su Safari){{/forced}}",systemSettings:"Basato sul sistema operativo"};const k=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.prefChangeEvent=s(this,"mdsPrefChange",7),this.defaultMode="system",this.t=new h({el:u,en:g,es:y,it:v}),this.localStorageAlias="mdsPrefTheme",this.customPropertyAlias="--magma-pref-user-theme",this.overlayBackgroundVisible="rgb(var(--tone-neutral))",this.overlayBackgroundHidden="rgb(var(--tone-neutral) / 0)",this.cssOverlayShowDuration="300",this.cssOverlayFadeoutDuration="200",this.cssOverlayZIndex="6000",this.overlayId="mds-pref-theme-overlay",this.overlayShow=!1,this.disabled=!1,this.updateCSSCustomProps=()=>{var e,t,s;if("undefined"==typeof window)return;const i=window.getComputedStyle(this.element);this.cssOverlayShowDuration=null!==(e=i.getPropertyValue("--mds-pref-theme-overlay-show-duration"))&&void 0!==e?e:"300",this.cssOverlayFadeoutDuration=null!==(t=i.getPropertyValue("--mds-pref-theme-overlay-fadeout-duration"))&&void 0!==t?t:"200",this.cssOverlayZIndex=null!==(s=i.getPropertyValue("--mds-pref-theme-overlay-z-index"))&&void 0!==s?s:"6000"},this.transition="smooth",this.theme={dark:{selector:"pref-theme-dark",label:"darkMode"},system:{selector:"pref-theme-system",label:"systemSettings"},light:{selector:"pref-theme-light",label:"lightMode"}},this.setTheme=e=>{if(this.prefChangeEvent.emit({preference:"theme-mode"}),this.mode=e,localStorage.setItem(this.localStorageAlias,this.mode),"undefined"!=typeof document){const t=document.querySelector("html");for(const e in this.theme)({}).hasOwnProperty.call(this.theme,e)&&(null==t||t.classList.remove(this.theme[e].selector));null==t||t.classList.add(this.theme[e].selector),null==t||t.style.setProperty(this.customPropertyAlias,this.mode)}},this.isDarkMode=()=>window.matchMedia&&window.matchMedia("(prefers-color-scheme: dark)").matches,this.getColorScheme=e=>void 0!==e?"system"===e?this.isDarkMode()?"dark":"light":e:"system"===this.mode?this.isDarkMode()?"dark":"light":this.mode,this.instanceOverlay=()=>{null==this.overlayEl&&(this.overlayEl=document.createElement("div"),this.overlayEl.className=this.overlayId,this.overlayEl.style.inset="0",this.overlayEl.style.pointerEvents="none",this.overlayEl.style.position="fixed",this.overlayEl.style.transition=`background-color ${this.cssOverlayFadeoutDuration} ease-out`,this.overlayEl.style.zIndex=this.cssOverlayZIndex),this.overlayEl.style.backgroundColor=this.overlayBackgroundHidden},this.attachFlashOverlayTransition=()=>{this.overlayShow=!0,this.instanceOverlay(),this.overlayEl.style.backgroundColor=this.overlayBackgroundVisible,document.body.appendChild(this.overlayEl),clearTimeout(this.overlayTimer),this.overlayTimer=setTimeout((()=>{this.overlayShow=!1,this.detachOverlayTransition()}),r(this.cssOverlayShowDuration))},this.attachSmoothOverlayTransition=e=>{this.overlayShow=!0,this.instanceOverlay(),document.body.appendChild(this.overlayEl),clearTimeout(this.overlaySmoothTimer),this.overlaySmoothTimer=setTimeout((()=>{this.overlayEl.style.backgroundColor=this.overlayBackgroundVisible,clearTimeout(this.overlayTimer),this.overlayTimer=setTimeout((()=>{this.setTheme(e),clearTimeout(this.overlayTimer),this.overlayTimer=setTimeout((()=>{this.overlayShow=!1,this.detachOverlayTransition()}),r(this.cssOverlayFadeoutDuration))}),r(this.cssOverlayShowDuration))}),1)},this.changeTheme=e=>{if(!this.disabled)if(this.getColorScheme()!==this.getColorScheme(e))switch(this.transition){case"none":default:this.setTheme(e);break;case"flash":this.setTheme(e),this.attachFlashOverlayTransition();break;case"smooth":this.attachSmoothOverlayTransition(e)}else this.setTheme(e)}}async updateLang(){this.language=this.t.lang(this.element)}componentWillRender(){var e,t;this.t.lang(this.element),d()?(this.disabled=!0,this.mode="light"):this.setTheme(null!==(t=null!==(e=this.mode)&&void 0!==e?e:localStorage.getItem(this.localStorageAlias))&&void 0!==t?t:this.defaultMode)}componentDidLoad(){this.updateCSSCustomProps()}modeChanged(e,t){e!==t&&this.setTheme(e)}detachOverlayTransition(){null!=this.overlayEl&&(this.overlayEl.style.backgroundColor=this.overlayBackgroundHidden,clearTimeout(this.overlayTimer),this.overlayTimer=setTimeout((()=>{this.overlayEl.remove()}),r(this.cssOverlayFadeoutDuration)))}render(){var e,t;return i(o,{key:"d39c062c0ddd2b9f321ce4d153613ab35628ba07"},i("mds-text",{key:"547812a4d5c9e790fdb71e19e39156842a1635e2",class:"info",typography:"caption"},i("b",{key:"343a8359be692988c9ec734d52246d16950e6185"},this.t.get("label"))," ",this.disabled?this.t.get(this.theme[null!==(e=this.mode)&&void 0!==e?e:this.defaultMode].label,{forced:!0}):this.t.get(this.theme[null!==(t=this.mode)&&void 0!==t?t:this.defaultMode].label,{forced:!1})),i("mds-tab",{key:"86baac9e84e019c9367a521fcc6d1a61adbc43ce",fill:!0,size:this.size},i("mds-tab-item",{key:"8c1d7742877300f0efe7c9e93ddb99aa24722cca",disabled:this.disabled,selected:"light"===this.mode,onClick:()=>{this.overlayShow||this.changeTheme("light")},class:"item item--light",icon:'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 7c-2.76 0-5 2.24-5 5s2.24 5 5 5s5-2.24 5-5s-2.24-5-5-5zM2 13h2c.55 0 1-.45 1-1s-.45-1-1-1H2c-.55 0-1 .45-1 1s.45 1 1 1zm18 0h2c.55 0 1-.45 1-1s-.45-1-1-1h-2c-.55 0-1 .45-1 1s.45 1 1 1zM11 2v2c0 .55.45 1 1 1s1-.45 1-1V2c0-.55-.45-1-1-1s-1 .45-1 1zm0 18v2c0 .55.45 1 1 1s1-.45 1-1v-2c0-.55-.45-1-1-1s-1 .45-1 1zM5.99 4.58a.996.996 0 0 0-1.41 0a.996.996 0 0 0 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0s.39-1.03 0-1.41L5.99 4.58zm12.37 12.37a.996.996 0 0 0-1.41 0a.996.996 0 0 0 0 1.41l1.06 1.06c.39.39 1.03.39 1.41 0a.996.996 0 0 0 0-1.41l-1.06-1.06zm1.06-10.96a.996.996 0 0 0 0-1.41a.996.996 0 0 0-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0l1.06-1.06zM7.05 18.36a.996.996 0 0 0 0-1.41a.996.996 0 0 0-1.41 0l-1.06 1.06c-.39.39-.39 1.03 0 1.41s1.03.39 1.41 0l1.06-1.06z"/></svg>'}),i("mds-tab-item",{key:"1974867e21420238c2e8000091dd2e5dfaf4d0c1",disabled:this.disabled,selected:"system"===this.mode,onClick:()=>{this.overlayShow||this.changeTheme("system")},class:"item item--system",icon:m}),i("mds-tab-item",{key:"1c433c2879c2165b08d896bdb8fff6d7d8fe1b2e",disabled:this.disabled,selected:"dark"===this.mode,onClick:()=>{this.overlayShow||this.changeTheme("dark")},class:"item item--dark",icon:"dark"===this.mode?'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 3a9 9 0 1 0 9 9c0-.46-.04-.92-.1-1.36a5.389 5.389 0 0 1-4.4 2.26a5.403 5.403 0 0 1-3.14-9.8c-.44-.06-.9-.1-1.36-.1z"/></svg>':'<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M9.37 5.51A7.35 7.35 0 0 0 9.1 7.5c0 4.08 3.32 7.4 7.4 7.4c.68 0 1.35-.09 1.99-.27A7.014 7.014 0 0 1 12 19c-3.86 0-7-3.14-7-7c0-2.93 1.81-5.45 4.37-6.49zM12 3a9 9 0 1 0 9 9c0-.46-.04-.92-.1-1.36a5.389 5.389 0 0 1-4.4 2.26a5.403 5.403 0 0 1-3.14-9.8c-.44-.06-.9-.1-1.36-.1z"/></svg>'})))}get element(){return this}static get watchers(){return{mode:[{modeChanged:0}]}}static get style(){return'@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,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-pref-theme-overlay-fadeout-duration:.2s;--mds-pref-theme-overlay-show-duration:.3s;--mds-pref-theme-overlay-z-index:var(--magma-theme-overlay-z-index,6000)}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),:is(mds-tab,mds-tab-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-pref-theme-overlay-fadeout-duration{syntax:"<time>";inherits:false;initial-value:.2s}@property --mds-pref-theme-overlay-show-duration{syntax:"<time>";inherits:false;initial-value:.3s}:host{--mds-pref-theme-overlay-fadeout-duration:.2s;--mds-pref-theme-overlay-show-duration:.3s;--mds-pref-theme-overlay-z-index:var(--magma-theme-overlay-z-index,6000);display:grid;gap:calc(var(--spacing,.0025rem)*100)}.item{--mds-tab-item-default-color:rgb(var(--tone-neutral-05,197 197 197));flex-basis:0;flex-grow:1}.item--system{--mds-tab-item-selected-color:rgb(var(--tone-neutral-03,233 233 233))}.item--light{--mds-tab-item-selected-color:rgb(var(--label-yellow-06,188 143 6))}.item--dark{--mds-tab-item-selected-color:rgb(var(--label-sky-06,13 158 224))}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)) .item{--mds-tab-item-default-color:rgb(var(--tone-neutral-01,255 255 255))}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)) .item--system{--mds-tab-item-selected-color:rgb(var(--tone-neutral-03,233 233 233))}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)) .item--light{--mds-tab-item-selected-color:rgb(var(--label-yellow-03,251 224 142))}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)) .item--dark{--mds-tab-item-selected-color:rgb(var(--label-sky-03,191 232 251))}@media (prefers-color-scheme:dark){:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))) .item{--mds-tab-item-default-color:rgb(var(--tone-neutral-01,255 255 255))}:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))) .item--system{--mds-tab-item-selected-color:rgb(var(--tone-neutral-03,233 233 233))}:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))) .item--light{--mds-tab-item-selected-color:rgb(var(--label-yellow-03,251 224 142))}:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))) .item--dark{--mds-tab-item-selected-color:rgb(var(--label-sky-03,191 232 251))}}'}},[1,"mds-pref-theme",{size:[513],mode:[1537],transition:[1537],language:[32],disabled:[32],updateLang:[64]},void 0,{mode:[{modeChanged:0}]}]),w=k,x=function(){"undefined"!=typeof customElements&&["mds-pref-theme","mds-button","mds-icon","mds-spinner","mds-tab","mds-tab-item","mds-text"].forEach((e=>{switch(e){case"mds-pref-theme":customElements.get(a(e))||customElements.define(a(e),k);break;case"mds-button":customElements.get(a(e))||l();break;case"mds-icon":customElements.get(a(e))||n();break;case"mds-spinner":customElements.get(a(e))||c();break;case"mds-tab":customElements.get(a(e))||f();break;case"mds-tab-item":customElements.get(a(e))||b();break;case"mds-text":customElements.get(a(e))||p()}}))};export{w as MdsPrefTheme,x as defineCustomElement}

package/dist/components/mds-pref.js

@@ -1,150 +1 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { L as Locale } from './locale.js';
-import { d as defineCustomElement$2 } from './mds-text2.js';
-
-const reloadPageToSeeChanges$3 = "Πρέπει να ανανεώσετε τη σελίδα για να δείτε όλες τις αλλαγές, διαφορετικά θα είναι ορατές μόνο για τα πρόσφατα μεταφορτωμένα στοιχεία.";
-var localeEl = {
-	reloadPageToSeeChanges: reloadPageToSeeChanges$3
-};
-
-const reloadPageToSeeChanges$2 = "You must refresh the page to see all changes, or they will only be visible for new items uploaded.";
-var localeEn = {
-	reloadPageToSeeChanges: reloadPageToSeeChanges$2
-};
-
-const reloadPageToSeeChanges$1 = "Es necesario actualizar la página para ver todos los cambios, o solo serán visibles para los nuevos elementos cargados.";
-var localeEs = {
-	reloadPageToSeeChanges: reloadPageToSeeChanges$1
-};
-
-const reloadPageToSeeChanges = "È necessario aggiornare la pagina per vedere tutti i cambiamenti, oppure saranno visibili solo per i nuovi elementi caricati.";
-var localeIt = {
-	reloadPageToSeeChanges: reloadPageToSeeChanges
-};
-
-const mdsPrefCss = "@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),mds-text:not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}:host{display:grid;gap:calc(var(--spacing,.0025rem)*400)}:host(:empty),:host([controller]){display:none}.reload-required{display:grid;gap:calc(var(--spacing,.0025rem)*200)}";
-
-const MdsPref$1 = /*@__PURE__*/ proxyCustomElement(class MdsPref extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-        this.showReload = false;
-        this.prefNeedsReload = ['consumption', 'language'];
-        this.t = new Locale({
-            el: localeEl,
-            en: localeEn,
-            es: localeEs,
-            it: localeIt,
-        });
-        this.addPerfEvents = () => {
-            this.addEvent(this.host.querySelector('mds-pref-consumption'));
-            this.addEvent(this.host.querySelector('mds-pref-contrast'));
-            this.addEvent(this.host.querySelector('mds-pref-language'));
-            this.addEvent(this.host.querySelector('mds-pref-theme'));
-            this.addEvent(this.host.querySelector('mds-pref-theme-variant'));
-        };
-        this.removePerfEvents = () => {
-            this.removeEvent(this.host.querySelector('mds-pref-consumption'));
-            this.removeEvent(this.host.querySelector('mds-pref-contrast'));
-            this.removeEvent(this.host.querySelector('mds-pref-language'));
-            this.removeEvent(this.host.querySelector('mds-pref-theme'));
-            this.removeEvent(this.host.querySelector('mds-pref-theme-variant'));
-        };
-        this.handlePrefChangeEvent = (e) => {
-            if (this.prefNeedsReload.includes(e.detail.preference)) {
-                this.showReload = true;
-                if (e.detail.preference === 'language') {
-                    this.t.lang(this.host);
-                }
-            }
-        };
-        this.addEvent = (element) => {
-            if (!element)
-                return;
-            element.addEventListener('mdsPrefChange', this.handlePrefChangeEvent.bind(this));
-        };
-        this.removeEvent = (element) => {
-            if (!element)
-                return;
-            element.removeEventListener('mdsPrefChange', this.handlePrefChangeEvent.bind(this));
-        };
-    }
-    async updateLang() {
-        this.language = this.t.lang(this.host);
-    }
-    handleControllerChange(newValue) {
-        if (newValue === false) {
-            this.controller = undefined;
-        }
-    }
-    handleSizeChange(newValue) {
-        const allElements = Array.from(this.host.querySelectorAll('*'));
-        const elements = allElements.filter((el) => el.tagName.toLowerCase().startsWith('mds-pref-'));
-        elements.forEach((element) => {
-            element.size = newValue;
-        });
-    }
-    componentWillRender() {
-        this.t.lang(this.host);
-    }
-    componentDidLoad() {
-        var _a;
-        if (window) {
-            (_a = document.documentElement) === null || _a === void 0 ? void 0 : _a.setAttribute('data-magma-pref', '');
-        }
-        if (this.controller) {
-            this.addPerfEvents();
-        }
-    }
-    disconnectedCallback() {
-        var _a;
-        if (window) {
-            (_a = document.documentElement) === null || _a === void 0 ? void 0 : _a.removeAttribute('data-magma-pref');
-        }
-        this.removePerfEvents();
-    }
-    render() {
-        return (h(Host, { key: '8c5ead4e84eabbf2382ed64eaec6a6b9efb5ffee' }, h("slot", { key: '136f362db37befead20e9f04a9e3a9e8c0f9a94c' }), this.showReload && (h("div", { key: '96959ca6338ac7d11259e97f74712378941aab38', class: "reload-required" }, h("mds-text", { key: '3d7c32617dc21f76c22e940a7cbc791515863b6a', typography: "caption" }, this.t.get('reloadPageToSeeChanges'))))));
-    }
-    get host() { return this; }
-    static get watchers() { return {
-        "controller": ["handleControllerChange"],
-        "size": ["handleSizeChange"]
-    }; }
-    static get style() { return mdsPrefCss; }
-}, [257, "mds-pref", {
-        "size": [513],
-        "controller": [1540],
-        "showReload": [32],
-        "language": [32],
-        "updateLang": [64]
-    }, undefined, {
-        "controller": ["handleControllerChange"],
-        "size": ["handleSizeChange"]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["mds-pref", "mds-text"];
-    components.forEach(tagName => { switch (tagName) {
-        case "mds-pref":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, MdsPref$1);
-            }
-            break;
-        case "mds-text":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-
-const MdsPref = MdsPref$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { MdsPref, defineCustomElement };
+import{proxyCustomElement as e,HTMLElement as t,h as s,Host as a,transformTag as i}from"@stencil/core/internal/client";import{L as o}from"./locale.js";import{d as n}from"./mds-text2.js";var r={reloadPageToSeeChanges:"Πρέπει να ανανεώσετε τη σελίδα για να δείτε όλες τις αλλαγές, διαφορετικά θα είναι ορατές μόνο για τα πρόσφατα μεταφορτωμένα στοιχεία."},d={reloadPageToSeeChanges:"You must refresh the page to see all changes, or they will only be visible for new items uploaded."},h={reloadPageToSeeChanges:"Es necesario actualizar la página para ver todos los cambios, o solo serán visibles para los nuevos elementos cargados."},l={reloadPageToSeeChanges:"È necessario aggiornare la pagina per vedere tutti i cambiamenti, oppure saranno visibili solo per i nuovi elementi caricati."};const c=e(class extends t{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.showReload=!1,this.prefNeedsReload=["consumption","language"],this.t=new o({el:r,en:d,es:h,it:l}),this.addPerfEvents=()=>{this.addEvent(this.host.querySelector("mds-pref-consumption")),this.addEvent(this.host.querySelector("mds-pref-contrast")),this.addEvent(this.host.querySelector("mds-pref-language")),this.addEvent(this.host.querySelector("mds-pref-theme")),this.addEvent(this.host.querySelector("mds-pref-theme-variant"))},this.removePerfEvents=()=>{this.removeEvent(this.host.querySelector("mds-pref-consumption")),this.removeEvent(this.host.querySelector("mds-pref-contrast")),this.removeEvent(this.host.querySelector("mds-pref-language")),this.removeEvent(this.host.querySelector("mds-pref-theme")),this.removeEvent(this.host.querySelector("mds-pref-theme-variant"))},this.handlePrefChangeEvent=e=>{this.prefNeedsReload.includes(e.detail.preference)&&(this.showReload=!0,"language"===e.detail.preference&&this.t.lang(this.host))},this.addEvent=e=>{e&&e.addEventListener("mdsPrefChange",this.handlePrefChangeEvent.bind(this))},this.removeEvent=e=>{e&&e.removeEventListener("mdsPrefChange",this.handlePrefChangeEvent.bind(this))}}async updateLang(){this.language=this.t.lang(this.host)}handleControllerChange(e){!1===e&&(this.controller=void 0)}handleSizeChange(e){Array.from(this.host.querySelectorAll("*")).filter((e=>e.tagName.toLowerCase().startsWith("mds-pref-"))).forEach((t=>{t.size=e}))}componentWillRender(){this.t.lang(this.host)}componentDidLoad(){var e;"undefined"!=typeof window&&(null===(e=document.documentElement)||void 0===e||e.setAttribute("data-magma-pref","")),this.controller&&this.addPerfEvents()}disconnectedCallback(){var e;"undefined"!=typeof window&&(null===(e=document.documentElement)||void 0===e||e.removeAttribute("data-magma-pref")),this.removePerfEvents()}render(){return s(a,{key:"9b6e06abc8d530f2e148f4823bb70ace4cfd786b"},s("slot",{key:"5be136360ee11b12cec8664a1e6c228c924a4123"}),this.showReload&&s("div",{key:"a10b658b7a064be2b89101422e273402235c92c8",class:"reload-required"},s("mds-text",{key:"d66a8213bfc744d590817f72e4ae63e8b3684d40",typography:"caption"},this.t.get("reloadPageToSeeChanges"))))}get host(){return this}static get watchers(){return{controller:[{handleControllerChange:0}],size:[{handleSizeChange:0}]}}static get style(){return"@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),mds-text:not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}:host{display:grid;gap:calc(var(--spacing,.0025rem)*400)}:host(:empty),:host([controller]){display:none}.reload-required{display:grid;gap:calc(var(--spacing,.0025rem)*200)}"}},[257,"mds-pref",{size:[513],controller:[1540],showReload:[32],language:[32],updateLang:[64]},void 0,{controller:[{handleControllerChange:0}],size:[{handleSizeChange:0}]}]),m=c,p=function(){"undefined"!=typeof customElements&&["mds-pref","mds-text"].forEach((e=>{switch(e){case"mds-pref":customElements.get(i(e))||customElements.define(i(e),c);break;case"mds-text":customElements.get(i(e))||n()}}))};export{m as MdsPref,p as defineCustomElement}

package/dist/components/mds-price-table-features-cell.js

@@ -1,49 +1 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { m as miBaselineCheckCircle } from './check-circle.js';
-import { m as miBaselineHorizontalRule } from './horizontal-rule.js';
-import { d as defineCustomElement$2 } from './mds-text2.js';
-
-const mdsPriceTableFeaturesCellCss = "@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--mds-price-table-features-cell-padding:var(--mds-price-table-features-padding,calc(var(--spacing,.0025rem)*300));--mds-price-table-features-cell-icon-supported-color-hover:rgb(var(--label-green-06,30 171 82));--mds-price-table-features-cell-icon-supported-color:rgb(var(--label-green-06,30 171 82));--mds-price-table-features-cell-icon-unsupported-color-hover:rgb(var(--tone-neutral-06,158 158 158));--mds-price-table-features-cell-icon-unsupported-color:rgb(var(--tone-neutral-06,158 158 158));--mds-price-table-features-cell-border-color:rgb(var(--tone-neutral-08,107 107 107));--tw-duration:initial;--tw-ease:initial}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),mds-text:not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}:host{--mds-price-table-features-cell-padding:var(--mds-price-table-features-padding,calc(var(--spacing,.0025rem)*300));--mds-price-table-features-cell-icon-supported-color-hover:rgb(var(--label-green-06,30 171 82));--mds-price-table-features-cell-icon-supported-color:rgb(var(--label-green-06,30 171 82));--mds-price-table-features-cell-icon-unsupported-color-hover:rgb(var(--tone-neutral-06,158 158 158));--mds-price-table-features-cell-icon-unsupported-color:rgb(var(--tone-neutral-06,158 158 158));--mds-price-table-features-cell-border-color:rgb(var(--tone-neutral-08,107 107 107));--tw-duration:.2s;--tw-ease:var(--ease-out,cubic-bezier(0,0,.2,1));border-bottom:1px solid var(--mds-price-table-features-cell-border-color,rgb(var(--tone-neutral-08,107 107 107)));display:table-cell;padding:var(--mds-price-table-features-cell-padding,var(--mds-price-table-features-padding,calc(var(--spacing,.0025rem)*300)));transition-duration:.2s;transition-property:border-color,transform;transition-timing-function:var(--ease-out,cubic-bezier(0,0,.2,1));vertical-align:top}.icon{height:calc(var(--spacing,.0025rem)*600);width:calc(var(--spacing,.0025rem)*600);--tw-duration:.2s;--tw-ease:var(--ease-out,cubic-bezier(0,0,.2,1));display:flex;fill:var(--icon-fill-color,currentColor);transition-duration:.2s;transition-property:fill;transition-timing-function:var(--ease-out,cubic-bezier(0,0,.2,1))}.icon svg{aspect-ratio:1;aspect-ratio:var(--aspect-square,1/1);height:100%;width:100%}.icon--supported{--icon-fill-color:var(--mds-price-table-features-cell-icon-supported-color,rgb(var(--label-green-06,30 171 82)))}.icon--unsupported{--icon-fill-color:var(--mds-price-table-features-cell-icon-unsupported-color,rgb(var(--tone-neutral-06,158 158 158)))}:host-context(:root.pref-animation-reduce){transition-duration:0s}:host-context(:root.pref-animation-reduce) .icon{transition-duration:0s}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){--mds-price-table-features-cell-border-color:rgb(var(--tone-neutral-07,134 134 134));--mds-price-table-features-cell-icon-supported-color:rgb(var(--label-green-03,173 241 198));--mds-price-table-features-cell-icon-supported-color-hover:rgb(var(--label-green-02,211 247 224));--mds-price-table-features-cell-icon-unsupported-color-hover:rgb(var(--tone-neutral-04,218 218 218))}:host-context(:root.pref-contrast-more){--mds-price-table-features-cell-icon-supported-color-hover:rgb(var(--label-green-01,231 251 239));--mds-price-table-features-cell-icon-supported-color:rgb(var(--label-green-02,211 247 224));--mds-price-table-features-cell-icon-unsupported-color-hover:rgb(var(--tone-neutral-02,244 244 244));--mds-price-table-features-cell-icon-unsupported-color:rgb(var(--tone-neutral-02,244 244 244));--mds-price-table-features-cell-border-color:rgb(var(--tone-neutral-04,218 218 218))}@property --tw-duration{syntax:\"*\";inherits:false}@property --tw-ease{syntax:\"*\";inherits:false}@media (prefers-reduced-motion){:is(:host-context(:root.pref-animation-system),:host-context(:root:not([data-magma-pref]))),:is(:host-context(:root.pref-animation-system),:host-context(:root:not([data-magma-pref]))) .icon{transition-duration:0s}}@media (prefers-color-scheme:dark){:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))){--mds-price-table-features-cell-border-color:rgb(var(--tone-neutral-07,134 134 134));--mds-price-table-features-cell-icon-supported-color:rgb(var(--label-green-03,173 241 198));--mds-price-table-features-cell-icon-supported-color-hover:rgb(var(--label-green-02,211 247 224));--mds-price-table-features-cell-icon-unsupported-color-hover:rgb(var(--tone-neutral-04,218 218 218))}}@media (prefers-contrast:more){:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))){--mds-price-table-features-cell-icon-supported-color-hover:rgb(var(--label-green-01,231 251 239));--mds-price-table-features-cell-icon-supported-color:rgb(var(--label-green-02,211 247 224));--mds-price-table-features-cell-icon-unsupported-color-hover:rgb(var(--tone-neutral-02,244 244 244));--mds-price-table-features-cell-icon-unsupported-color:rgb(var(--tone-neutral-02,244 244 244));--mds-price-table-features-cell-border-color:rgb(var(--tone-neutral-04,218 218 218))}}";
-
-const MdsPriceTableFeaturesCell$1 = /*@__PURE__*/ proxyCustomElement(class MdsPriceTableFeaturesCell extends HTMLElement {
-    constructor(registerHost) {
-        super();
-        if (registerHost !== false) {
-            this.__registerHost();
-        }
-        this.__attachShadow();
-        /**
-         * Specifies the support type which is represented
-         */
-        this.type = 'text';
-    }
-    render() {
-        return (h(Host, { key: '54e7d4ba98f366ca072ce0e4faf02a093db43369' }, this.type === 'supported' && (h("i", { key: '3131fd8fc3fae4b821fd643e84477ef78700d2e2', class: "icon icon--supported", innerHTML: miBaselineCheckCircle, part: "icon" })), this.type === 'unsupported' && (h("i", { key: '8080a37fd7dc031bc3e162480a76d88b5b1a32f6', class: "icon icon--unsupported", innerHTML: miBaselineHorizontalRule, part: "icon" })), this.type === 'text' && (h("mds-text", { key: '47ccf913caed4f3a3b8070e8c5d51699fa66b96b', part: "text", typography: "detail" }, h("slot", { key: '125c00d4287ce168a20d1cde74ad06bd61d19112' }))), this.type === 'custom' && h("slot", { key: '875b44b69e06f7d8a464b4d598b5a00680d78a3a' }), this.type === 'label' && h("slot", { key: 'f584c21d6d8af59d3a8a0be9b4f008478eefd279' })));
-    }
-    static get style() { return mdsPriceTableFeaturesCellCss; }
-}, [257, "mds-price-table-features-cell", {
-        "type": [513]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["mds-price-table-features-cell", "mds-text"];
-    components.forEach(tagName => { switch (tagName) {
-        case "mds-price-table-features-cell":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, MdsPriceTableFeaturesCell$1);
-            }
-            break;
-        case "mds-text":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
-
-const MdsPriceTableFeaturesCell = MdsPriceTableFeaturesCell$1;
-const defineCustomElement = defineCustomElement$1;
-
-export { MdsPriceTableFeaturesCell, defineCustomElement };
+import{proxyCustomElement as e,HTMLElement as r,h as t,Host as o,transformTag as a}from"@stencil/core/internal/client";import{m as l}from"./check-circle.js";import{m as s}from"./horizontal-rule.js";import{d as c}from"./mds-text2.js";const n=e(class extends r{constructor(e){super(),!1!==e&&this.__registerHost(),this.__attachShadow(),this.type="text"}render(){return t(o,{key:"c2128e191ac5c1b87f07094c22ec8933b7a21874"},"supported"===this.type&&t("i",{key:"af9fc4de6bdf3698ce80126b5166809920ec209c",class:"icon icon--supported",innerHTML:l,part:"icon"}),"unsupported"===this.type&&t("i",{key:"ca1fd3835fa926af3989f75e79354512d46ae37a",class:"icon icon--unsupported",innerHTML:s,part:"icon"}),"text"===this.type&&t("mds-text",{key:"6ad51db1f44912c8e175edf8530234d947bda5a5",part:"text",typography:"detail"},t("slot",{key:"856ddd5a1d444fe3127379f2d7b2c2ce1a27c292"})),"custom"===this.type&&t("slot",{key:"0a206aad7c9d1e7ba0e647db8ebb47a8eef396aa"}),"label"===this.type&&t("slot",{key:"17d326be1ffeb2fb4f0dc832e0233a8cf5fcd197"}))}static get style(){return'@layer reset,vendor,theme,base,components,utilities;@layer reset,vendor,theme,base,components,utilities;@layer properties{@supports (((-webkit-hyphens:none)) and (not (margin-trim:inline))) or ((-moz-orient:inline) and (not (color:rgb(from red r g b)))){*,::backdrop,:after,:before{--mds-price-table-features-cell-padding:var(--mds-price-table-features-padding,calc(var(--spacing,.0025rem)*300));--mds-price-table-features-cell-icon-supported-color-hover:rgb(var(--label-green-06,30 171 82));--mds-price-table-features-cell-icon-supported-color:rgb(var(--label-green-06,30 171 82));--mds-price-table-features-cell-icon-unsupported-color-hover:rgb(var(--tone-neutral-06,158 158 158));--mds-price-table-features-cell-icon-unsupported-color:rgb(var(--tone-neutral-06,158 158 158));--mds-price-table-features-cell-border-color:rgb(var(--tone-neutral-08,107 107 107));--tw-duration:initial;--tw-ease:initial}}}@layer reset,vendor,theme,base,components,utilities;:host(:not(:is([hydrated],.hydrated))),mds-text:not(:is([hydrated],.hydrated)){animation-duration:0s;border-color:#0000;box-shadow:0 0 #0000;opacity:0;outline-color:#0000;transition-delay:.1s;transition-duration:0s;visibility:hidden}:host{--mds-price-table-features-cell-padding:var(--mds-price-table-features-padding,calc(var(--spacing,.0025rem)*300));--mds-price-table-features-cell-icon-supported-color-hover:rgb(var(--label-green-06,30 171 82));--mds-price-table-features-cell-icon-supported-color:rgb(var(--label-green-06,30 171 82));--mds-price-table-features-cell-icon-unsupported-color-hover:rgb(var(--tone-neutral-06,158 158 158));--mds-price-table-features-cell-icon-unsupported-color:rgb(var(--tone-neutral-06,158 158 158));--mds-price-table-features-cell-border-color:rgb(var(--tone-neutral-08,107 107 107));--tw-duration:.2s;--tw-ease:var(--ease-out,cubic-bezier(0,0,.2,1));border-bottom:1px solid var(--mds-price-table-features-cell-border-color,rgb(var(--tone-neutral-08,107 107 107)));display:table-cell;padding:var(--mds-price-table-features-cell-padding,var(--mds-price-table-features-padding,calc(var(--spacing,.0025rem)*300)));transition-duration:.2s;transition-property:border-color,transform;transition-timing-function:var(--ease-out,cubic-bezier(0,0,.2,1));vertical-align:top}.icon svg{aspect-ratio:var(--aspect-square,1/1);height:100%;width:100%}.icon{height:calc(var(--spacing,.0025rem)*600);width:calc(var(--spacing,.0025rem)*600);--tw-duration:.2s;--tw-ease:var(--ease-out,cubic-bezier(0,0,.2,1));display:flex;fill:var(--icon-fill-color,currentColor);transition-duration:.2s;transition-property:fill;transition-timing-function:var(--ease-out,cubic-bezier(0,0,.2,1))}.icon--supported{--icon-fill-color:var(--mds-price-table-features-cell-icon-supported-color,rgb(var(--label-green-06,30 171 82)))}.icon--unsupported{--icon-fill-color:var(--mds-price-table-features-cell-icon-unsupported-color,rgb(var(--tone-neutral-06,158 158 158)))}:host-context(:root.pref-animation-reduce){transition-duration:0s}:host-context(:root.pref-animation-reduce) .icon{transition-duration:0s}:host-context(:root.pref-theme-dark:not(.pref-theme-scheme-light)){--mds-price-table-features-cell-border-color:rgb(var(--tone-neutral-07,134 134 134));--mds-price-table-features-cell-icon-supported-color:rgb(var(--label-green-03,173 241 198));--mds-price-table-features-cell-icon-supported-color-hover:rgb(var(--label-green-02,211 247 224));--mds-price-table-features-cell-icon-unsupported-color-hover:rgb(var(--tone-neutral-04,218 218 218))}:host-context(:root.pref-contrast-more){--mds-price-table-features-cell-icon-supported-color-hover:rgb(var(--label-green-01,231 251 239));--mds-price-table-features-cell-icon-supported-color:rgb(var(--label-green-02,211 247 224));--mds-price-table-features-cell-icon-unsupported-color-hover:rgb(var(--tone-neutral-02,244 244 244));--mds-price-table-features-cell-icon-unsupported-color:rgb(var(--tone-neutral-02,244 244 244));--mds-price-table-features-cell-border-color:rgb(var(--tone-neutral-04,218 218 218))}@property --tw-duration{syntax:"*";inherits:false}@property --tw-ease{syntax:"*";inherits:false}@media (prefers-reduced-motion){:is(:host-context(:root.pref-animation-system),:host-context(:root:not([data-magma-pref]))),:is(:host-context(:root.pref-animation-system),:host-context(:root:not([data-magma-pref]))) .icon{transition-duration:0s}}@media (prefers-color-scheme:dark){:is(:host-context(:root.pref-theme-system:not(.pref-theme-scheme-light)),:host-context(:root:not([data-magma-pref]))){--mds-price-table-features-cell-border-color:rgb(var(--tone-neutral-07,134 134 134));--mds-price-table-features-cell-icon-supported-color:rgb(var(--label-green-03,173 241 198));--mds-price-table-features-cell-icon-supported-color-hover:rgb(var(--label-green-02,211 247 224));--mds-price-table-features-cell-icon-unsupported-color-hover:rgb(var(--tone-neutral-04,218 218 218))}}@media (prefers-contrast:more){:is(:host-context(:root.pref-contrast-system),:host-context(:root:not([data-magma-pref]))){--mds-price-table-features-cell-icon-supported-color-hover:rgb(var(--label-green-01,231 251 239));--mds-price-table-features-cell-icon-supported-color:rgb(var(--label-green-02,211 247 224));--mds-price-table-features-cell-icon-unsupported-color-hover:rgb(var(--tone-neutral-02,244 244 244));--mds-price-table-features-cell-icon-unsupported-color:rgb(var(--tone-neutral-02,244 244 244));--mds-price-table-features-cell-border-color:rgb(var(--tone-neutral-04,218 218 218))}}'}},[257,"mds-price-table-features-cell",{type:[513]}]),i=n,d=function(){"undefined"!=typeof customElements&&["mds-price-table-features-cell","mds-text"].forEach((e=>{switch(e){case"mds-price-table-features-cell":customElements.get(a(e))||customElements.define(a(e),n);break;case"mds-text":customElements.get(a(e))||c()}}))};export{i as MdsPriceTableFeaturesCell,d as defineCustomElement}