diff --git a/src/components/alert/alert.ts b/src/components/alert/alert.ts index d35decee0c..f84172944c 100644 --- a/src/components/alert/alert.ts +++ b/src/components/alert/alert.ts @@ -228,8 +228,42 @@ export class Alert extends ViewController { * alert.present(); * } * ``` + * @advanced * * + * Alert options + * + * | Property | Type | Description | + * |-----------------------|-----------|---------------------------------------------------------------------------| + * | title | `string` | The string for the alert (optional) | + * | subTitle | `string` | The subtitle for the alert (optional) | + * | message | `string` | The message for the alert (optional) | + * | cssClass | `string` | Any additional class for the alert (optional) | + * | inputs | `array` | An array of inputs for the alert. See input options. (optional) | + * | buttons | `array` | An array of buttons for the alert. See buttons options. (optional) | + * | enableBackdropDismiss | `boolean` | Whether the alert should be dismissed by tapping the backdrop (optional) | + * + * + * Input options + * + * | Property | Type | Description | + * |-------------|-----------|-----------------------------------------------------------------| + * | type | `string` | The type the input should be, text, tel, number, etc (optional) | + * | name | `string` | The name for the input (optional) | + * | placeholder | `string` | The input's placeholder (optional, for textual/numeric inputs) | + * | value | `string` | The input's value (optional) | + * | label | `string` | The input's label (optional, only for radio/checkbox inputs) | + * | checked | `boolean` | Whether or not the input is checked or not (optional) | + * | id | `string` | The input's id (optional) | + * + * Button options + * + * | Property | Type | Description | + * |----------|----------|----------------------------------------------------------------| + * | text | `string` | The buttons displayed text | + * | handler | `any` | Expression that should be evaluated when the button is pressed | + * | cssClass | `string` | An additional CSS class for the button | + * | role | `string` | The buttons role, null or `cancel` | * ### Dismissing And Async Navigation * * After an alert has been dismissed, the app may need to also transition @@ -292,42 +326,8 @@ export class AlertController { constructor(private _app: App) {} /** - * - * Alert options - * - * | Property | Type | Description | - * |-----------------------|-----------|---------------------------------------------------------------------------| - * | title | `string` | The string for the alert (optional) | - * | subTitle | `string` | The subtitle for the alert (optional) | - * | message | `string` | The message for the alert (optional) | - * | cssClass | `string` | Any additional class for the alert (optional) | - * | inputs | `array` | An array of inputs for the alert. See input options. (optional) | - * | buttons | `array` | An array of buttons for the alert. See buttons options. (optional) | - * | enableBackdropDismiss | `boolean` | Whether the alert should be dismissed by tapping the backdrop (optional) | - * - * - * Input options - * - * | Property | Type | Description | - * |-------------|-----------|-----------------------------------------------------------------| - * | type | `string` | The type the input should be, text, tel, number, etc (optional) | - * | name | `string` | The name for the input (optional) | - * | placeholder | `string` | The input's placeholder (optional, for textual/numeric inputs) | - * | value | `string` | The input's value (optional) | - * | label | `string` | The input's label (optional, only for radio/checkbox inputs) | - * | checked | `boolean` | Whether or not the input is checked or not (optional) | - * | id | `string` | The input's id (optional) | - * - * Button options - * - * | Property | Type | Description | - * |----------|----------|----------------------------------------------------------------| - * | text | `string` | The buttons displayed text | - * | handler | `any` | Expression that should be evaluated when the button is pressed | - * | cssClass | `string` | An additional CSS class for the button | - * | role | `string` | The buttons role, null or `cancel` | - * - * @param {AlertOptions} opts Alert. See the table above + * Display an alert with a title, inputs, and buttons + * @param {AlertOptions} opts Alert. See the table below */ create(opts: AlertOptions = {}): Alert { return new Alert(this._app, opts); diff --git a/src/components/loading/loading.ts b/src/components/loading/loading.ts index 40fd029af5..daf1b581e8 100644 --- a/src/components/loading/loading.ts +++ b/src/components/loading/loading.ts @@ -150,6 +150,18 @@ export class Loading extends ViewController { * }, 5000); * } * ``` + * @advanced + * + * Loading options + * + * | Option | Type | Description | + * |-----------------------|------------|------------------------------------------------------------------------------------------------------------------| + * | spinner |`string` | The name of the SVG spinner for the loading indicator. | + * | content |`string` | The html content for the loading indicator. | + * | cssClass |`string` | An additional class for custom styles. | + * | showBackdrop |`boolean` | Whether to show the backdrop. Default true. | + * | dismissOnPageChange |`boolean` | Whether to dismiss the indicator when navigating to a new page. Default false. | + * | duration |`number` | How many milliseconds to wait before hiding the indicator. By default, it will show until `dismiss()` is called. | * * @demo /docs/v2/demos/loading/ * @see {@link /docs/v2/api/components/spinner/Spinner Spinner API Docs} @@ -159,18 +171,7 @@ export class LoadingController { constructor(private _app: App) {} /** - * Create a loading indicator with the following options - * - * | Option | Type | Description | - * |-----------------------|------------|------------------------------------------------------------------------------------------------------------------| - * | spinner |`string` | The name of the SVG spinner for the loading indicator. | - * | content |`string` | The html content for the loading indicator. | - * | cssClass |`string` | An additional class for custom styles. | - * | showBackdrop |`boolean` | Whether to show the backdrop. Default true. | - * | dismissOnPageChange |`boolean` | Whether to dismiss the indicator when navigating to a new page. Default false. | - * | duration |`number` | How many milliseconds to wait before hiding the indicator. By default, it will show until `dismiss()` is called. | - * - * + * Create a loading indicator. See below for options. * @param {LoadingOptions} opts Loading options */ create(opts: LoadingOptions = {}) { diff --git a/src/components/modal/modal.ts b/src/components/modal/modal.ts index 2a6acfdff4..9f0102eab3 100644 --- a/src/components/modal/modal.ts +++ b/src/components/modal/modal.ts @@ -122,6 +122,13 @@ export class Modal extends ViewController { * } * ``` * + * @advanced + * + * | Option | Type | Description | + * |-----------------------|------------|------------------------------------------------------------------------------------------------------------------| + * | showBackdrop |`boolean` | Whether to show the backdrop. Default true. | + * | enableBackdropDismiss |`boolean` | Whether the popover should be dismissed by tapping the backdrop. Default true. | + * * A modal can also emit data, which is useful when it is used to add or edit * data. For example, a profile page could slide up in a modal, and on submit, * the submit button could pass the updated profile data, then dismiss the @@ -175,13 +182,7 @@ export class ModalController { constructor(private _app: App) {} /** - * Create a modal with the following options - * - * | Option | Type | Description | - * |-----------------------|------------|------------------------------------------------------------------------------------------------------------------| - * | showBackdrop |`boolean` | Whether to show the backdrop. Default true. | - * | enableBackdropDismiss |`boolean` | Whether the popover should be dismissed by tapping the backdrop. Default true. | - * + * Create a modal to display. See below for options. * * @param {object} componentType The Modal view * @param {object} data Any data to pass to the Modal view