@ionic/core 8.0.0-dev.11711498366.18f063ac → 8.0.0-rc.0

package/dist/collection/components/action-sheet/action-sheet.md.css

@@ -1,9 +1,3 @@
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use
@@ -252,12 +246,6 @@
     opacity: var(--button-background-hover-opacity);
   }
 }
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use

package/dist/collection/components/alert/alert.ios.css

@@ -1,9 +1,3 @@
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use
@@ -294,12 +288,6 @@ textarea.alert-input {
   resize: none;
 }
 
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use
@@ -355,12 +343,6 @@ textarea.alert-input {
  *   }
  * }
  */
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use

package/dist/collection/components/alert/alert.js

@@ -10,15 +10,14 @@ import { createDelegateController, createTriggerController, BACKDROP, dismiss, e
 import { sanitizeDOMString } from "../../utils/sanitization/index";
 import { getClassMap } from "../../utils/theme";
 import { config } from "../../global/config";
-import { getIonMode, getIonTheme } from "../../global/ionic-global";
+import { getIonMode } from "../../global/ionic-global";
 import { iosEnterAnimation } from "./animations/ios.enter";
 import { iosLeaveAnimation } from "./animations/ios.leave";
 import { mdEnterAnimation } from "./animations/md.enter";
 import { mdLeaveAnimation } from "./animations/md.leave";
 // TODO(FW-2832): types
 /**
- * @virtualProp {"ios" | "md"} mode - The mode determines the platform behaviors of the component.
- * @virtualProp {"ios" | "md" | "ionic"} theme - The theme determines the visual appearance of the component.
+ * @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
  */
 export class Alert {
     constructor() {
@@ -324,11 +323,11 @@ export class Alert {
     }
     renderCheckbox() {
         const inputs = this.processedInputs;
-        const theme = getIonTheme(this);
+        const mode = getIonMode(this);
         if (inputs.length === 0) {
             return null;
         }
-        return (h("div", { class: "alert-checkbox-group" }, inputs.map((i) => (h("button", { type: "button", onClick: () => this.cbClick(i), "aria-checked": `${i.checked}`, id: i.id, disabled: i.disabled, tabIndex: i.tabindex, role: "checkbox", class: Object.assign(Object.assign({}, getClassMap(i.cssClass)), { 'alert-tappable': true, 'alert-checkbox': true, 'alert-checkbox-button': true, 'ion-focusable': true, 'alert-checkbox-button-disabled': i.disabled || false }) }, h("div", { class: "alert-button-inner" }, h("div", { class: "alert-checkbox-icon" }, h("div", { class: "alert-checkbox-inner" })), h("div", { class: "alert-checkbox-label" }, i.label)), theme === 'md' && h("ion-ripple-effect", null))))));
+        return (h("div", { class: "alert-checkbox-group" }, inputs.map((i) => (h("button", { type: "button", onClick: () => this.cbClick(i), "aria-checked": `${i.checked}`, id: i.id, disabled: i.disabled, tabIndex: i.tabindex, role: "checkbox", class: Object.assign(Object.assign({}, getClassMap(i.cssClass)), { 'alert-tappable': true, 'alert-checkbox': true, 'alert-checkbox-button': true, 'ion-focusable': true, 'alert-checkbox-button-disabled': i.disabled || false }) }, h("div", { class: "alert-button-inner" }, h("div", { class: "alert-checkbox-icon" }, h("div", { class: "alert-checkbox-inner" })), h("div", { class: "alert-checkbox-label" }, i.label)), mode === 'md' && h("ion-ripple-effect", null))))));
     }
     renderRadio() {
         const inputs = this.processedInputs;
@@ -366,12 +365,12 @@ export class Alert {
     }
     renderAlertButtons() {
         const buttons = this.processedButtons;
-        const theme = getIonTheme(this);
+        const mode = getIonMode(this);
         const alertButtonGroupClass = {
             'alert-button-group': true,
             'alert-button-group-vertical': buttons.length > 2,
         };
-        return (h("div", { class: alertButtonGroupClass }, buttons.map((button) => (h("button", Object.assign({}, button.htmlAttributes, { type: "button", id: button.id, class: buttonClass(button), tabIndex: 0, onClick: () => this.buttonClick(button) }), h("span", { class: "alert-button-inner" }, button.text), theme === 'md' && h("ion-ripple-effect", null))))));
+        return (h("div", { class: alertButtonGroupClass }, buttons.map((button) => (h("button", Object.assign({}, button.htmlAttributes, { type: "button", id: button.id, class: buttonClass(button), tabIndex: 0, onClick: () => this.buttonClick(button) }), h("span", { class: "alert-button-inner" }, button.text), mode === 'md' && h("ion-ripple-effect", null))))));
     }
     renderAlertMessage(msgId) {
         const { customHTMLEnabled, message } = this;
@@ -382,7 +381,7 @@ export class Alert {
     }
     render() {
         const { overlayIndex, header, subHeader, message, htmlAttributes } = this;
-        const theme = getIonTheme(this);
+        const mode = getIonMode(this);
         const hdrId = `alert-${overlayIndex}-hdr`;
         const subHdrId = `alert-${overlayIndex}-sub-hdr`;
         const msgId = `alert-${overlayIndex}-msg`;
@@ -392,24 +391,22 @@ export class Alert {
          * If neither is defined, don't set aria-labelledby.
          */
         const ariaLabelledBy = header ? hdrId : subHeader ? subHdrId : null;
-        return (h(Host, Object.assign({ key: '4347164bd4d9d562730d703ef722f9c242dbfbac', role: role, "aria-modal": "true", "aria-labelledby": ariaLabelledBy, "aria-describedby": message !== undefined ? msgId : null, tabindex: "-1" }, htmlAttributes, { style: {
+        return (h(Host, Object.assign({ key: 'fe991967332781c792690760d63857f28e20e928', role: role, "aria-modal": "true", "aria-labelledby": ariaLabelledBy, "aria-describedby": message !== undefined ? msgId : null, tabindex: "-1" }, htmlAttributes, { style: {
                 zIndex: `${20000 + overlayIndex}`,
-            }, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [theme]: true, 'overlay-hidden': true, 'alert-translucent': this.translucent }), onIonAlertWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), h("ion-backdrop", { key: '700d37f6dfcb9f074a16d9eda932f240346a3309', tappable: this.backdropDismiss }), h("div", { key: '6be1a0c688d1f370b33c3cb15ac7cd595ab3173c', tabindex: "0" }), h("div", { key: '2cf6f440c7aa939042316b41e346b434265cd17b', class: "alert-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, h("div", { key: '6a5841d0e591eba94ee1fd43fef042186c755da7', class: "alert-head" }, header && (h("h2", { id: hdrId, class: "alert-title" }, header)), subHeader && (h("h2", { id: subHdrId, class: "alert-sub-title" }, subHeader))), this.renderAlertMessage(msgId), this.renderAlertInputs(), this.renderAlertButtons()), h("div", { key: '692af01401fd3613c798ab85c53e1899f801aeec', tabindex: "0" })));
+            }, class: Object.assign(Object.assign({}, getClassMap(this.cssClass)), { [mode]: true, 'overlay-hidden': true, 'alert-translucent': this.translucent }), onIonAlertWillDismiss: this.dispatchCancelHandler, onIonBackdropTap: this.onBackdropTap }), h("ion-backdrop", { key: 'd2cf69281264c779cd583acc6466b67bbeffff77', tappable: this.backdropDismiss }), h("div", { key: 'cf1613444b085bf41326703a8ee39a0e7da4fbbd', tabindex: "0" }), h("div", { key: 'da4106c5da97987844b9404d968e895d3399d09b', class: "alert-wrapper ion-overlay-wrapper", ref: (el) => (this.wrapperEl = el) }, h("div", { key: '0880f30325c25f08a27f5feaf44c497c64318819', class: "alert-head" }, header && (h("h2", { id: hdrId, class: "alert-title" }, header)), subHeader && (h("h2", { id: subHdrId, class: "alert-sub-title" }, subHeader))), this.renderAlertMessage(msgId), this.renderAlertInputs(), this.renderAlertButtons()), h("div", { key: '20c5e7f555e64750e5043aa62a511f2b56cc9e42', tabindex: "0" })));
     }
     static get is() { return "ion-alert"; }
     static get encapsulation() { return "scoped"; }
     static get originalStyleUrls() {
         return {
             "ios": ["alert.ios.scss"],
-            "md": ["alert.md.scss"],
-            "ionic": ["alert.md.scss"]
+            "md": ["alert.md.scss"]
         };
     }
     static get styleUrls() {
         return {
             "ios": ["alert.ios.css"],
-            "md": ["alert.md.css"],
-            "ionic": ["alert.md.css"]
+            "md": ["alert.md.css"]
         };
     }
     static get properties() {
@@ -687,7 +684,7 @@ export class Alert {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "If `true`, the alert will be translucent.\nOnly applies when the theme is `\"ios\"` and the device supports\n[`backdrop-filter`](https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility)."
+                    "text": "If `true`, the alert will be translucent.\nOnly applies when the mode is `\"ios\"` and the device supports\n[`backdrop-filter`](https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility)."
                 },
                 "attribute": "translucent",
                 "reflect": false,

package/dist/collection/components/alert/alert.md.css

@@ -1,9 +1,3 @@
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use
@@ -294,12 +288,6 @@ textarea.alert-input {
   resize: none;
 }
 
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use
@@ -355,12 +343,6 @@ textarea.alert-input {
  *   }
  * }
  */
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use

package/dist/collection/components/app/app.js

@@ -6,11 +6,7 @@ import { shouldUseCloseWatcher } from "../../utils/hardware-back-button";
 import { printIonWarning } from "../../utils/logging/index";
 import { isPlatform } from "../../utils/platform";
 import { config } from "../../global/config";
-import { getIonTheme } from "../../global/ionic-global";
-/**
- * @virtualProp {"ios" | "md"} mode - The mode determines the platform behaviors of the component.
- * @virtualProp {"ios" | "md" | "ionic"} theme - The theme determines the visual appearance of the component.
- */
+import { getIonMode } from "../../global/ionic-global";
 export class App {
     componentDidLoad() {
         if (Build.isBrowser) {
@@ -68,9 +64,9 @@ export class App {
         }
     }
     render() {
-        const theme = getIonTheme(this);
-        return (h(Host, { key: '71b18fe6774029ab0fc53ebab579064f7a2fb908', class: {
-                [theme]: true,
+        const mode = getIonMode(this);
+        return (h(Host, { key: '02e6722398cfde7275ab9abdcce0f53a98f6b10f', class: {
+                [mode]: true,
                 'ion-page': true,
                 'force-statusbar-padding': config.getBoolean('_forceStatusbarPadding'),
             } }));

package/dist/collection/components/avatar/avatar.ios.css

@@ -1,9 +1,3 @@
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use
@@ -76,12 +70,6 @@
   overflow: hidden;
 }
 
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use

package/dist/collection/components/avatar/avatar.js

@@ -2,32 +2,23 @@
  * (C) Ionic http://ionicframework.com - MIT License
  */
 import { Host, h } from "@stencil/core";
-import { getIonTheme } from "../../global/ionic-global";
-/**
- * @virtualProp {"ios" | "md"} mode - The mode determines the platform behaviors of the component.
- * @virtualProp {"ios" | "md" | "ionic"} theme - The theme determines the visual appearance of the component.
- */
+import { getIonMode } from "../../global/ionic-global";
 export class Avatar {
     render() {
-        const theme = getIonTheme(this);
-        return (h(Host, { key: 'da2881ad023aa8ae16c3caf5e18070eddf4cb48c', class: {
-                [theme]: true,
-            } }, h("slot", { key: '5d1f0a5b8260169a2bafa4838f37cd3203bf8605' })));
+        return (h(Host, { key: 'b40a506a0beeaea226fd92e420655a3d840fafa6', class: getIonMode(this) }, h("slot", { key: '185c90b5d7f790ca8e39907c4da6fa7aa532a837' })));
     }
     static get is() { return "ion-avatar"; }
     static get encapsulation() { return "shadow"; }
     static get originalStyleUrls() {
         return {
             "ios": ["avatar.ios.scss"],
-            "md": ["avatar.md.scss"],
-            "ionic": ["avatar.md.scss"]
+            "md": ["avatar.md.scss"]
         };
     }
     static get styleUrls() {
         return {
             "ios": ["avatar.ios.css"],
-            "md": ["avatar.md.css"],
-            "ionic": ["avatar.md.css"]
+            "md": ["avatar.md.css"]
         };
     }
 }

package/dist/collection/components/avatar/avatar.md.css

@@ -1,9 +1,3 @@
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use
@@ -76,12 +70,6 @@
   overflow: hidden;
 }
 
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use

package/dist/collection/components/back-button/back-button.ios.css

@@ -1,9 +1,3 @@
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use
@@ -276,12 +270,6 @@ ion-icon {
   color: var(--ion-toolbar-color, var(--color));
 }
 
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use

package/dist/collection/components/back-button/back-button.js

@@ -6,10 +6,9 @@ import { inheritAriaAttributes } from "../../utils/helpers";
 import { createColorClasses, hostContext, openURL } from "../../utils/theme";
 import { arrowBackSharp, chevronBack } from "ionicons/icons";
 import { config } from "../../global/config";
-import { getIonTheme } from "../../global/ionic-global";
+import { getIonMode } from "../../global/ionic-global";
 /**
- * @virtualProp {"ios" | "md"} mode - The mode determines the platform behaviors of the component.
- * @virtualProp {"ios" | "md" | "ionic"} theme - The theme determines the visual appearance of the component.
+ * @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
  *
  * @part native - The native HTML button element that wraps all child elements.
  * @part icon - The back button icon (uses ion-icon).
@@ -46,7 +45,7 @@ export class BackButton {
             // icon is set on the component or by the config
             return icon;
         }
-        if (getIonTheme(this) === 'ios') {
+        if (getIonMode(this) === 'ios') {
             // default ios back button icon
             return config.get('backButtonIcon', chevronBack);
         }
@@ -54,7 +53,7 @@ export class BackButton {
         return config.get('backButtonIcon', arrowBackSharp);
     }
     get backButtonText() {
-        const defaultBackButtonText = getIonTheme(this) === 'ios' ? 'Back' : null;
+        const defaultBackButtonText = getIonMode(this) === 'ios' ? 'Back' : null;
         return this.text != null ? this.text : config.get('backButtonText', defaultBackButtonText);
     }
     get hasIconOnly() {
@@ -71,10 +70,10 @@ export class BackButton {
     render() {
         const { color, defaultHref, disabled, type, hasIconOnly, backButtonIcon, backButtonText, icon, inheritedAttributes, } = this;
         const showBackButton = defaultHref !== undefined;
-        const theme = getIonTheme(this);
+        const mode = getIonMode(this);
         const ariaLabel = inheritedAttributes['aria-label'] || backButtonText || 'back';
-        return (h(Host, { key: '01d115b1203a256e0cbd75bb982fd7ef310917ba', onClick: this.onClick, class: createColorClasses(color, {
-                [theme]: true,
+        return (h(Host, { key: 'e233c0ccdeefd85b4e7170ca28beb2d528706db5', onClick: this.onClick, class: createColorClasses(color, {
+                [mode]: true,
                 button: true, // ion-buttons target .button
                 'back-button-disabled': disabled,
                 'back-button-has-icon-only': hasIconOnly,
@@ -83,22 +82,20 @@ export class BackButton {
                 'ion-activatable': true,
                 'ion-focusable': true,
                 'show-back-button': showBackButton,
-            }) }, h("button", { key: 'e37e1c79da8337ad4f04cf6e4edd51ad7d4c0d69', type: type, disabled: disabled, class: "button-native", part: "native", "aria-label": ariaLabel }, h("span", { key: '7cfeae53736e5fbe4c5c31d259d0eb3ec0664643', class: "button-inner" }, backButtonIcon && (h("ion-icon", { part: "icon", icon: backButtonIcon, "aria-hidden": "true", lazy: false, "flip-rtl": icon === undefined })), backButtonText && (h("span", { part: "text", "aria-hidden": "true", class: "button-text" }, backButtonText))), theme === 'md' && h("ion-ripple-effect", { type: this.rippleType }))));
+            }) }, h("button", { key: 'a48e4ca9c1afefacc60766f910ea8349cdd3cce6', type: type, disabled: disabled, class: "button-native", part: "native", "aria-label": ariaLabel }, h("span", { key: '60bcc5fa226861b03b83a2b6fbad51284c295d4b', class: "button-inner" }, backButtonIcon && (h("ion-icon", { part: "icon", icon: backButtonIcon, "aria-hidden": "true", lazy: false, "flip-rtl": icon === undefined })), backButtonText && (h("span", { part: "text", "aria-hidden": "true", class: "button-text" }, backButtonText))), mode === 'md' && h("ion-ripple-effect", { type: this.rippleType }))));
     }
     static get is() { return "ion-back-button"; }
     static get encapsulation() { return "shadow"; }
     static get originalStyleUrls() {
         return {
             "ios": ["back-button.ios.scss"],
-            "md": ["back-button.md.scss"],
-            "ionic": ["back-button.md.scss"]
+            "md": ["back-button.md.scss"]
         };
     }
     static get styleUrls() {
         return {
             "ios": ["back-button.ios.css"],
-            "md": ["back-button.md.css"],
-            "ionic": ["back-button.md.css"]
+            "md": ["back-button.md.css"]
         };
     }
     static get properties() {

package/dist/collection/components/back-button/back-button.md.css

@@ -1,9 +1,3 @@
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use
@@ -276,12 +270,6 @@ ion-icon {
   color: var(--ion-toolbar-color, var(--color));
 }
 
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use

package/dist/collection/components/backdrop/backdrop.ios.css

@@ -1,9 +1,3 @@
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use
@@ -82,12 +76,6 @@
   cursor: auto;
 }
 
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use

package/dist/collection/components/backdrop/backdrop.js

@@ -2,11 +2,7 @@
  * (C) Ionic http://ionicframework.com - MIT License
  */
 import { Host, h } from "@stencil/core";
-import { getIonTheme } from "../../global/ionic-global";
-/**
- * @virtualProp {"ios" | "md"} mode - The mode determines the platform behaviors of the component.
- * @virtualProp {"ios" | "md" | "ionic"} theme - The theme determines the visual appearance of the component.
- */
+import { getIonMode } from "../../global/ionic-global";
 export class Backdrop {
     constructor() {
         this.visible = true;
@@ -26,9 +22,9 @@ export class Backdrop {
         }
     }
     render() {
-        const theme = getIonTheme(this);
-        return (h(Host, { key: 'a4300590abd1a003aedad6bb5c7a90d3ef09731a', tabindex: "-1", "aria-hidden": "true", class: {
-                [theme]: true,
+        const mode = getIonMode(this);
+        return (h(Host, { key: 'edc9b82940adbb5fa740107bd2d12d02955606fa', tabindex: "-1", "aria-hidden": "true", class: {
+                [mode]: true,
                 'backdrop-hide': !this.visible,
                 'backdrop-no-tappable': !this.tappable,
             } }));
@@ -38,15 +34,13 @@ export class Backdrop {
     static get originalStyleUrls() {
         return {
             "ios": ["backdrop.ios.scss"],
-            "md": ["backdrop.md.scss"],
-            "ionic": ["backdrop.md.scss"]
+            "md": ["backdrop.md.scss"]
         };
     }
     static get styleUrls() {
         return {
             "ios": ["backdrop.ios.css"],
-            "md": ["backdrop.md.css"],
-            "ionic": ["backdrop.md.css"]
+            "md": ["backdrop.md.css"]
         };
     }
     static get properties() {

package/dist/collection/components/backdrop/backdrop.md.css

@@ -1,9 +1,3 @@
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use
@@ -82,12 +76,6 @@
   cursor: auto;
 }
 
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use

package/dist/collection/components/badge/badge.ios.css

@@ -1,9 +1,3 @@
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use
@@ -106,12 +100,6 @@
   display: none;
 }
 
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use

package/dist/collection/components/badge/badge.js

@@ -3,35 +3,32 @@
  */
 import { Host, h } from "@stencil/core";
 import { createColorClasses } from "../../utils/theme";
-import { getIonTheme } from "../../global/ionic-global";
+import { getIonMode } from "../../global/ionic-global";
 /**
- * @virtualProp {"ios" | "md"} mode - The mode determines the platform behaviors of the component.
- * @virtualProp {"ios" | "md" | "ionic"} theme - The theme determines the visual appearance of the component.
+ * @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
  */
 export class Badge {
     constructor() {
         this.color = undefined;
     }
     render() {
-        const theme = getIonTheme(this);
-        return (h(Host, { key: '0834ff32b44532d37e4821e3a324ca7693ff1a99', class: createColorClasses(this.color, {
-                [theme]: true,
-            }) }, h("slot", { key: '8d8a1f093861fa92ebe44af0f24333c732128e92' })));
+        const mode = getIonMode(this);
+        return (h(Host, { key: 'cd1425d016a570b34dd42044fe79b42e6c984e86', class: createColorClasses(this.color, {
+                [mode]: true,
+            }) }, h("slot", { key: '29d2258c9e242f5fc1d85e2df5288edcfb038c8b' })));
     }
     static get is() { return "ion-badge"; }
     static get encapsulation() { return "shadow"; }
     static get originalStyleUrls() {
         return {
             "ios": ["badge.ios.scss"],
-            "md": ["badge.md.scss"],
-            "ionic": ["badge.md.scss"]
+            "md": ["badge.md.scss"]
         };
     }
     static get styleUrls() {
         return {
             "ios": ["badge.ios.css"],
-            "md": ["badge.md.css"],
-            "ionic": ["badge.md.css"]
+            "md": ["badge.md.css"]
         };
     }
     static get properties() {

package/dist/collection/components/badge/badge.md.css

@@ -1,9 +1,3 @@
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use
@@ -106,12 +100,6 @@
   display: none;
 }
 
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use

package/dist/collection/components/breadcrumb/breadcrumb.ios.css

@@ -1,9 +1,3 @@
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use
@@ -189,12 +183,6 @@
   font-size: 1.375rem;
 }
 
-/**
- * Convert a pixels given value into rem
- * 
- * @param pixels - Value in pixels to be converted (i.e. px)
- * @param context (optional) - Baseline value
- */
 /**
  * Convert a font size to a dynamic font size.
  * Fonts that participate in Dynamic Type should use