@ionic/core 8.8.18-dev.11786108988.1fd94742 → 8.8.18-dev.11786109471.1285bcfb

package/dist/collection/components/breadcrumbs/breadcrumbs.js

@@ -9,39 +9,97 @@ import { getIonMode } from "../../global/ionic-global";
  *
  */
 export class Breadcrumbs {
-    collapsed;
-    activeChanged;
-    el;
-    /**
-     * The color to use from your application's color palette.
-     * Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`.
-     * For more information on colors, see [theming](/docs/theming/basics).
-     */
-    color;
-    /**
-     * The maximum number of breadcrumbs to show before collapsing.
-     */
-    maxItems;
-    /**
-     * The number of breadcrumbs to show before the collapsed indicator.
-     * If `itemsBeforeCollapse` + `itemsAfterCollapse` is greater than `maxItems`,
-     * the breadcrumbs will not be collapsed.
-     */
-    itemsBeforeCollapse = 1;
-    /**
-     * The number of breadcrumbs to show after the collapsed indicator.
-     * If `itemsBeforeCollapse` + `itemsAfterCollapse` is greater than `maxItems`,
-     * the breadcrumbs will not be collapsed.
-     */
-    itemsAfterCollapse = 1;
-    /**
-     * Emitted when the collapsed indicator is clicked on.
-     */
-    ionCollapsedClick;
+    constructor() {
+        /**
+         * The number of breadcrumbs to show before the collapsed indicator.
+         * If `itemsBeforeCollapse` + `itemsAfterCollapse` is greater than `maxItems`,
+         * the breadcrumbs will not be collapsed.
+         */
+        this.itemsBeforeCollapse = 1;
+        /**
+         * The number of breadcrumbs to show after the collapsed indicator.
+         * If `itemsBeforeCollapse` + `itemsAfterCollapse` is greater than `maxItems`,
+         * the breadcrumbs will not be collapsed.
+         */
+        this.itemsAfterCollapse = 1;
+        this.breadcrumbsInit = () => {
+            this.setBreadcrumbSeparator();
+            this.setMaxItems();
+        };
+        this.resetActiveBreadcrumb = () => {
+            const breadcrumbs = this.getBreadcrumbs();
+            // Only reset the active breadcrumb if we were the ones to change it
+            // otherwise use the one set on the component
+            const activeBreadcrumb = breadcrumbs.find((breadcrumb) => breadcrumb.active);
+            if (activeBreadcrumb && this.activeChanged) {
+                activeBreadcrumb.active = false;
+            }
+        };
+        this.setMaxItems = () => {
+            const { itemsAfterCollapse, itemsBeforeCollapse, maxItems } = this;
+            const breadcrumbs = this.getBreadcrumbs();
+            for (const breadcrumb of breadcrumbs) {
+                breadcrumb.showCollapsedIndicator = false;
+                breadcrumb.collapsed = false;
+            }
+            // If the number of breadcrumbs exceeds the maximum number of items
+            // that should show and the items before / after collapse do not
+            // exceed the maximum items then we need to collapse the breadcrumbs
+            const shouldCollapse = maxItems !== undefined && breadcrumbs.length > maxItems && itemsBeforeCollapse + itemsAfterCollapse <= maxItems;
+            if (shouldCollapse) {
+                // Show the collapsed indicator in the first breadcrumb that collapses
+                breadcrumbs.forEach((breadcrumb, index) => {
+                    if (index === itemsBeforeCollapse) {
+                        breadcrumb.showCollapsedIndicator = true;
+                    }
+                    // Collapse all breadcrumbs that have an index greater than or equal to
+                    // the number before collapse and an index less than the total number
+                    // of breadcrumbs minus the items that should show after the collapse
+                    if (index >= itemsBeforeCollapse && index < breadcrumbs.length - itemsAfterCollapse) {
+                        breadcrumb.collapsed = true;
+                    }
+                });
+            }
+        };
+        this.setBreadcrumbSeparator = () => {
+            const { itemsAfterCollapse, itemsBeforeCollapse, maxItems } = this;
+            const breadcrumbs = this.getBreadcrumbs();
+            // Check if an active breadcrumb exists already
+            const active = breadcrumbs.find((breadcrumb) => breadcrumb.active);
+            // Set the separator on all but the last breadcrumb
+            for (const breadcrumb of breadcrumbs) {
+                // The only time the last breadcrumb changes is when
+                // itemsAfterCollapse is set to 0, in this case the
+                // last breadcrumb will be the collapsed indicator
+                const last = maxItems !== undefined && itemsAfterCollapse === 0
+                    ? breadcrumb === breadcrumbs[itemsBeforeCollapse]
+                    : breadcrumb === breadcrumbs[breadcrumbs.length - 1];
+                breadcrumb.last = last;
+                // If the breadcrumb has defined whether or not to show the
+                // separator then use that value, otherwise check if it's the
+                // last breadcrumb
+                const separator = breadcrumb.separator !== undefined ? breadcrumb.separator : last ? undefined : true;
+                breadcrumb.separator = separator;
+                // If there is not an active breadcrumb already
+                // set the last one to active
+                if (!active && last) {
+                    breadcrumb.active = true;
+                    this.activeChanged = true;
+                }
+            }
+        };
+        this.getBreadcrumbs = () => {
+            return Array.from(this.el.querySelectorAll('ion-breadcrumb'));
+        };
+        this.slotChanged = () => {
+            this.resetActiveBreadcrumb();
+            this.breadcrumbsInit();
+        };
+    }
     onCollapsedClick(ev) {
         const breadcrumbs = this.getBreadcrumbs();
         const collapsedBreadcrumbs = breadcrumbs.filter((breadcrumb) => breadcrumb.collapsed);
-        this.ionCollapsedClick.emit({ ...ev.detail, collapsedBreadcrumbs });
+        this.ionCollapsedClick.emit(Object.assign(Object.assign({}, ev.detail), { collapsedBreadcrumbs }));
     }
     maxItemsChanged() {
         this.resetActiveBreadcrumb();
@@ -50,79 +108,6 @@ export class Breadcrumbs {
     componentWillLoad() {
         this.breadcrumbsInit();
     }
-    breadcrumbsInit = () => {
-        this.setBreadcrumbSeparator();
-        this.setMaxItems();
-    };
-    resetActiveBreadcrumb = () => {
-        const breadcrumbs = this.getBreadcrumbs();
-        // Only reset the active breadcrumb if we were the ones to change it
-        // otherwise use the one set on the component
-        const activeBreadcrumb = breadcrumbs.find((breadcrumb) => breadcrumb.active);
-        if (activeBreadcrumb && this.activeChanged) {
-            activeBreadcrumb.active = false;
-        }
-    };
-    setMaxItems = () => {
-        const { itemsAfterCollapse, itemsBeforeCollapse, maxItems } = this;
-        const breadcrumbs = this.getBreadcrumbs();
-        for (const breadcrumb of breadcrumbs) {
-            breadcrumb.showCollapsedIndicator = false;
-            breadcrumb.collapsed = false;
-        }
-        // If the number of breadcrumbs exceeds the maximum number of items
-        // that should show and the items before / after collapse do not
-        // exceed the maximum items then we need to collapse the breadcrumbs
-        const shouldCollapse = maxItems !== undefined && breadcrumbs.length > maxItems && itemsBeforeCollapse + itemsAfterCollapse <= maxItems;
-        if (shouldCollapse) {
-            // Show the collapsed indicator in the first breadcrumb that collapses
-            breadcrumbs.forEach((breadcrumb, index) => {
-                if (index === itemsBeforeCollapse) {
-                    breadcrumb.showCollapsedIndicator = true;
-                }
-                // Collapse all breadcrumbs that have an index greater than or equal to
-                // the number before collapse and an index less than the total number
-                // of breadcrumbs minus the items that should show after the collapse
-                if (index >= itemsBeforeCollapse && index < breadcrumbs.length - itemsAfterCollapse) {
-                    breadcrumb.collapsed = true;
-                }
-            });
-        }
-    };
-    setBreadcrumbSeparator = () => {
-        const { itemsAfterCollapse, itemsBeforeCollapse, maxItems } = this;
-        const breadcrumbs = this.getBreadcrumbs();
-        // Check if an active breadcrumb exists already
-        const active = breadcrumbs.find((breadcrumb) => breadcrumb.active);
-        // Set the separator on all but the last breadcrumb
-        for (const breadcrumb of breadcrumbs) {
-            // The only time the last breadcrumb changes is when
-            // itemsAfterCollapse is set to 0, in this case the
-            // last breadcrumb will be the collapsed indicator
-            const last = maxItems !== undefined && itemsAfterCollapse === 0
-                ? breadcrumb === breadcrumbs[itemsBeforeCollapse]
-                : breadcrumb === breadcrumbs[breadcrumbs.length - 1];
-            breadcrumb.last = last;
-            // If the breadcrumb has defined whether or not to show the
-            // separator then use that value, otherwise check if it's the
-            // last breadcrumb
-            const separator = breadcrumb.separator !== undefined ? breadcrumb.separator : last ? undefined : true;
-            breadcrumb.separator = separator;
-            // If there is not an active breadcrumb already
-            // set the last one to active
-            if (!active && last) {
-                breadcrumb.active = true;
-                this.activeChanged = true;
-            }
-        }
-    };
-    getBreadcrumbs = () => {
-        return Array.from(this.el.querySelectorAll('ion-breadcrumb'));
-    };
-    slotChanged = () => {
-        this.resetActiveBreadcrumb();
-        this.breadcrumbsInit();
-    };
     render() {
         const { color, collapsed } = this;
         const mode = getIonMode(this);

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

@@ -17,113 +17,71 @@ import { getIonMode } from "../../global/ionic-global";
  * @part native - The native HTML button or anchor element that wraps all child elements.
  */
 export class Button {
-    inItem = false;
-    inListHeader = false;
-    inToolbar = false;
-    formButtonEl = null;
-    formEl = null;
-    inheritedAttributes = {};
-    el;
-    /**
-     * If `true`, the button only has an icon.
-     */
-    isCircle = false;
-    /**
-     * The color to use from your application's color palette.
-     * Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`.
-     * For more information on colors, see [theming](/docs/theming/basics).
-     */
-    color;
-    /**
-     * The type of button.
-     */
-    buttonType = 'button';
-    /**
-     * If `true`, the user cannot interact with the button.
-     */
-    disabled = false;
+    constructor() {
+        this.inItem = false;
+        this.inListHeader = false;
+        this.inToolbar = false;
+        this.formButtonEl = null;
+        this.formEl = null;
+        this.inheritedAttributes = {};
+        /**
+         * If `true`, the button only has an icon.
+         */
+        this.isCircle = false;
+        /**
+         * The type of button.
+         */
+        this.buttonType = 'button';
+        /**
+         * If `true`, the user cannot interact with the button.
+         */
+        this.disabled = false;
+        /**
+         * When using a router, it specifies the transition direction when navigating to
+         * another page using `href`.
+         */
+        this.routerDirection = 'forward';
+        /**
+         * If `true`, activates a button with a heavier font weight.
+         */
+        this.strong = false;
+        /**
+         * The type of the button.
+         */
+        this.type = 'button';
+        this.handleClick = (ev) => {
+            const { el } = this;
+            if (this.type === 'button') {
+                openURL(this.href, ev, this.routerDirection, this.routerAnimation);
+            }
+            else if (hasShadowDom(el)) {
+                this.submitForm(ev);
+            }
+        };
+        this.onFocus = () => {
+            this.ionFocus.emit();
+        };
+        this.onBlur = () => {
+            this.ionBlur.emit();
+        };
+        this.slotChanged = () => {
+            /**
+             * Ensures that the 'has-icon-only' class is properly added
+             * or removed from `ion-button` when manipulating the
+             * `icon-only` slot.
+             *
+             * Without this, the 'has-icon-only' class is only checked
+             * or added when `ion-button` component first renders.
+             */
+            this.isCircle = this.hasIconOnly;
+        };
+    }
     disabledChanged() {
         const { disabled } = this;
         if (this.formButtonEl) {
             this.formButtonEl.disabled = disabled;
         }
     }
-    /**
-     * Set to `"block"` for a full-width button or to `"full"` for a full-width button
-     * with square corners and no left or right borders.
-     */
-    expand;
-    /**
-     * Set to `"clear"` for a transparent button that resembles a flat button, to `"outline"`
-     * for a transparent button with a border, or to `"solid"` for a button with a filled background.
-     * The default fill is `"solid"` except inside of a toolbar, where the default is `"clear"`.
-     */
-    fill;
-    /**
-     * When using a router, it specifies the transition direction when navigating to
-     * another page using `href`.
-     */
-    routerDirection = 'forward';
-    /**
-     * When using a router, it specifies the transition animation when navigating to
-     * another page using `href`.
-     */
-    routerAnimation;
-    /**
-     * This attribute instructs browsers to download a URL instead of navigating to
-     * it, so the user will be prompted to save it as a local file. If the attribute
-     * has a value, it is used as the pre-filled file name in the Save prompt
-     * (the user can still change the file name if they want).
-     */
-    download;
-    /**
-     * Contains a URL or a URL fragment that the hyperlink points to.
-     * If this property is set, an anchor tag will be rendered.
-     */
-    href;
-    /**
-     * Specifies the relationship of the target object to the link object.
-     * The value is a space-separated list of [link types](https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types).
-     */
-    rel;
-    /**
-     * Set to `"round"` for a button with more rounded corners.
-     */
-    shape;
-    /**
-     * Set to `"small"` for a button with less height and padding, to `"default"`
-     * for a button with the default height and padding, or to `"large"` for a button
-     * with more height and padding. By default the size is unset, unless the button
-     * is inside of an item, where the size is `"small"` by default. Set the size to
-     * `"default"` inside of an item to make it a standard size button.
-     */
-    size;
-    /**
-     * If `true`, activates a button with a heavier font weight.
-     */
-    strong = false;
-    /**
-     * Specifies where to display the linked URL.
-     * Only applies when an `href` is provided.
-     * Special keywords: `"_blank"`, `"_self"`, `"_parent"`, `"_top"`.
-     */
-    target;
-    /**
-     * The type of the button.
-     */
-    type = 'button';
-    /**
-     * The HTML form element or form element id. Used to submit a form when the button is not a child of the form.
-     */
-    form;
-    /**
-     * Emitted when the button has focus.
-     */
-    ionFocus;
-    /**
-     * Emitted when the button loses focus.
-     */
-    ionBlur;
     /**
      * This component is used within the `ion-input-password-toggle` component
      * to toggle the visibility of the password input.
@@ -135,10 +93,7 @@ export class Button {
      * @param propName
      */
     onAriaChanged(newValue, _oldValue, propName) {
-        this.inheritedAttributes = {
-            ...this.inheritedAttributes,
-            [propName]: newValue,
-        };
+        this.inheritedAttributes = Object.assign(Object.assign({}, this.inheritedAttributes), { [propName]: newValue });
         forceUpdate(this);
     }
     /**
@@ -251,32 +206,6 @@ export class Button {
             this.formButtonEl.click();
         }
     }
-    handleClick = (ev) => {
-        const { el } = this;
-        if (this.type === 'button') {
-            openURL(this.href, ev, this.routerDirection, this.routerAnimation);
-        }
-        else if (hasShadowDom(el)) {
-            this.submitForm(ev);
-        }
-    };
-    onFocus = () => {
-        this.ionFocus.emit();
-    };
-    onBlur = () => {
-        this.ionBlur.emit();
-    };
-    slotChanged = () => {
-        /**
-         * Ensures that the 'has-icon-only' class is properly added
-         * or removed from `ion-button` when manipulating the
-         * `icon-only` slot.
-         *
-         * Without this, the 'has-icon-only' class is only checked
-         * or added when `ion-button` component first renders.
-         */
-        this.isCircle = this.hasIconOnly;
-    };
     render() {
         const mode = getIonMode(this);
         const { buttonType, type, disabled, rel, target, size, href, color, expand, hasIconOnly, shape, strong, inheritedAttributes, } = this;
@@ -319,7 +248,7 @@ export class Button {
                 'button-disabled': disabled,
                 'ion-activatable': true,
                 'ion-focusable': true,
-            }) }, h(TagType, { key: '53f4cb366bac796ab38f609e858bc1a55fce7641', ...attrs, class: "button-native", part: "native", disabled: disabled, onFocus: this.onFocus, onBlur: this.onBlur, ...inheritedAttributes }, h("span", { key: '40e127fc11c889e77b8bf02e8714f0dea83bfce7', class: "button-inner" }, h("slot", { key: 'e11c8c86d3f0894658a8999129425c9c111f5540', name: "icon-only", onSlotchange: this.slotChanged }), h("slot", { key: '105ea9259ea17036359e6fe7eced8b267ab8e0f6', name: "start" }), h("slot", { key: '0d7b0966e328a5b10b0562dacbd638dfd08d92af' }), h("slot", { key: 'c542b40685802464d69f57ecc0a7c3465d24a417', name: "end" })), mode === 'md' && h("ion-ripple-effect", { key: '46df4cbeb057b0a8daab92226121d8bbb8c0ee07', type: this.rippleType }))));
+            }) }, h(TagType, Object.assign({ key: '53f4cb366bac796ab38f609e858bc1a55fce7641' }, attrs, { class: "button-native", part: "native", disabled: disabled, onFocus: this.onFocus, onBlur: this.onBlur }, inheritedAttributes), h("span", { key: '40e127fc11c889e77b8bf02e8714f0dea83bfce7', class: "button-inner" }, h("slot", { key: 'e11c8c86d3f0894658a8999129425c9c111f5540', name: "icon-only", onSlotchange: this.slotChanged }), h("slot", { key: '105ea9259ea17036359e6fe7eced8b267ab8e0f6', name: "start" }), h("slot", { key: '0d7b0966e328a5b10b0562dacbd638dfd08d92af' }), h("slot", { key: 'c542b40685802464d69f57ecc0a7c3465d24a417', name: "end" })), mode === 'md' && h("ion-ripple-effect", { key: '46df4cbeb057b0a8daab92226121d8bbb8c0ee07', type: this.rippleType }))));
     }
     static get is() { return "ion-button"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/buttons/buttons.js

@@ -4,19 +4,21 @@
 import { Host, h } from "@stencil/core";
 import { getIonMode } from "../../global/ionic-global";
 export class Buttons {
-    /**
-     * If true, buttons will disappear when its
-     * parent toolbar has fully collapsed if the toolbar
-     * is not the first toolbar. If the toolbar is the
-     * first toolbar, the buttons will be hidden and will
-     * only be shown once all toolbars have fully collapsed.
-     *
-     * Only applies in `ios` mode with `collapse` set to
-     * `true` on `ion-header`.
-     *
-     * Typically used for [Collapsible Large Titles](https://ionicframework.com/docs/api/title#collapsible-large-titles)
-     */
-    collapse = false;
+    constructor() {
+        /**
+         * If true, buttons will disappear when its
+         * parent toolbar has fully collapsed if the toolbar
+         * is not the first toolbar. If the toolbar is the
+         * first toolbar, the buttons will be hidden and will
+         * only be shown once all toolbars have fully collapsed.
+         *
+         * Only applies in `ios` mode with `collapse` set to
+         * `true` on `ion-header`.
+         *
+         * Typically used for [Collapsible Large Titles](https://ionicframework.com/docs/api/title#collapsible-large-titles)
+         */
+        this.collapse = false;
+    }
     render() {
         const mode = getIonMode(this);
         return (h(Host, { key: '58c1fc5eb867d0731c63549b1ccb3ec3bbbe6e1b', class: {

package/dist/collection/components/card/card.js

@@ -11,59 +11,26 @@ import { getIonMode } from "../../global/ionic-global";
  * @part native - The native HTML button, anchor, or div element that wraps all child elements.
  */
 export class Card {
-    inheritedAriaAttributes = {};
-    el;
-    /**
-     * The color to use from your application's color palette.
-     * Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`.
-     * For more information on colors, see [theming](/docs/theming/basics).
-     */
-    color;
-    /**
-     * If `true`, a button tag will be rendered and the card will be tappable.
-     */
-    button = false;
-    /**
-     * The type of the button. Only used when an `onclick` or `button` property is present.
-     */
-    type = 'button';
-    /**
-     * If `true`, the user cannot interact with the card.
-     */
-    disabled = false;
-    /**
-     * This attribute instructs browsers to download a URL instead of navigating to
-     * it, so the user will be prompted to save it as a local file. If the attribute
-     * has a value, it is used as the pre-filled file name in the Save prompt
-     * (the user can still change the file name if they want).
-     */
-    download;
-    /**
-     * Contains a URL or a URL fragment that the hyperlink points to.
-     * If this property is set, an anchor tag will be rendered.
-     */
-    href;
-    /**
-     * Specifies the relationship of the target object to the link object.
-     * The value is a space-separated list of [link types](https://developer.mozilla.org/en-US/docs/Web/HTML/Link_types).
-     */
-    rel;
-    /**
-     * When using a router, it specifies the transition direction when navigating to
-     * another page using `href`.
-     */
-    routerDirection = 'forward';
-    /**
-     * When using a router, it specifies the transition animation when navigating to
-     * another page using `href`.
-     */
-    routerAnimation;
-    /**
-     * Specifies where to display the linked URL.
-     * Only applies when an `href` is provided.
-     * Special keywords: `"_blank"`, `"_self"`, `"_parent"`, `"_top"`.
-     */
-    target;
+    constructor() {
+        this.inheritedAriaAttributes = {};
+        /**
+         * If `true`, a button tag will be rendered and the card will be tappable.
+         */
+        this.button = false;
+        /**
+         * The type of the button. Only used when an `onclick` or `button` property is present.
+         */
+        this.type = 'button';
+        /**
+         * If `true`, the user cannot interact with the card.
+         */
+        this.disabled = false;
+        /**
+         * When using a router, it specifies the transition direction when navigating to
+         * another page using `href`.
+         */
+        this.routerDirection = 'forward';
+    }
     componentWillLoad() {
         this.inheritedAriaAttributes = inheritAttributes(this.el, ['aria-label']);
     }
@@ -85,7 +52,7 @@ export class Card {
                 rel: this.rel,
                 target: this.target,
             };
-        return (h(TagType, { ...attrs, ...inheritedAriaAttributes, class: "card-native", part: "native", disabled: this.disabled, onClick: (ev) => openURL(href, ev, routerDirection, routerAnimation) }, h("slot", null), clickable && mode === 'md' && h("ion-ripple-effect", null)));
+        return (h(TagType, Object.assign({}, attrs, inheritedAriaAttributes, { class: "card-native", part: "native", disabled: this.disabled, onClick: (ev) => openURL(href, ev, routerDirection, routerAnimation) }), h("slot", null), clickable && mode === 'md' && h("ion-ripple-effect", null)));
     }
     render() {
         const mode = getIonMode(this);

package/dist/collection/components/card-header/card-header.js

@@ -8,18 +8,14 @@ import { getIonMode } from "../../global/ionic-global";
  * @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
  */
 export class CardHeader {
-    /**
-     * The color to use from your application's color palette.
-     * Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`.
-     * For more information on colors, see [theming](/docs/theming/basics).
-     */
-    color;
-    /**
-     * If `true`, the card header will be translucent.
-     * Only applies when the mode is `"ios"` and the device supports
-     * [`backdrop-filter`](https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility).
-     */
-    translucent = false;
+    constructor() {
+        /**
+         * If `true`, the card header will be translucent.
+         * Only applies when the mode is `"ios"` and the device supports
+         * [`backdrop-filter`](https://developer.mozilla.org/en-US/docs/Web/CSS/backdrop-filter#Browser_compatibility).
+         */
+        this.translucent = false;
+    }
     render() {
         const mode = getIonMode(this);
         return (h(Host, { key: '64246b81931203a64d553c788cd736f41e23f37b', class: createColorClasses(this.color, {

package/dist/collection/components/card-subtitle/card-subtitle.js

@@ -8,12 +8,6 @@ import { getIonMode } from "../../global/ionic-global";
  * @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
  */
 export class CardSubtitle {
-    /**
-     * The color to use from your application's color palette.
-     * Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`.
-     * For more information on colors, see [theming](/docs/theming/basics).
-     */
-    color;
     render() {
         const mode = getIonMode(this);
         return (h(Host, { key: '84d820a19d9074f9c8bc61ccba1ca40062a60b73', role: "heading", "aria-level": "3", class: createColorClasses(this.color, {

package/dist/collection/components/card-title/card-title.js

@@ -8,12 +8,6 @@ import { getIonMode } from "../../global/ionic-global";
  * @virtualProp {"ios" | "md"} mode - The mode determines which platform styles to use.
  */
 export class CardTitle {
-    /**
-     * The color to use from your application's color palette.
-     * Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`.
-     * For more information on colors, see [theming](/docs/theming/basics).
-     */
-    color;
     render() {
         const mode = getIonMode(this);
         return (h(Host, { key: 'fca001a86396e83718d5211cd71912fdf40dea2f', role: "heading", "aria-level": "2", class: createColorClasses(this.color, {