@ionic/core 8.4.2-dev.11736797843.16cc5058 → 8.4.2-dev.11737633140.1934dd0f

package/dist/collection/components/checkbox/checkbox.js

@@ -18,38 +18,6 @@ export class Checkbox {
     constructor() {
         this.inputId = `ion-cb-${checkboxIds++}`;
         this.inheritedAttributes = {};
-        /**
-         * The name of the control, which is submitted with the form data.
-         */
-        this.name = this.inputId;
-        /**
-         * If `true`, the checkbox is selected.
-         */
-        this.checked = false;
-        /**
-         * If `true`, the checkbox will visually appear as indeterminate.
-         */
-        this.indeterminate = false;
-        /**
-         * If `true`, the user cannot interact with the checkbox.
-         */
-        this.disabled = false;
-        /**
-         * The value of the checkbox does not mean if it's checked or not, use the `checked`
-         * property for that.
-         *
-         * The value of a checkbox is analogous to the value of an `<input type="checkbox">`,
-         * it's only used when the checkbox participates in a native `<form>`.
-         */
-        this.value = 'on';
-        /**
-         * Where to place the label relative to the checkbox.
-         * `"start"`: The label will appear to the left of the checkbox in LTR and to the right in RTL.
-         * `"end"`: The label will appear to the right of the checkbox in LTR and to the left in RTL.
-         * `"fixed"`: The label has the same behavior as `"start"` except it also has a fixed width. Long text will be truncated with ellipses ("...").
-         * `"stacked"`: The label will appear above the checkbox regardless of the direction. The alignment of the label can be controlled with the `alignment` property.
-         */
-        this.labelPlacement = 'start';
         /**
          * Sets the checked property and emits
          * the ionChange event. Use this to update the
@@ -81,6 +49,16 @@ export class Checkbox {
             }
             this.toggleChecked(ev);
         };
+        this.color = undefined;
+        this.name = this.inputId;
+        this.checked = false;
+        this.indeterminate = false;
+        this.disabled = false;
+        this.value = 'on';
+        this.labelPlacement = 'start';
+        this.justify = undefined;
+        this.alignment = undefined;
+        this.required = false;
     }
     componentWillLoad() {
         this.inheritedAttributes = Object.assign({}, inheritAriaAttributes(this.el));
@@ -92,11 +70,11 @@ export class Checkbox {
         }
     }
     render() {
-        const { color, checked, disabled, el, getSVGPath, indeterminate, inheritedAttributes, inputId, justify, labelPlacement, name, value, alignment, } = this;
+        const { color, checked, disabled, el, getSVGPath, indeterminate, inheritedAttributes, inputId, justify, labelPlacement, name, value, alignment, required } = this;
         const mode = getIonMode(this);
         const path = getSVGPath(mode, indeterminate);
         renderHiddenInput(true, el, name, checked ? value : '', disabled);
-        return (h(Host, { key: '6dc787e1100521d08c4900104e1a3e2f594e919f', "aria-checked": indeterminate ? 'mixed' : `${checked}`, class: createColorClasses(color, {
+        return (h(Host, { key: '8a88a970c29b922700aced27148dc848ca1a37bb', "aria-checked": indeterminate ? 'mixed' : `${checked}`, class: createColorClasses(color, {
                 [mode]: true,
                 'in-item': hostContext('ion-item', el),
                 'checkbox-checked': checked,
@@ -106,10 +84,10 @@ export class Checkbox {
                 [`checkbox-justify-${justify}`]: justify !== undefined,
                 [`checkbox-alignment-${alignment}`]: alignment !== undefined,
                 [`checkbox-label-placement-${labelPlacement}`]: true,
-            }), onClick: this.onClick }, h("label", { key: '68222fb736a5ec3f2e488649b0e2ce0417dcb224', class: "checkbox-wrapper" }, h("input", Object.assign({ key: 'f12962d7e9b19c744cfdbdeccc67ae7f5d080281', type: "checkbox", checked: checked ? true : undefined, disabled: disabled, id: inputId, onChange: this.toggleChecked, onFocus: () => this.onFocus(), onBlur: () => this.onBlur(), ref: (focusEl) => (this.focusEl = focusEl) }, inheritedAttributes)), h("div", { key: 'c72df2699414b1e5a41a1bc267bc634f0c93dcff', class: {
+            }), onClick: this.onClick }, h("label", { key: '37526abeb29a6e7f9f12b9bfcd0fd6b87ab55b7e', class: "checkbox-wrapper" }, h("input", Object.assign({ key: 'd5be16aa3c14b8d07c549049d7e33d3236eb17e7', type: "checkbox", checked: checked ? true : undefined, disabled: disabled, id: inputId, onChange: this.toggleChecked, onFocus: () => this.onFocus(), onBlur: () => this.onBlur(), ref: (focusEl) => (this.focusEl = focusEl), required: required }, inheritedAttributes)), h("div", { key: 'ca9d044aae3d9efe01076d4d839518e4bdf9af2a', class: {
                 'label-text-wrapper': true,
                 'label-text-wrapper-hidden': el.textContent === '',
-            }, part: "label" }, h("slot", { key: 'a2a80285178a7e0e3b536fc9ca26b8b444aa4307' })), h("div", { key: 'c2b05e0d1fe8df5dcd72858220b5ff51ecaee4cc', class: "native-wrapper" }, h("svg", { key: 'ee24913fded72258ebd9713654a6dba92a18fcf7', class: "checkbox-icon", viewBox: "0 0 24 24", part: "container" }, path)))));
+            }, part: "label" }, h("slot", { key: '5729da13fc9181ce878ba26cade6a68f6277a5df' })), h("div", { key: '7970b8b152ceb5cd858570f6ff6c5b7cfb10d410', class: "native-wrapper" }, h("svg", { key: '494f584698bbf9042b53367881194c2f5dcfe617', class: "checkbox-icon", viewBox: "0 0 24 24", part: "container" }, path)))));
     }
     getSVGPath(mode, indeterminate) {
         let path = indeterminate ? (h("path", { d: "M6 12L18 12", part: "mark" })) : (h("path", { d: "M5.9,12.5l3.8,3.8l8.8-8.8", part: "mark" }));
@@ -154,8 +132,6 @@ export class Checkbox {
                     "tags": [],
                     "text": "The color to use from your application's color palette.\nDefault options are: `\"primary\"`, `\"secondary\"`, `\"tertiary\"`, `\"success\"`, `\"warning\"`, `\"danger\"`, `\"light\"`, `\"medium\"`, and `\"dark\"`.\nFor more information on colors, see [theming](/docs/theming/basics)."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "color",
                 "reflect": true
             },
@@ -173,8 +149,6 @@ export class Checkbox {
                     "tags": [],
                     "text": "The name of the control, which is submitted with the form data."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "name",
                 "reflect": false,
                 "defaultValue": "this.inputId"
@@ -193,8 +167,6 @@ export class Checkbox {
                     "tags": [],
                     "text": "If `true`, the checkbox is selected."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "checked",
                 "reflect": false,
                 "defaultValue": "false"
@@ -213,8 +185,6 @@ export class Checkbox {
                     "tags": [],
                     "text": "If `true`, the checkbox will visually appear as indeterminate."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "indeterminate",
                 "reflect": false,
                 "defaultValue": "false"
@@ -233,8 +203,6 @@ export class Checkbox {
                     "tags": [],
                     "text": "If `true`, the user cannot interact with the checkbox."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "disabled",
                 "reflect": false,
                 "defaultValue": "false"
@@ -253,8 +221,6 @@ export class Checkbox {
                     "tags": [],
                     "text": "The value of the checkbox does not mean if it's checked or not, use the `checked`\nproperty for that.\n\nThe value of a checkbox is analogous to the value of an `<input type=\"checkbox\">`,\nit's only used when the checkbox participates in a native `<form>`."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "value",
                 "reflect": false,
                 "defaultValue": "'on'"
@@ -273,8 +239,6 @@ export class Checkbox {
                     "tags": [],
                     "text": "Where to place the label relative to the checkbox.\n`\"start\"`: The label will appear to the left of the checkbox in LTR and to the right in RTL.\n`\"end\"`: The label will appear to the right of the checkbox in LTR and to the left in RTL.\n`\"fixed\"`: The label has the same behavior as `\"start\"` except it also has a fixed width. Long text will be truncated with ellipses (\"...\").\n`\"stacked\"`: The label will appear above the checkbox regardless of the direction. The alignment of the label can be controlled with the `alignment` property."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "label-placement",
                 "reflect": false,
                 "defaultValue": "'start'"
@@ -293,8 +257,6 @@ export class Checkbox {
                     "tags": [],
                     "text": "How to pack the label and checkbox within a line.\n`\"start\"`: The label and checkbox will appear on the left in LTR and\non the right in RTL.\n`\"end\"`: The label and checkbox will appear on the right in LTR and\non the left in RTL.\n`\"space-between\"`: The label and checkbox will appear on opposite\nends of the line with space between the two elements.\nSetting this property will change the checkbox `display` to `block`."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "justify",
                 "reflect": false
             },
@@ -312,10 +274,26 @@ export class Checkbox {
                     "tags": [],
                     "text": "How to control the alignment of the checkbox and label on the cross axis.\n`\"start\"`: The label and control will appear on the left of the cross axis in LTR, and on the right side in RTL.\n`\"center\"`: The label and control will appear at the center of the cross axis in both LTR and RTL.\nSetting this property will change the checkbox `display` to `block`."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "alignment",
                 "reflect": false
+            },
+            "required": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "If `true`, the user must fill in a value before submitting a form."
+                },
+                "attribute": "required",
+                "reflect": false,
+                "defaultValue": "false"
             }
         };
     }

package/dist/collection/components/chip/chip.js

@@ -9,13 +9,8 @@ import { getIonMode } from "../../global/ionic-global";
  */
 export class Chip {
     constructor() {
-        /**
-         * Display an outline style button.
-         */
+        this.color = undefined;
         this.outline = false;
-        /**
-         * If `true`, the user cannot interact with the chip.
-         */
         this.disabled = false;
     }
     render() {
@@ -63,8 +58,6 @@ export class Chip {
                     "tags": [],
                     "text": "The color to use from your application's color palette.\nDefault options are: `\"primary\"`, `\"secondary\"`, `\"tertiary\"`, `\"success\"`, `\"warning\"`, `\"danger\"`, `\"light\"`, `\"medium\"`, and `\"dark\"`.\nFor more information on colors, see [theming](/docs/theming/basics)."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "color",
                 "reflect": true
             },
@@ -82,8 +75,6 @@ export class Chip {
                     "tags": [],
                     "text": "Display an outline style button."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "outline",
                 "reflect": false,
                 "defaultValue": "false"
@@ -102,8 +93,6 @@ export class Chip {
                     "tags": [],
                     "text": "If `true`, the user cannot interact with the chip."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "disabled",
                 "reflect": false,
                 "defaultValue": "false"

package/dist/collection/components/col/col.js

@@ -9,6 +9,32 @@ const win = typeof window !== 'undefined' ? window : undefined;
 const SUPPORTS_VARS = win && !!(win.CSS && win.CSS.supports && win.CSS.supports('--a: 0'));
 const BREAKPOINTS = ['', 'xs', 'sm', 'md', 'lg', 'xl'];
 export class Col {
+    constructor() {
+        this.offset = undefined;
+        this.offsetXs = undefined;
+        this.offsetSm = undefined;
+        this.offsetMd = undefined;
+        this.offsetLg = undefined;
+        this.offsetXl = undefined;
+        this.pull = undefined;
+        this.pullXs = undefined;
+        this.pullSm = undefined;
+        this.pullMd = undefined;
+        this.pullLg = undefined;
+        this.pullXl = undefined;
+        this.push = undefined;
+        this.pushXs = undefined;
+        this.pushSm = undefined;
+        this.pushMd = undefined;
+        this.pushLg = undefined;
+        this.pushXl = undefined;
+        this.size = undefined;
+        this.sizeXs = undefined;
+        this.sizeSm = undefined;
+        this.sizeMd = undefined;
+        this.sizeLg = undefined;
+        this.sizeXl = undefined;
+    }
     onResize() {
         forceUpdate(this);
     }
@@ -117,8 +143,6 @@ export class Col {
                     "tags": [],
                     "text": "The amount to offset the column, in terms of how many columns it should shift to the end\nof the total available."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "offset",
                 "reflect": false
             },
@@ -136,8 +160,6 @@ export class Col {
                     "tags": [],
                     "text": "The amount to offset the column for xs screens, in terms of how many columns it should shift\nto the end of the total available."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "offset-xs",
                 "reflect": false
             },
@@ -155,8 +177,6 @@ export class Col {
                     "tags": [],
                     "text": "The amount to offset the column for sm screens, in terms of how many columns it should shift\nto the end of the total available."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "offset-sm",
                 "reflect": false
             },
@@ -174,8 +194,6 @@ export class Col {
                     "tags": [],
                     "text": "The amount to offset the column for md screens, in terms of how many columns it should shift\nto the end of the total available."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "offset-md",
                 "reflect": false
             },
@@ -193,8 +211,6 @@ export class Col {
                     "tags": [],
                     "text": "The amount to offset the column for lg screens, in terms of how many columns it should shift\nto the end of the total available."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "offset-lg",
                 "reflect": false
             },
@@ -212,8 +228,6 @@ export class Col {
                     "tags": [],
                     "text": "The amount to offset the column for xl screens, in terms of how many columns it should shift\nto the end of the total available."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "offset-xl",
                 "reflect": false
             },
@@ -231,8 +245,6 @@ export class Col {
                     "tags": [],
                     "text": "The amount to pull the column, in terms of how many columns it should shift to the start of\nthe total available."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "pull",
                 "reflect": false
             },
@@ -250,8 +262,6 @@ export class Col {
                     "tags": [],
                     "text": "The amount to pull the column for xs screens, in terms of how many columns it should shift\nto the start of the total available."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "pull-xs",
                 "reflect": false
             },
@@ -269,8 +279,6 @@ export class Col {
                     "tags": [],
                     "text": "The amount to pull the column for sm screens, in terms of how many columns it should shift\nto the start of the total available."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "pull-sm",
                 "reflect": false
             },
@@ -288,8 +296,6 @@ export class Col {
                     "tags": [],
                     "text": "The amount to pull the column for md screens, in terms of how many columns it should shift\nto the start of the total available."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "pull-md",
                 "reflect": false
             },
@@ -307,8 +313,6 @@ export class Col {
                     "tags": [],
                     "text": "The amount to pull the column for lg screens, in terms of how many columns it should shift\nto the start of the total available."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "pull-lg",
                 "reflect": false
             },
@@ -326,8 +330,6 @@ export class Col {
                     "tags": [],
                     "text": "The amount to pull the column for xl screens, in terms of how many columns it should shift\nto the start of the total available."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "pull-xl",
                 "reflect": false
             },
@@ -345,8 +347,6 @@ export class Col {
                     "tags": [],
                     "text": "The amount to push the column, in terms of how many columns it should shift to the end\nof the total available."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "push",
                 "reflect": false
             },
@@ -364,8 +364,6 @@ export class Col {
                     "tags": [],
                     "text": "The amount to push the column for xs screens, in terms of how many columns it should shift\nto the end of the total available."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "push-xs",
                 "reflect": false
             },
@@ -383,8 +381,6 @@ export class Col {
                     "tags": [],
                     "text": "The amount to push the column for sm screens, in terms of how many columns it should shift\nto the end of the total available."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "push-sm",
                 "reflect": false
             },
@@ -402,8 +398,6 @@ export class Col {
                     "tags": [],
                     "text": "The amount to push the column for md screens, in terms of how many columns it should shift\nto the end of the total available."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "push-md",
                 "reflect": false
             },
@@ -421,8 +415,6 @@ export class Col {
                     "tags": [],
                     "text": "The amount to push the column for lg screens, in terms of how many columns it should shift\nto the end of the total available."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "push-lg",
                 "reflect": false
             },
@@ -440,8 +432,6 @@ export class Col {
                     "tags": [],
                     "text": "The amount to push the column for xl screens, in terms of how many columns it should shift\nto the end of the total available."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "push-xl",
                 "reflect": false
             },
@@ -459,8 +449,6 @@ export class Col {
                     "tags": [],
                     "text": "The size of the column, in terms of how many columns it should take up out of the total\navailable. If `\"auto\"` is passed, the column will be the size of its content."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "size",
                 "reflect": false
             },
@@ -478,8 +466,6 @@ export class Col {
                     "tags": [],
                     "text": "The size of the column for xs screens, in terms of how many columns it should take up out\nof the total available. If `\"auto\"` is passed, the column will be the size of its content."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "size-xs",
                 "reflect": false
             },
@@ -497,8 +483,6 @@ export class Col {
                     "tags": [],
                     "text": "The size of the column for sm screens, in terms of how many columns it should take up out\nof the total available. If `\"auto\"` is passed, the column will be the size of its content."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "size-sm",
                 "reflect": false
             },
@@ -516,8 +500,6 @@ export class Col {
                     "tags": [],
                     "text": "The size of the column for md screens, in terms of how many columns it should take up out\nof the total available. If `\"auto\"` is passed, the column will be the size of its content."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "size-md",
                 "reflect": false
             },
@@ -535,8 +517,6 @@ export class Col {
                     "tags": [],
                     "text": "The size of the column for lg screens, in terms of how many columns it should take up out\nof the total available. If `\"auto\"` is passed, the column will be the size of its content."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "size-lg",
                 "reflect": false
             },
@@ -554,8 +534,6 @@ export class Col {
                     "tags": [],
                     "text": "The size of the column for xl screens, in terms of how many columns it should take up out\nof the total available. If `\"auto\"` is passed, the column will be the size of its content."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "size-xl",
                 "reflect": false
             }

package/dist/collection/components/content/content.js

@@ -47,32 +47,12 @@ export class Content {
             data: undefined,
             isScrolling: true,
         };
-        /**
-         * If `true`, the content will scroll behind the headers
-         * and footers. This effect can easily be seen by setting the toolbar
-         * to transparent.
-         */
+        this.color = undefined;
         this.fullscreen = false;
-        /**
-         * Controls where the fixed content is placed relative to the main content
-         * in the DOM. This can be used to control the order in which fixed elements
-         * receive keyboard focus.
-         * For example, if a FAB in the fixed slot should receive keyboard focus before
-         * the main page content, set this property to `'before'`.
-         */
         this.fixedSlotPlacement = 'after';
-        /**
-         * If you want to enable the content scrolling in the X axis, set this property to `true`.
-         */
+        this.forceOverscroll = undefined;
         this.scrollX = false;
-        /**
-         * If you want to disable the content scrolling in the Y axis, set this property to `false`.
-         */
         this.scrollY = true;
-        /**
-         * Because of performance reasons, ionScroll events are disabled by default, in order to enable them
-         * and start listening from (ionScroll), set this property to `true`.
-         */
         this.scrollEvents = false;
     }
     componentWillLoad() {
@@ -409,8 +389,6 @@ export class Content {
                     "tags": [],
                     "text": "The color to use from your application's color palette.\nDefault options are: `\"primary\"`, `\"secondary\"`, `\"tertiary\"`, `\"success\"`, `\"warning\"`, `\"danger\"`, `\"light\"`, `\"medium\"`, and `\"dark\"`.\nFor more information on colors, see [theming](/docs/theming/basics)."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "color",
                 "reflect": true
             },
@@ -428,8 +406,6 @@ export class Content {
                     "tags": [],
                     "text": "If `true`, the content will scroll behind the headers\nand footers. This effect can easily be seen by setting the toolbar\nto transparent."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "fullscreen",
                 "reflect": false,
                 "defaultValue": "false"
@@ -448,8 +424,6 @@ export class Content {
                     "tags": [],
                     "text": "Controls where the fixed content is placed relative to the main content\nin the DOM. This can be used to control the order in which fixed elements\nreceive keyboard focus.\nFor example, if a FAB in the fixed slot should receive keyboard focus before\nthe main page content, set this property to `'before'`."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "fixed-slot-placement",
                 "reflect": false,
                 "defaultValue": "'after'"
@@ -468,8 +442,6 @@ export class Content {
                     "tags": [],
                     "text": "If `true` and the content does not cause an overflow scroll, the scroll interaction will cause a bounce.\nIf the content exceeds the bounds of ionContent, nothing will change.\nNote, this does not disable the system bounce on iOS. That is an OS level setting."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "force-overscroll",
                 "reflect": false
             },
@@ -487,8 +459,6 @@ export class Content {
                     "tags": [],
                     "text": "If you want to enable the content scrolling in the X axis, set this property to `true`."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "scroll-x",
                 "reflect": false,
                 "defaultValue": "false"
@@ -507,8 +477,6 @@ export class Content {
                     "tags": [],
                     "text": "If you want to disable the content scrolling in the Y axis, set this property to `false`."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "scroll-y",
                 "reflect": false,
                 "defaultValue": "true"
@@ -527,8 +495,6 @@ export class Content {
                     "tags": [],
                     "text": "Because of performance reasons, ionScroll events are disabled by default, in order to enable them\nand start listening from (ionScroll), set this property to `true`."
                 },
-                "getter": false,
-                "setter": false,
                 "attribute": "scroll-events",
                 "reflect": false,
                 "defaultValue": "false"