@ionic/core 8.5.4-dev.11743804857.1f3f3ee1 → 8.5.4-dev.11743808789.130d15f2

package/dist/collection/components/progress-bar/progress-bar.js

@@ -16,11 +16,26 @@ import { getIonMode } from "../../global/ionic-global";
  */
 export class ProgressBar {
     constructor() {
+        /**
+         * The state of the progress bar, based on if the time the process takes is known or not.
+         * Default options are: `"determinate"` (no animation), `"indeterminate"` (animate from left to right).
+         */
         this.type = 'determinate';
+        /**
+         * If true, reverse the progress bar direction.
+         */
         this.reversed = false;
+        /**
+         * The value determines how much of the active bar should display when the
+         * `type` is `"determinate"`.
+         * The value should be between [0, 1].
+         */
         this.value = 0;
+        /**
+         * If the buffer and value are smaller than 1, the buffer circles will show.
+         * The buffer should be between [0, 1].
+         */
         this.buffer = 1;
-        this.color = undefined;
     }
     render() {
         const { color, type, reversed, value, buffer } = this;
@@ -54,6 +69,7 @@ export class ProgressBar {
         return {
             "type": {
                 "type": "string",
+                "attribute": "type",
                 "mutable": false,
                 "complexType": {
                     "original": "'determinate' | 'indeterminate'",
@@ -66,12 +82,14 @@ export class ProgressBar {
                     "tags": [],
                     "text": "The state of the progress bar, based on if the time the process takes is known or not.\nDefault options are: `\"determinate\"` (no animation), `\"indeterminate\"` (animate from left to right)."
                 },
-                "attribute": "type",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "'determinate'"
             },
             "reversed": {
                 "type": "boolean",
+                "attribute": "reversed",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -84,12 +102,14 @@ export class ProgressBar {
                     "tags": [],
                     "text": "If true, reverse the progress bar direction."
                 },
-                "attribute": "reversed",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "false"
             },
             "value": {
                 "type": "number",
+                "attribute": "value",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -102,12 +122,14 @@ export class ProgressBar {
                     "tags": [],
                     "text": "The value determines how much of the active bar should display when the\n`type` is `\"determinate\"`.\nThe value should be between [0, 1]."
                 },
-                "attribute": "value",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "0"
             },
             "buffer": {
                 "type": "number",
+                "attribute": "buffer",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -120,12 +142,14 @@ export class ProgressBar {
                     "tags": [],
                     "text": "If the buffer and value are smaller than 1, the buffer circles will show.\nThe buffer should be between [0, 1]."
                 },
-                "attribute": "buffer",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "1"
             },
             "color": {
                 "type": "string",
+                "attribute": "color",
                 "mutable": false,
                 "complexType": {
                     "original": "Color",
@@ -144,7 +168,8 @@ export class ProgressBar {
                     "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)."
                 },
-                "attribute": "color",
+                "getter": false,
+                "setter": false,
                 "reflect": true
             }
         };

package/dist/collection/components/radio/radio.js

@@ -19,6 +19,31 @@ export class Radio {
     constructor() {
         this.inputId = `ion-rb-${radioButtonIds++}`;
         this.radioGroup = null;
+        /**
+         * If `true`, the radio is selected.
+         */
+        this.checked = false;
+        /**
+         * The tabindex of the radio button.
+         * @internal
+         */
+        this.buttonTabindex = -1;
+        /**
+         * The name of the control, which is submitted with the form data.
+         */
+        this.name = this.inputId;
+        /**
+         * If `true`, the user cannot interact with the radio.
+         */
+        this.disabled = false;
+        /**
+         * Where to place the label relative to the radio.
+         * `"start"`: The label will appear to the left of the radio in LTR and to the right in RTL.
+         * `"end"`: The label will appear to the right of the radio 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 radio regardless of the direction. The alignment of the label can be controlled with the `alignment` property.
+         */
+        this.labelPlacement = 'start';
         this.updateState = () => {
             if (this.radioGroup) {
                 const { compareWith, value: radioGroupValue } = this.radioGroup;
@@ -52,15 +77,6 @@ export class Radio {
         this.onBlur = () => {
             this.ionBlur.emit();
         };
-        this.checked = false;
-        this.buttonTabindex = -1;
-        this.color = undefined;
-        this.name = this.inputId;
-        this.disabled = false;
-        this.value = undefined;
-        this.labelPlacement = 'start';
-        this.justify = undefined;
-        this.alignment = undefined;
     }
     valueChanged() {
         /**
@@ -154,6 +170,7 @@ export class Radio {
         return {
             "color": {
                 "type": "string",
+                "attribute": "color",
                 "mutable": false,
                 "complexType": {
                     "original": "Color",
@@ -172,11 +189,13 @@ export class Radio {
                     "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)."
                 },
-                "attribute": "color",
+                "getter": false,
+                "setter": false,
                 "reflect": true
             },
             "name": {
                 "type": "string",
+                "attribute": "name",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -189,12 +208,14 @@ export class Radio {
                     "tags": [],
                     "text": "The name of the control, which is submitted with the form data."
                 },
-                "attribute": "name",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "this.inputId"
             },
             "disabled": {
                 "type": "boolean",
+                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -207,12 +228,14 @@ export class Radio {
                     "tags": [],
                     "text": "If `true`, the user cannot interact with the radio."
                 },
-                "attribute": "disabled",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "false"
             },
             "value": {
                 "type": "any",
+                "attribute": "value",
                 "mutable": false,
                 "complexType": {
                     "original": "any | null",
@@ -225,11 +248,13 @@ export class Radio {
                     "tags": [],
                     "text": "the value of the radio."
                 },
-                "attribute": "value",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "labelPlacement": {
                 "type": "string",
+                "attribute": "label-placement",
                 "mutable": false,
                 "complexType": {
                     "original": "'start' | 'end' | 'fixed' | 'stacked'",
@@ -242,12 +267,14 @@ export class Radio {
                     "tags": [],
                     "text": "Where to place the label relative to the radio.\n`\"start\"`: The label will appear to the left of the radio in LTR and to the right in RTL.\n`\"end\"`: The label will appear to the right of the radio 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 radio regardless of the direction. The alignment of the label can be controlled with the `alignment` property."
                 },
-                "attribute": "label-placement",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "'start'"
             },
             "justify": {
                 "type": "string",
+                "attribute": "justify",
                 "mutable": false,
                 "complexType": {
                     "original": "'start' | 'end' | 'space-between'",
@@ -260,11 +287,13 @@ export class Radio {
                     "tags": [],
                     "text": "How to pack the label and radio within a line.\n`\"start\"`: The label and radio will appear on the left in LTR and\non the right in RTL.\n`\"end\"`: The label and radio will appear on the right in LTR and\non the left in RTL.\n`\"space-between\"`: The label and radio will appear on opposite\nends of the line with space between the two elements.\nSetting this property will change the radio `display` to `block`."
                 },
-                "attribute": "justify",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "alignment": {
                 "type": "string",
+                "attribute": "alignment",
                 "mutable": false,
                 "complexType": {
                     "original": "'start' | 'center'",
@@ -277,7 +306,8 @@ export class Radio {
                     "tags": [],
                     "text": "How to control the alignment of the radio 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 radio `display` to `block`."
                 },
-                "attribute": "alignment",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             }
         };

package/dist/collection/components/radio-group/radio-group.js

@@ -10,6 +10,14 @@ export class RadioGroup {
         this.helperTextId = `${this.inputId}-helper-text`;
         this.errorTextId = `${this.inputId}-error-text`;
         this.labelId = `${this.inputId}-lbl`;
+        /**
+         * If `true`, the radios can be deselected.
+         */
+        this.allowEmptySelection = false;
+        /**
+         * The name of the control, which is submitted with the form data.
+         */
+        this.name = this.inputId;
         this.setRadioTabindex = (value) => {
             const radios = this.getRadios();
             // Get the first radio that is not disabled and the checked one
@@ -56,12 +64,6 @@ export class RadioGroup {
                 }
             }
         };
-        this.allowEmptySelection = false;
-        this.compareWith = undefined;
-        this.name = this.inputId;
-        this.value = undefined;
-        this.helperText = undefined;
-        this.errorText = undefined;
     }
     valueChanged(value) {
         this.setRadioTabindex(value);
@@ -204,6 +206,7 @@ export class RadioGroup {
         return {
             "allowEmptySelection": {
                 "type": "boolean",
+                "attribute": "allow-empty-selection",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -216,12 +219,14 @@ export class RadioGroup {
                     "tags": [],
                     "text": "If `true`, the radios can be deselected."
                 },
-                "attribute": "allow-empty-selection",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "false"
             },
             "compareWith": {
                 "type": "string",
+                "attribute": "compare-with",
                 "mutable": false,
                 "complexType": {
                     "original": "string | RadioGroupCompareFn | null",
@@ -240,11 +245,13 @@ export class RadioGroup {
                     "tags": [],
                     "text": "This property allows developers to specify a custom function or property\nname for comparing objects when determining the selected option in the\nion-radio-group. When not specified, the default behavior will use strict\nequality (===) for comparison."
                 },
-                "attribute": "compare-with",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "name": {
                 "type": "string",
+                "attribute": "name",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -257,12 +264,14 @@ export class RadioGroup {
                     "tags": [],
                     "text": "The name of the control, which is submitted with the form data."
                 },
-                "attribute": "name",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
                 "defaultValue": "this.inputId"
             },
             "value": {
                 "type": "any",
+                "attribute": "value",
                 "mutable": true,
                 "complexType": {
                     "original": "any | null",
@@ -275,11 +284,13 @@ export class RadioGroup {
                     "tags": [],
                     "text": "the value of the radio group."
                 },
-                "attribute": "value",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "helperText": {
                 "type": "string",
+                "attribute": "helper-text",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -292,11 +303,13 @@ export class RadioGroup {
                     "tags": [],
                     "text": "The helper text to display at the top of the radio group."
                 },
-                "attribute": "helper-text",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             },
             "errorText": {
                 "type": "string",
+                "attribute": "error-text",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -309,7 +322,8 @@ export class RadioGroup {
                     "tags": [],
                     "text": "The error text to display at the top of the radio group."
                 },
-                "attribute": "error-text",
+                "getter": false,
+                "setter": false,
                 "reflect": false
             }
         };