@ionic/core 8.7.6-dev.11759493293.13f81b9f → 8.7.6-dev.11759524961.1cff6814

package/dist/collection/components/label/label.js

@@ -3,10 +3,9 @@
  */
 import { Host, h } from "@stencil/core";
 import { createColorClasses, hostContext } 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 Label {
     constructor() {
@@ -53,35 +52,34 @@ export class Label {
     }
     render() {
         const position = this.position;
-        const theme = getIonTheme(this);
-        return (h(Host, { key: '583b4ed56decb1f5ce39ea6f58fbaa6d4fde01a5', class: createColorClasses(this.color, {
-                [theme]: true,
+        const mode = getIonMode(this);
+        return (h(Host, { key: 'd6fba1a97189acc8ddfd64a2f009954a3e46e188', class: createColorClasses(this.color, {
+                [mode]: true,
                 'in-item-color': hostContext('ion-item.ion-color', this.el),
                 [`label-${position}`]: position !== undefined,
                 [`label-no-animate`]: this.noAnimate,
                 'label-rtl': document.dir === 'rtl',
-            }) }, h("slot", { key: '89467c7725dc79d73d51442cb5a233e244cef1b3' })));
+            }) }, h("slot", { key: 'ce0ab50b5700398fdf50f36d02b7ad287eb71481' })));
     }
     static get is() { return "ion-label"; }
     static get encapsulation() { return "scoped"; }
     static get originalStyleUrls() {
         return {
             "ios": ["label.ios.scss"],
-            "md": ["label.md.scss"],
-            "ionic": ["label.md.scss"]
+            "md": ["label.md.scss"]
         };
     }
     static get styleUrls() {
         return {
             "ios": ["label.ios.css"],
-            "md": ["label.md.css"],
-            "ionic": ["label.md.css"]
+            "md": ["label.md.css"]
         };
     }
     static get properties() {
         return {
             "color": {
                 "type": "string",
+                "attribute": "color",
                 "mutable": false,
                 "complexType": {
                     "original": "Color",
@@ -102,11 +100,11 @@ export class Label {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": true,
-                "attribute": "color"
+                "reflect": true
             },
             "position": {
                 "type": "string",
+                "attribute": "position",
                 "mutable": false,
                 "complexType": {
                     "original": "'fixed' | 'stacked' | 'floating'",
@@ -121,8 +119,7 @@ export class Label {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
-                "attribute": "position"
+                "reflect": false
             }
         };
     }

package/dist/collection/components/label/label.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
@@ -129,12 +123,6 @@
   overflow: inherit;
 }
 
-/**
- * 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
@@ -190,12 +178,6 @@
  *   }
  * }
  */
-/**
- * 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/list/list.ios.css

@@ -1,45 +1,3 @@
-/**
- * A heuristic that applies CSS to tablet
- * viewports.
- *
- * Usage:
- * @include tablet-viewport() {
- *   :host {
- *     background-color: green;
- *   }
- * }
- */
-/**
- * A heuristic that applies CSS to mobile
- * viewports (i.e. phones, not tablets).
- *
- * Usage:
- * @include mobile-viewport() {
- *   :host {
- *     background-color: blue;
- *   }
- * }
- */
-ion-list {
-  margin-left: 0;
-  margin-right: 0;
-  margin-top: 0;
-  margin-bottom: 0;
-  padding-left: 0;
-  padding-right: 0;
-  padding-top: 0;
-  padding-bottom: 0;
-  display: block;
-  contain: content;
-  list-style-type: 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
@@ -95,17 +53,25 @@ ion-list {
  *   }
  * }
  */
+ion-list {
+  margin-left: 0;
+  margin-right: 0;
+  margin-top: 0;
+  margin-bottom: 0;
+  padding-left: 0;
+  padding-right: 0;
+  padding-top: 0;
+  padding-bottom: 0;
+  display: block;
+  contain: content;
+  list-style-type: none;
+}
+
 ion-list.list-inset {
   transform: translateZ(0);
   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
@@ -161,12 +127,6 @@ ion-list.list-inset {
  *   }
  * }
  */
-/**
- * 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/list/list.js

@@ -2,10 +2,9 @@
  * (C) Ionic http://ionicframework.com - MIT License
  */
 import { Host, h } from "@stencil/core";
-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 List {
     constructor() {
@@ -27,54 +26,36 @@ export class List {
         }
         return false;
     }
-    getShape() {
-        const theme = getIonTheme(this);
-        const { shape, inset } = this;
-        // TODO(ROU-10831): Remove theme check when shapes are defined for all themes.
-        if (theme !== 'ionic') {
-            return undefined;
-        }
-        if (shape === undefined && inset) {
-            return 'round';
-        }
-        if (shape === undefined) {
-            return 'rectangular';
-        }
-        return shape;
-    }
     render() {
-        const theme = getIonTheme(this);
-        const shape = this.getShape();
+        const mode = getIonMode(this);
         const { lines, inset } = this;
-        return (h(Host, { key: '7deda9d813391cac1c4156fb9e9fd1f1a43cdea8', role: "list", class: {
-                [theme]: true,
+        return (h(Host, { key: '7f9943751542d2cbd49a4ad3f28e16d9949f70d4', role: "list", class: {
+                [mode]: true,
                 // Used internally for styling
-                [`list-${theme}`]: true,
+                [`list-${mode}`]: true,
                 'list-inset': inset,
                 [`list-lines-${lines}`]: lines !== undefined,
-                [`list-${theme}-lines-${lines}`]: lines !== undefined,
-                [`list-${shape}`]: shape !== undefined,
+                [`list-${mode}-lines-${lines}`]: lines !== undefined,
             } }));
     }
     static get is() { return "ion-list"; }
     static get originalStyleUrls() {
         return {
             "ios": ["list.ios.scss"],
-            "md": ["list.md.scss"],
-            "ionic": ["list.ionic.scss"]
+            "md": ["list.md.scss"]
         };
     }
     static get styleUrls() {
         return {
             "ios": ["list.ios.css"],
-            "md": ["list.md.css"],
-            "ionic": ["list.ionic.css"]
+            "md": ["list.md.css"]
         };
     }
     static get properties() {
         return {
             "lines": {
                 "type": "string",
+                "attribute": "lines",
                 "mutable": false,
                 "complexType": {
                     "original": "'full' | 'inset' | 'none'",
@@ -89,11 +70,11 @@ export class List {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
-                "attribute": "lines"
+                "reflect": false
             },
             "inset": {
                 "type": "boolean",
+                "attribute": "inset",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -109,27 +90,7 @@ export class List {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
-                "attribute": "inset",
                 "defaultValue": "false"
-            },
-            "shape": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "'soft' | 'round' | 'rectangular'",
-                    "resolved": "\"rectangular\" | \"round\" | \"soft\" | undefined",
-                    "references": {}
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Set to `\"soft\"` for slightly rounded corners,\n`\"round\"` for fully rounded corners,\nor `\"rectangular\"` for no rounded corners.\n\nDefaults to `\"round\"` for the `ionic` theme\nwhen inset is `true`\ndefaults to `\"rectangular\"` for the `ionic`\ntheme when inset is `false`,\nundefined for all other themes."
-                },
-                "getter": false,
-                "setter": false,
-                "reflect": false,
-                "attribute": "shape"
             }
         };
     }

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

@@ -1,45 +1,3 @@
-/**
- * A heuristic that applies CSS to tablet
- * viewports.
- *
- * Usage:
- * @include tablet-viewport() {
- *   :host {
- *     background-color: green;
- *   }
- * }
- */
-/**
- * A heuristic that applies CSS to mobile
- * viewports (i.e. phones, not tablets).
- *
- * Usage:
- * @include mobile-viewport() {
- *   :host {
- *     background-color: blue;
- *   }
- * }
- */
-ion-list {
-  margin-left: 0;
-  margin-right: 0;
-  margin-top: 0;
-  margin-bottom: 0;
-  padding-left: 0;
-  padding-right: 0;
-  padding-top: 0;
-  padding-bottom: 0;
-  display: block;
-  contain: content;
-  list-style-type: 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
@@ -95,17 +53,25 @@ ion-list {
  *   }
  * }
  */
+ion-list {
+  margin-left: 0;
+  margin-right: 0;
+  margin-top: 0;
+  margin-bottom: 0;
+  padding-left: 0;
+  padding-right: 0;
+  padding-top: 0;
+  padding-bottom: 0;
+  display: block;
+  contain: content;
+  list-style-type: none;
+}
+
 ion-list.list-inset {
   transform: translateZ(0);
   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
@@ -161,12 +127,6 @@ ion-list.list-inset {
  *   }
  * }
  */
-/**
- * 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,8 +212,8 @@ ion-list.list-inset {
  * These selectors ensure the last item in the list
  * has the correct border.
  * We need to consider the following scenarios:
- * 1. The last item in a list as long as it is not the only item.
- * 2. The item in the last item-sliding in a list.
+ 1. The last item in a list as long as it is not the only item.
+ 2. The item in the last item-sliding in a list.
  * Note that we do not select "ion-item-sliding ion-item:last-of-type"
  * because that will cause the borders to disappear on
  * items in an item-sliding when the item is the last

package/dist/collection/components/list-header/list-header.ios.css

@@ -1,3 +1,36 @@
+/**
+ * Convert a font size to a dynamic font size.
+ * Fonts that participate in Dynamic Type should use
+ * dynamic font sizes.
+ * @param size - The initial font size including the unit (i.e. px or pt)
+ * @param unit (optional) - The unit to convert to. Use this if you want to
+ * convert to a unit other than $baselineUnit.
+ */
+/**
+ * Convert a font size to a dynamic font size but impose
+ * a maximum font size.
+ * @param size - The initial font size including the unit (i.e. px or pt)
+ * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).
+ * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to
+ * convert to a unit other than $baselineUnit.
+ */
+/**
+ * Convert a font size to a dynamic font size but impose
+ * a minimum font size.
+ * @param size - The initial font size including the unit (i.e. px or pt)
+ * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).
+ * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to
+ * convert to a unit other than $baselineUnit.
+ */
+/**
+ * Convert a font size to a dynamic font size but impose
+ * maximum and minimum font sizes.
+ * @param size - The initial font size including the unit (i.e. px or pt)
+ * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).
+ * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).
+ * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to
+ * convert to a unit other than $baselineUnit.
+ */
 /**
  * A heuristic that applies CSS to tablet
  * viewports.
@@ -57,6 +90,11 @@
   overflow: hidden;
 }
 
+:host(.ion-color) {
+  background: var(--ion-color-base);
+  color: var(--ion-color-contrast);
+}
+
 .list-header-inner {
   display: flex;
   position: relative;
@@ -86,82 +124,6 @@
   --inner-border-width: 0;
 }
 
-/**
- * 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
- * dynamic font sizes.
- * @param size - The initial font size including the unit (i.e. px or pt)
- * @param unit (optional) - The unit to convert to. Use this if you want to
- * convert to a unit other than $baselineUnit.
- */
-/**
- * Convert a font size to a dynamic font size but impose
- * a maximum font size.
- * @param size - The initial font size including the unit (i.e. px or pt)
- * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).
- * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to
- * convert to a unit other than $baselineUnit.
- */
-/**
- * Convert a font size to a dynamic font size but impose
- * a minimum font size.
- * @param size - The initial font size including the unit (i.e. px or pt)
- * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).
- * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to
- * convert to a unit other than $baselineUnit.
- */
-/**
- * Convert a font size to a dynamic font size but impose
- * maximum and minimum font sizes.
- * @param size - The initial font size including the unit (i.e. px or pt)
- * @param minScale - The minimum scale of the font (i.e. 0.8 for a minimum 80% scale).
- * @param maxScale - The maximum scale of the font (i.e. 2.5 for a maximum 250% scale).
- * @param unit (optional) - The unit to convert the initial font size to. Use this if you want to
- * convert to a unit other than $baselineUnit.
- */
-/**
- * A heuristic that applies CSS to tablet
- * viewports.
- *
- * Usage:
- * @include tablet-viewport() {
- *   :host {
- *     background-color: green;
- *   }
- * }
- */
-/**
- * A heuristic that applies CSS to mobile
- * viewports (i.e. phones, not tablets).
- *
- * Usage:
- * @include mobile-viewport() {
- *   :host {
- *     background-color: blue;
- *   }
- * }
- */
-:host {
-  min-height: 40px;
-}
-
-:host(.ion-color) {
-  background: var(--ion-color-base);
-  color: var(--ion-color-contrast);
-}
-
-/**
- * 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
@@ -217,12 +179,6 @@
  *   }
  * }
  */
-/**
- * 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/list-header/list-header.js

@@ -3,40 +3,38 @@
  */
 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 ListHeader {
     render() {
         const { lines } = this;
-        const theme = getIonTheme(this);
-        return (h(Host, { key: '984b0c19c652d264ce1a9832777948a9b5b84326', class: createColorClasses(this.color, {
-                [theme]: true,
+        const mode = getIonMode(this);
+        return (h(Host, { key: 'd9bc827ad8cc77231efddc2435831a7fc080f77d', class: createColorClasses(this.color, {
+                [mode]: true,
                 [`list-header-lines-${lines}`]: lines !== undefined,
-            }) }, h("div", { key: '1bf4519d8aa94fe4b98c6f54aba74dbcbb52fab0', class: "list-header-inner" }, h("slot", { key: '8d7fa8eca680fe3da8b8e4e01b3f885672c9c2bb' }))));
+            }) }, h("div", { key: '02dd9698304a7b2997ea1487e2f308bebea2b44c', class: "list-header-inner" }, h("slot", { key: '01d63a572c003286ae467a1ab23631e37e695042' }))));
     }
     static get is() { return "ion-list-header"; }
     static get encapsulation() { return "shadow"; }
     static get originalStyleUrls() {
         return {
             "ios": ["list-header.ios.scss"],
-            "md": ["list-header.md.scss"],
-            "ionic": ["list-header.ionic.scss"]
+            "md": ["list-header.md.scss"]
         };
     }
     static get styleUrls() {
         return {
             "ios": ["list-header.ios.css"],
-            "md": ["list-header.md.css"],
-            "ionic": ["list-header.ionic.css"]
+            "md": ["list-header.md.css"]
         };
     }
     static get properties() {
         return {
             "color": {
                 "type": "string",
+                "attribute": "color",
                 "mutable": false,
                 "complexType": {
                     "original": "Color",
@@ -57,11 +55,11 @@ export class ListHeader {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": true,
-                "attribute": "color"
+                "reflect": true
             },
             "lines": {
                 "type": "string",
+                "attribute": "lines",
                 "mutable": false,
                 "complexType": {
                     "original": "'full' | 'inset' | 'none'",
@@ -76,8 +74,7 @@ export class ListHeader {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
-                "attribute": "lines"
+                "reflect": false
             }
         };
     }