javascript/ionic-framework
1
0
Fork 0
mirror of https://github.com/ionic-team/ionic-framework.git synced 2025-08-20 12:29:55 +08:00
Code Issues Packages Projects Releases Wiki Activity

docs(API): update descriptions to be more clear

Browse Source 
also update descriptions for the same properties to be more consistent,
and reword all events to start and end the same.

closes #10248 closes driftyco/ionic-site#613 closes
driftyco/ionic-site#899
This commit is contained in:
Brandy Carney
2017-01-31 17:47:52 -05:00
parent ace727e627
commit cc21f93b87
39 changed files with 304 additions and 202 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/alert/alert.ts
View File

@ -239,7 +239,7 @@ export class Alert extends ViewController {
* | Property | Type | Description |
* |----------|----------|-----------------------------------------------------------------|
* | text | `string` | The buttons displayed text. |
* | handler | `any` | Expression that should be evaluated when the button is pressed. |
* | handler | `any` | Emitted when the button is pressed. |
* | cssClass | `string` | An additional CSS class for the button. |
* | role | `string` | The buttons role, null or `cancel`. |
*

8
src/components/badge/badge.ts
View File

@ -17,7 +17,9 @@ import { Ion } from '../ion';
export class Badge extends Ion {
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {
@ -25,7 +27,9 @@ export class Badge extends Ion {
}
/**
* @input {string} The mode to apply to this component. Mode can be `ios`, `wp`, or `md`.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {

29
src/components/button/button.ts
View File

@ -153,7 +153,7 @@ export class Button extends Ion {
_init: boolean;
/**
* @input {boolean} Large button.
* @input {boolean} If true, activates the large button size.
*/
@Input()
set large(val: boolean) {
@ -161,7 +161,7 @@ export class Button extends Ion {
}
/**
* @input {boolean} Small button.
* @input {boolean} If true, activates the small button size.
*/
@Input()
set small(val: boolean) {
@ -169,7 +169,7 @@ export class Button extends Ion {
}
/**
* @input {boolean} Default button.
* @input {boolean} If true, activates the default button size. Normally the default, useful for buttons in an item.
*/
@Input()
set default(val: boolean) {
@ -177,7 +177,7 @@ export class Button extends Ion {
}
/**
* @input {boolean} A transparent button with a border.
* @input {boolean} If true, activates a transparent button style with a border.
*/
@Input()
set outline(val: boolean) {
@ -185,7 +185,7 @@ export class Button extends Ion {
}
/**
* @input {boolean} A transparent button without a border.
* @input {boolean} If true, activates a transparent button style without a border.
*/
@Input()
set clear(val: boolean) {
@ -193,7 +193,7 @@ export class Button extends Ion {
}
/**
* @input {boolean} Force a solid button. Useful for buttons within an item.
* @input {boolean} If true, activates a solid button style. Normally the default, useful for buttons in a toolbar.
*/
@Input()
set solid(val: boolean) {
@ -201,7 +201,7 @@ export class Button extends Ion {
}
/**
* @input {boolean} A button with rounded corners.
* @input {boolean} If true, activates a button with rounded corners.
*/
@Input()
set round(val: boolean) {
@ -209,7 +209,7 @@ export class Button extends Ion {
}
/**
* @input {boolean} A button that fills its parent container with a border-radius.
* @input {boolean} If true, activates a button style that fills the available width.
*/
@Input()
set block(val: boolean) {
@ -217,7 +217,8 @@ export class Button extends Ion {
}
/**
* @input {boolean} A button that fills its parent container without a border-radius or borders on the left/right.
* @input {boolean} If true, activates a button style that fills the available width without
* a left and right border.
*/
@Input()
set full(val: boolean) {
@ -225,7 +226,7 @@ export class Button extends Ion {
}
/**
* @input {boolean} A button that has strong importance, ie. it represents an important action.
* @input {boolean} If true, activates a button with a heavier font weight.
*/
@Input()
set strong(val: boolean) {
@ -233,7 +234,9 @@ export class Button extends Ion {
}
/**
* @input {string} The mode to apply to this component. Mode can be `ios`, `wp`, or `md`.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {
@ -264,7 +267,9 @@ export class Button extends Ion {
}
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {

32
src/components/card/card.ts
View File

@ -13,7 +13,9 @@ import { Ion } from '../ion';
export class Card extends Ion {
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {
@ -21,7 +23,9 @@ export class Card extends Ion {
}
/**
* @input {string} The mode to apply to this component. Mode can be `ios`, `wp`, or `md`.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {
@ -44,7 +48,9 @@ export class Card extends Ion {
export class CardContent extends Ion {
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {
@ -52,7 +58,9 @@ export class CardContent extends Ion {
}
/**
* @input {string} The mode to apply to this component.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {
@ -75,7 +83,9 @@ export class CardContent extends Ion {
export class CardHeader extends Ion {
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {
@ -83,7 +93,9 @@ export class CardHeader extends Ion {
}
/**
* @input {string} The mode to apply to this component.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {
@ -105,7 +117,9 @@ export class CardHeader extends Ion {
export class CardTitle extends Ion {
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {
@ -113,7 +127,9 @@ export class CardTitle extends Ion {
}
/**
* @input {string} The mode to apply to this component.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {

14
src/components/checkbox/checkbox.ts
View File

@ -87,7 +87,9 @@ export class Checkbox extends Ion implements IonicTapInput, AfterContentInit, Co
id: string;
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {
@ -95,7 +97,9 @@ export class Checkbox extends Ion implements IonicTapInput, AfterContentInit, Co
}
/**
* @input {string} The mode to apply to this component. Mode can be `ios`, `wp`, or `md`.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {
@ -103,7 +107,7 @@ export class Checkbox extends Ion implements IonicTapInput, AfterContentInit, Co
}
/**
* @output {Checkbox} expression to evaluate when the checkbox value changes
* @output {Checkbox} Emitted when the checkbox value changes.
*/
@Output() ionChange: EventEmitter<Checkbox> = new EventEmitter<Checkbox>();
@ -138,7 +142,7 @@ export class Checkbox extends Ion implements IonicTapInput, AfterContentInit, Co
}
/**
* @input {boolean} whether or not the checkbox is checked (defaults to false)
* @input {boolean} If `true`, the element is selected.
*/
@Input()
get checked(): boolean {
@ -189,7 +193,7 @@ export class Checkbox extends Ion implements IonicTapInput, AfterContentInit, Co
registerOnTouched(fn: any) { this.onTouched = fn; }
/**
* @input {boolean} whether or not the checkbox is disabled or not.
* @input {boolean} If true, the user cannot interact with this element.
*/
@Input()
get disabled(): boolean {

8
src/components/chip/chip.ts
View File

@ -96,7 +96,9 @@ import { Ion } from '../ion';
export class Chip extends Ion {
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {
@ -104,7 +106,9 @@ export class Chip extends Ion {
}
/**
* @input {string} The mode to apply to this component. Mode can be `ios`, `wp`, or `md`.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {

14
src/components/content/content.ts
View File

@ -463,23 +463,15 @@ export class Content extends Ion implements OnDestroy, OnInit {
}
/**
* @input {boolean} By default, content is positioned between the headers
* and footers. However, using `fullscreen="true"`, the content will be
* able to scroll "under" the headers and footers. At first glance the
* fullscreen option may not look any different than the default, however,
* by adding a transparency effect to a header then the content can be
* seen under the header as the user scrolls.
*
* @returns {boolean}
* @input {boolean} If true, the content will scroll behind the headers
* and footers. This effect can easily be seen by setting the toolbar
* to transparent.
*/
@Input()
get fullscreen(): boolean {
return !!this._fullscreen;
}
/**
* @param {boolean} val
*/
set fullscreen(val: boolean) {
this._fullscreen = isTrueProperty(val);
}

14
src/components/datetime/datetime.ts
View File

@ -408,7 +408,9 @@ export class DateTime extends Ion implements AfterContentInit, ControlValueAcces
@Input() pickerOptions: any = {};
/**
* @input {string} The mode to apply to this component. Mode can be `ios`, `wp`, or `md`.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {
@ -416,12 +418,12 @@ export class DateTime extends Ion implements AfterContentInit, ControlValueAcces
}
/**
* @output {any} Any expression to evaluate when the datetime selection has changed.
* @output {any} Emitted when the datetime selection has changed.
*/
@Output() ionChange: EventEmitter<any> = new EventEmitter();
/**
* @output {any} Any expression to evaluate when the datetime selection was cancelled.
* @output {any} Emitted when the datetime selection was cancelled.
*/
@Output() ionCancel: EventEmitter<any> = new EventEmitter();
@ -784,14 +786,14 @@ export class DateTime extends Ion implements AfterContentInit, ControlValueAcces
}
/**
* @input {boolean} Whether or not the datetime component is disabled. Default `false`.
* @input {boolean} If true, the user cannot interact with this element.
*/
@Input()
get disabled() {
get disabled(): boolean {
return this._disabled;
}
set disabled(val) {
set disabled(val: boolean) {
this._disabled = isTrueProperty(val);
this._item && this._item.setElementClass('item-datetime-disabled', this._disabled);
}

8
src/components/fab/fab.ts
View File

@ -66,7 +66,9 @@ import { UIEventManager } from '../../gestures/ui-event-manager';
export class FabButton extends Ion {
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {
@ -74,7 +76,9 @@ export class FabButton extends Ion {
}
/**
* @input {string} The mode to apply to this component. Mode can be `ios`, `wp`, or `md`.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {

19
src/components/icon/icon.ts
View File

@ -57,7 +57,9 @@ export class Icon extends Ion {
_css: string = '';
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
get color(): string {
@ -68,7 +70,9 @@ export class Icon extends Ion {
}
/**
* @input {string} The mode to apply to this component. Mode can be `ios`, `wp`, or `md`.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {
@ -94,7 +98,8 @@ export class Icon extends Ion {
}
/**
* @input {string} Icon to use. Will load the appropriate icon for each mode
* @input {string} Specifies which icon to use. The appropriate icon will be used based on the mode.
* For more information, see [Ionicons](/docs/v2/ionicons/).
*/
@Input()
get name(): string {
@ -113,7 +118,7 @@ export class Icon extends Ion {
}
/**
* @input {string} Explicitly set the icon to use on iOS
* @input {string} Specifies which icon to use on `ios` mode.
*/
@Input()
get ios(): string {
@ -126,7 +131,7 @@ export class Icon extends Ion {
}
/**
* @input {string} Explicitly set the icon to use on MD
* @input {string} Specifies which icon to use on `md` mode.
*/
@Input()
get md(): string {
@ -140,7 +145,9 @@ export class Icon extends Ion {
/**
* @input {bool} Whether or not the icon has an "active" appearance. On iOS an active icon is filled in or full appearance, and an inactive icon on iOS will use an outlined version of the icon same icon. Material Design icons do not change appearance depending if they're active or not. The `isActive` property is largely used by the tabbar.
* @input {boolean} If true, the icon is styled with an "active" appearance.
* An active icon is filled in, and an inactive icon is the outline of the icon.
* The `isActive` property is largely used by the tabbar. Only affects `ios` icons.
*/
@Input()
get isActive(): boolean {

2
src/components/img/img.ts
View File

@ -146,7 +146,7 @@ export class Img implements OnDestroy {
}
/**
* @input {string} Image src.
* @input {string} The source of the image.
*/
@Input()
get src(): string {

4
src/components/infinite-scroll/infinite-scroll.ts
View File

@ -137,7 +137,7 @@ export class InfiniteScroll {
}
/**
* @input {boolean} Whether or not the infinite scroll should be
* @input {boolean} If true, Whether or not the infinite scroll should be
* enabled or not. Setting to `false` will remove scroll event listeners
* and hide the display.
*/
@ -147,7 +147,7 @@ export class InfiniteScroll {
}
/**
* @output {event} The expression to call when the scroll reaches
* @output {event} Emitted when the scroll reaches
* the threshold distance. From within your infinite handler,
* you must call the infinite scroll's `complete()` method when
* your async operation has completed.

24
src/components/input/input.ts
View File

@ -163,12 +163,12 @@ export class TextInput extends Ion implements IonicFormInput {
}
/**
* @input {string} The placeholder for the input
* @input {string} Instructional text that shows before the input has a value.
*/
@Input() placeholder: string = '';
/**
* @input {boolean} A clear icon will appear in the input when there is a value. Clicking it clears the input.
* @input {boolean} If true, a clear icon will appear in the input when there is a value. Clicking it clears the input.
*/
@Input()
get clearInput() {
@ -179,7 +179,7 @@ export class TextInput extends Ion implements IonicFormInput {
}
/**
* @input {string} The text value of the input
* @input {string} The text value of the input.
*/
@Input()
get value() {
@ -191,7 +191,7 @@ export class TextInput extends Ion implements IonicFormInput {
}
/**
* @input {string} The HTML input type (text, password, email, number, search, tel, or url)
* @input {string} The type of control to display. The default type is text. Possible values are: `"text"`, `"password"`, `"email"`, `"number"`, `"search"`, `"tel"`, or `"url"`.
*/
@Input()
get type() {
@ -212,10 +212,10 @@ export class TextInput extends Ion implements IonicFormInput {
}
/**
* @input {boolean} If the input should be disabled or not
* @input {boolean} If true, the user cannot interact with this element.
*/
@Input()
get disabled() {
get disabled(): boolean {
return this._disabled;
}
set disabled(val: boolean) {
@ -239,7 +239,7 @@ export class TextInput extends Ion implements IonicFormInput {
}
/**
* @input {boolean} If the input should be readonly or not
* @input {boolean} If true, the user cannot modify the value.
*/
@Input()
get readonly() {
@ -250,7 +250,9 @@ export class TextInput extends Ion implements IonicFormInput {
}
/**
* @input {string} The mode to apply to this component.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {
@ -258,7 +260,7 @@ export class TextInput extends Ion implements IonicFormInput {
}
/**
* @input {boolean} whether to clear the input upon editing or not
* @input {boolean} If true, the value will be cleared after focus upon edit. Defaults to `true` when `type` is `"password"`, `false` for all other types.
*/
@Input()
get clearOnEdit() {
@ -355,12 +357,12 @@ export class TextInput extends Ion implements IonicFormInput {
}
/**
* @output {event} Expression to call when the input no longer has focus
* @output {event} Emitted when the input no longer has focus.
*/
@Output() blur: EventEmitter<Event> = new EventEmitter<Event>();
/**
* @output {event} Expression to call when the input has focus
* @output {event} Emitted when the input has focus.
*/
@Output() focus: EventEmitter<Event> = new EventEmitter<Event>();

2
src/components/item/item-reorder.ts
View File

@ -154,7 +154,7 @@ export class ItemReorder implements ItemReorderGestureDelegate {
_element: HTMLElement;
/**
* @output {object} The expression to evaluate when the item is reordered. Emits an object
* @output {object} Emitted when the item is reordered. Emits an object
* with `from` and `to` properties.
*/
@Output() ionItemReorder: EventEmitter<ReorderIndexes> = new EventEmitter<ReorderIndexes>();

6
src/components/item/item-sliding.ts
View File

@ -42,13 +42,13 @@ export const enum ItemSideFlags {
})
export class ItemOptions {
/**
* @input {string} the side the option button should be on. Defaults to right.
* @input {string} The side the option button should be on. Defaults to `"right"`.
* If you have multiple `ion-item-options`, a side must be provided for each.
*/
@Input() side: string;
/**
* @output {event} Expression to evaluate when the item has been fully swiped.
* @output {event} Emitted when the item has been fully swiped.
*/
@Output() ionSwipe: EventEmitter<ItemSliding> = new EventEmitter<ItemSliding>();
@ -196,7 +196,7 @@ export class ItemSliding {
@ContentChild(Item) item: Item;
/**
* @output {event} Expression to evaluate when the sliding position changes.
* @output {event} Emitted when the sliding position changes.
* It reports the relative position.
*
* ```ts

16
src/components/item/item.ts
View File

@ -312,7 +312,9 @@ export class Item extends Ion {
labelId: string = null;
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {
@ -320,7 +322,9 @@ export class Item extends Ion {
}
/**
* @input {string} The mode to apply to this component. Mode can be `ios`, `wp`, or `md`.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {
@ -460,7 +464,9 @@ export class Item extends Ion {
export class ItemDivider extends Ion {
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {
@ -468,7 +474,9 @@ export class ItemDivider extends Ion {
}
/**
* @input {string} The mode to apply to this component.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {

8
src/components/label/label.ts
View File

@ -61,7 +61,9 @@ export class Label extends Ion {
private _id: string;
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {
@ -69,7 +71,9 @@ export class Label extends Ion {
}
/**
* @input {string} The mode to apply to this component. Mode can be `ios`, `wp`, or `md`.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {

8
src/components/list/list-header.ts
View File

@ -12,7 +12,9 @@ import { Ion } from '../ion';
export class ListHeader extends Ion {
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {
@ -20,7 +22,9 @@ export class ListHeader extends Ion {
}
/**
* @input {string} The mode to apply to this component.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {

6
src/components/list/list.ts
View File

@ -63,7 +63,9 @@ export class List extends Ion {
}
/**
* @input {string} The mode to apply to this component. Mode can be `ios`, `wp`, or `md`.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {
@ -71,7 +73,7 @@ export class List extends Ion {
}
/**
* @input {boolean} shouldEnable whether the item-sliding should be enabled or not
* @input {boolean} If true, the sliding items will be enabled.
*/
@Input()
get sliding(): boolean {

12
src/components/menu/menu.ts
View File

@ -240,7 +240,7 @@ export class Menu {
@Input() type: string;
/**
* @input {boolean} Whether or not the menu should be enabled. Default `true`.
* @input {boolean} If true, the menu is enabled. Default `true`.
*/
@Input()
get enabled(): boolean {
@ -253,7 +253,7 @@ export class Menu {
}
/**
* @input {boolean} Whether or not swiping the menu should be enabled. Default `true`.
* @input {boolean} If true, swiping the menu is enabled. Default `true`.
*/
@Input()
get swipeEnabled(): boolean {
@ -266,7 +266,7 @@ export class Menu {
}
/**
* @input {string} Whether or not the menu should persist on child pages. Default `false`.
* @input {boolean} If true, the menu will persist on child pages.
*/
@Input()
get persistent(): boolean {
@ -283,17 +283,17 @@ export class Menu {
@Input() maxEdgeStart: number;
/**
* @output {event} When the menu is being dragged open.
* @output {event} Emitted when the menu is being dragged open.
*/
@Output() ionDrag: EventEmitter<number> = new EventEmitter<number>();
/**
* @output {event} When the menu has been opened.
* @output {event} Emitted when the menu has been opened.
*/
@Output() ionOpen: EventEmitter<boolean> = new EventEmitter<boolean>();
/**
* @output {event} When the menu has been closed.
* @output {event} Emitted when the menu has been closed.
*/
@Output() ionClose: EventEmitter<boolean> = new EventEmitter<boolean>();

2
src/components/nav/nav.ts
View File

@ -146,7 +146,7 @@ export class Nav extends NavControllerBase implements AfterViewInit {
@Input() rootParams: any;
/**
* @input {boolean} Whether it's possible to swipe-to-go-back on this nav controller or not.
* @input {boolean} If true, swipe to go back is enabled.
*/
@Input()
get swipeBackEnabled(): boolean {

10
src/components/navbar/navbar.ts
View File

@ -87,7 +87,9 @@ export class Navbar extends ToolbarBase {
_sbPadding: boolean;
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {
@ -95,7 +97,9 @@ export class Navbar extends ToolbarBase {
}
/**
* @input {string} The mode to apply to this component.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {
@ -103,7 +107,7 @@ export class Navbar extends ToolbarBase {
}
/**
* @input {boolean} whether the back button should be shown or not
* @input {boolean} If true, the back button will be hidden.
*/
@Input()
get hideBackButton(): boolean {

8
src/components/note/note.ts
View File

@ -33,7 +33,9 @@ import { Ion } from '../ion';
export class Note extends Ion {
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {
@ -41,7 +43,9 @@ export class Note extends Ion {
}
/**
* @input {string} The mode to apply to this component. Mode can be `ios`, `wp`, or `md`.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {

12
src/components/option/option.ts
View File

@ -18,14 +18,14 @@ export class Option {
_value: any;
/**
* @input {any} Event to evaluate when option is selected
* @output {any} Event to evaluate when option is selected.
*/
@Output() ionSelect: EventEmitter<any> = new EventEmitter();
constructor(private _elementRef: ElementRef) {}
/**
* @input {boolean} Whether or not the option is already selected
* @input {boolean} If true, the element is selected.
*/
@Input()
get selected() {
@ -37,7 +37,7 @@ export class Option {
}
/**
* @input {any} The value of the option
* @input {any} The value of the option.
*/
@Input()
get value() {
@ -52,14 +52,14 @@ export class Option {
}
/**
* @input {boolean} Whether or not the option is disabled
* @input {boolean} If true, the user cannot interact with this element.
*/
@Input()
get disabled() {
get disabled(): boolean {
return this._disabled;
}
set disabled(val) {
set disabled(val: boolean) {
this._disabled = isTrueProperty(val);
}

18
src/components/radio/radio-button.ts
View File

@ -91,7 +91,9 @@ export class RadioButton extends Ion implements IonicTapInput, OnDestroy, OnInit
id: string;
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {
@ -103,7 +105,9 @@ export class RadioButton extends Ion implements IonicTapInput, OnDestroy, OnInit
}
/**
* @input {string} The mode to apply to this component. Mode can be `ios`, `wp`, or `md`.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {
@ -111,7 +115,7 @@ export class RadioButton extends Ion implements IonicTapInput, OnDestroy, OnInit
}
/**
* @output {any} expression to be evaluated when selected
* @output {any} Emitted when the radio button is selected.
*/
@Output() ionSelect: EventEmitter<any> = new EventEmitter();
@ -153,15 +157,15 @@ export class RadioButton extends Ion implements IonicTapInput, OnDestroy, OnInit
}
/**
* @input {boolean} Whether the radio button should be checked or not. Default false.
* @input {boolean} If true, the element is selected, and other buttons in the group are unselected.
*/
@Input()
get checked(): boolean {
return this._checked;
}
set checked(isChecked: boolean) {
this._checked = isTrueProperty(isChecked);
set checked(val: boolean) {
this._checked = isTrueProperty(val);
if (this._item) {
this._item.setElementClass('item-radio-checked', this._checked);
@ -169,7 +173,7 @@ export class RadioButton extends Ion implements IonicTapInput, OnDestroy, OnInit
}
/**
* @input {boolean} Whether the radio button should be disabled or not. Default false.
* @input {boolean} If true, the user cannot interact with this element.
*/
@Input()
get disabled(): boolean {

4
src/components/radio/radio-group.ts
View File

@ -107,7 +107,7 @@ export class RadioGroup {
id: number;
/**
* @input {boolean} Whether all radio buttons in the group should be disabled. Default false.
* @input {boolean} If true, the user cannot interact with any of the buttons in the group.
*/
@Input()
get disabled(): boolean {
@ -118,7 +118,7 @@ export class RadioGroup {
}
/**
* @output {any} expression to be evaluated when selection has been changed
* @output {any} Emitted when the selected button has changed.
*/
@Output() ionChange: EventEmitter<RadioGroup> = new EventEmitter<RadioGroup>();

13
src/components/range/range.ts
View File

@ -152,8 +152,9 @@ export class Range extends Ion implements AfterViewInit, ControlValueAccessor, O
value: any;
/**
* @input {string} The predefined color to use. For example: `"primary"`,
* `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {
@ -161,7 +162,9 @@ export class Range extends Ion implements AfterViewInit, ControlValueAccessor, O
}
/**
* @input {string} The mode to apply to this component. Mode can be `ios`, `wp`, or `md`.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {
@ -263,7 +266,7 @@ export class Range extends Ion implements AfterViewInit, ControlValueAccessor, O
}
/**
* @input {boolean} Whether or not the range is disabled. Defaults to `false`.
* @input {boolean} If true, the user cannot interact with this element.
*/
@Input()
get disabled(): boolean {
@ -300,7 +303,7 @@ export class Range extends Ion implements AfterViewInit, ControlValueAccessor, O
}
/**
* @output {Range} Expression to evaluate when the range value changes.
* @output {Range} Emitted when the range value changes.
*/
@Output() ionChange: EventEmitter<Range> = new EventEmitter<Range>();

12
src/components/refresher/refresher.ts
View File

@ -182,20 +182,20 @@ export class Refresher {
}
/**
* @output {event} When the user lets go and has pulled down far enough, which would be
* farther than the `pullMin`, then your refresh hander if fired and the state is
* updated to `refreshing`. From within your refresh handler, you must call the
* `complete()` method when your async operation has completed.
* @output {event} Emitted when the user lets go and has pulled down
* far enough, which would be farther than the `pullMin`, then your refresh hander if
* fired and the state is updated to `refreshing`. From within your refresh handler,
* you must call the `complete()` method when your async operation has completed.
*/
@Output() ionRefresh: EventEmitter<Refresher> = new EventEmitter<Refresher>();
/**
* @output {event} While the user is pulling down the content and exposing the refresher.
* @output {event} Emitted while the user is pulling down the content and exposing the refresher.
*/
@Output() ionPull: EventEmitter<Refresher> = new EventEmitter<Refresher>();
/**
* @output {event} When the user begins to start pulling down.
* @output {event} Emitted when the user begins to start pulling down.
*/
@Output() ionStart: EventEmitter<Refresher> = new EventEmitter<Refresher>();

8
src/components/scroll/scroll.ts
View File

@ -41,7 +41,7 @@ export class Scroll {
_maxZoom: number = 1;
/**
* @input {boolean} whether to enable scrolling along the X axis
* @input {boolean} If true, scrolling along the X axis is enabled.
*/
@Input()
get scrollX() {
@ -52,7 +52,7 @@ export class Scroll {
}
/**
* @input {boolean} whether to enable scrolling along the Y axis; requires the following CSS declaration: ion-scroll { white-space: nowrap; }
* @input {boolean} If true, scrolling along the Y axis is enabled; requires the following CSS declaration: ion-scroll { white-space: nowrap; }
*/
@Input()
get scrollY() {
@ -63,7 +63,7 @@ export class Scroll {
}
/**
* @input {boolean} whether to enable zooming
* @input {boolean} If true, zooming is enabled.
*/
@Input()
get zoom() {
@ -74,7 +74,7 @@ export class Scroll {
}
/**
* @input {number} set the max zoom amount for ion-scroll
* @input {number} Set the max zoom amount.
*/
@Input()
get maxZoom() {

22
src/components/searchbar/searchbar.ts
View File

@ -67,7 +67,9 @@ export class Searchbar extends Ion {
_animated: boolean = false;
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {
@ -75,7 +77,9 @@ export class Searchbar extends Ion {
}
/**
* @input {string} The mode to apply to this component. Mode can be `ios`, `wp`, or `md`.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {
@ -88,7 +92,7 @@ export class Searchbar extends Ion {
@Input() cancelButtonText: string = 'Cancel';
/**
* @input {boolean} Whether to show the cancel button or not. Default: `"false"`.
* @input {boolean} If true, show the cancel button.
*/
@Input()
get showCancelButton(): boolean {
@ -144,7 +148,7 @@ export class Searchbar extends Ion {
@Input() type: string = 'search';
/**
* @input {boolean} Configures if the searchbar is animated or no. By default, animation is `false`.
* @input {boolean} If true, enable searchbar animation.
*/
@Input()
get animated(): boolean {
@ -155,27 +159,27 @@ export class Searchbar extends Ion {
}
/**
* @output {event} When the Searchbar input has changed including cleared.
* @output {event} Emitted when the Searchbar input has changed, including when it's cleared.
*/
@Output() ionInput: EventEmitter<UIEvent> = new EventEmitter<UIEvent>();
/**
* @output {event} When the Searchbar input has blurred.
* @output {event} Emitted when the Searchbar input has blurred.
*/
@Output() ionBlur: EventEmitter<UIEvent> = new EventEmitter<UIEvent>();
/**
* @output {event} When the Searchbar input has focused.
* @output {event} Emitted when the Searchbar input has focused.
*/
@Output() ionFocus: EventEmitter<UIEvent> = new EventEmitter<UIEvent>();
/**
* @output {event} When the cancel button is clicked.
* @output {event} Emitted when the cancel button is clicked.
*/
@Output() ionCancel: EventEmitter<UIEvent> = new EventEmitter<UIEvent>();
/**
* @output {event} When the clear input button is clicked.
* @output {event} Emitted when the clear input button is clicked.
*/
@Output() ionClear: EventEmitter<UIEvent> = new EventEmitter<UIEvent>();

16
src/components/segment/segment.ts
View File

@ -63,14 +63,14 @@ export class SegmentButton {
@Input() value: string;
/**
* @output {SegmentButton} expression to evaluate when a segment button has been clicked
* @output {SegmentButton} Emitted when a segment button has been clicked.
*/
@Output() ionSelect: EventEmitter<SegmentButton> = new EventEmitter<SegmentButton>();
constructor(private _renderer: Renderer, private _elementRef: ElementRef) {}
/**
* @input {boolean} disabled state of the button. Optional.
* @input {boolean} If true, the user cannot interact with this element.
*/
@Input()
get disabled(): boolean {
@ -187,7 +187,9 @@ export class Segment extends Ion {
value: string;
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {
@ -195,7 +197,9 @@ export class Segment extends Ion {
}
/**
* @input {string} The mode to apply to this component. Mode can be `ios`, `wp`, or `md`.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {
@ -203,7 +207,7 @@ export class Segment extends Ion {
}
/**
* @output {Any} expression to evaluate when a segment button has been changed
* @output {Any} Emitted when a segment button has been changed.
*/
@Output() ionChange: EventEmitter<SegmentButton> = new EventEmitter<SegmentButton>();
@ -227,7 +231,7 @@ export class Segment extends Ion {
}
/**
* @private
* @input {boolean} If true, the user cannot interact with any of the buttons in the segment.
*/
@Input()
get disabled(): boolean {

16
src/components/select/select.ts
View File

@ -191,7 +191,9 @@ export class Select extends Ion implements AfterContentInit, ControlValueAccesso
@Input() selectedText: string = '';
/**
* @input {string} The mode to apply to this component. Mode can be `ios`, `wp`, or `md`.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {
@ -199,12 +201,12 @@ export class Select extends Ion implements AfterContentInit, ControlValueAccesso
}
/**
* @output {any} Any expression you want to evaluate when the selection has changed.
* @output {any} Emitted when the selection has changed.
*/
@Output() ionChange: EventEmitter<any> = new EventEmitter();
/**
* @output {any} Any expression you want to evaluate when the selection was cancelled.
* @output {any} Emitted when the selection was cancelled.
*/
@Output() ionCancel: EventEmitter<any> = new EventEmitter();
@ -366,7 +368,7 @@ export class Select extends Ion implements AfterContentInit, ControlValueAccesso
/**
* @input {boolean} Whether or not the select component can accept multiple values. Default: `false`.
* @input {boolean} If true, the element can accept multiple values.
*/
@Input()
get multiple(): any {
@ -424,14 +426,14 @@ export class Select extends Ion implements AfterContentInit, ControlValueAccesso
}
/**
* @input {boolean} Whether or not the select component is disabled. Default `false`.
* @input {boolean} If true, the user cannot interact with this element.
*/
@Input()
get disabled() {
get disabled(): boolean {
return this._disabled;
}
set disabled(val) {
set disabled(val: boolean) {
this._disabled = isTrueProperty(val);
this._item && this._item.setElementClass('item-select-disabled', this._disabled);
}

46
src/components/slides/slides.ts
View File

@ -178,7 +178,8 @@ export class Slides extends Ion {
private _control: Slides | Slides[] = null;
/**
* @input {string} Could be `slide`, `fade`, `cube`, `coverflow` or `flip`.
* @input {string} The animation effect of the slides.
* Possible values are: `slide`, `fade`, `cube`, `coverflow` or `flip`.
* Default: `slide`.
*/
@Input()
@ -220,8 +221,8 @@ export class Slides extends Ion {
private _initialSlide = 0;
/**
* @input {boolean} Whether to continuously loop from the last slide to the
* first slide. Default: `false`.
* @input {boolean} If true, continuously loop from the last slide to the
* first slide.
*/
@Input()
get loop() {
@ -233,7 +234,7 @@ export class Slides extends Ion {
private _isLoop = false;
/**
* @input {boolean} Whether or not to show the pager. Default: `false`.
* @input {boolean} If true, show the pager.
*/
@Input()
get pager() {
@ -245,7 +246,7 @@ export class Slides extends Ion {
private _pager = false;
/**
* @input {string} String with type of pagination. Can be
* @input {string} Type of pagination. Possible values are:
* `bullets`, `fraction`, `progress`. Default: `bullets`.
* (Note that the pager will not show unless `pager` input
* is set to true).
@ -266,8 +267,8 @@ export class Slides extends Ion {
paginationBulletRender: (index?: number, cssClass?: string) => void = null;
/**
* @input {boolean} Enable, if you want to use "parallaxed" elements inside of
* slider. Default: `false`.
* @input {boolean} If true, allows you to use "parallaxed" elements inside of
* slider.
*/
@Input()
get parallax() {
@ -292,8 +293,7 @@ export class Slides extends Ion {
private _speedMs = 300;
/**
* @input {boolean} Set to `true` to enable zooming functionality.
* Default: `false`.
* @input {boolean} If true, enables zooming functionality.
*/
@Input()
get zoom() {
@ -645,72 +645,72 @@ export class Slides extends Ion {
originalEvent: any;
/**
* @output {Slides} Expression to evaluate when a slide change starts.
* @output {Slides} Emitted when a slide change starts.
*/
@Output() ionSlideWillChange: EventEmitter<Slides> = new EventEmitter();
/**
* @output {Slides} Expression to evaluate when a slide change ends.
* @output {Slides} Emitted when a slide change ends.
*/
@Output() ionSlideDidChange: EventEmitter<Slides> = new EventEmitter();
/**
* @output {Slides} Expression to evaluate when a slide moves.
* @output {Slides} Emitted when a slide moves.
*/
@Output() ionSlideDrag: EventEmitter<Slides> = new EventEmitter();
/**
* @output {Slides} When slides reach its beginning (initial position).
* @output {Slides} Emitted when slides reaches its beginning (initial position).
*/
@Output() ionSlideReachStart: EventEmitter<Slides> = new EventEmitter();
/**
* @output {Slides} When slides reach its last slide.
* @output {Slides} Emitted when slides reaches its last slide.
*/
@Output() ionSlideReachEnd: EventEmitter<Slides> = new EventEmitter();
/**
* @output {Slides} Expression to evaluate when a slide moves.
* @output {Slides} Emitted when a slide moves.
*/
@Output() ionSlideAutoplay: EventEmitter<Slides> = new EventEmitter();
/**
* @output {Slides} Same as `ionSlideWillChange` but caused by autoplay.
* @output {Slides} Emitted when a autoplay starts.
*/
@Output() ionSlideAutoplayStart: EventEmitter<Slides> = new EventEmitter();
/**
* @output {Slides} Expression to evaluate when a autoplay stops.
* @output {Slides} Emitted when a autoplay stops.
*/
@Output() ionSlideAutoplayStop: EventEmitter<Slides> = new EventEmitter();
/**
* @output {Slides} Same as `ionSlideWillChange` but for "forward" direction only.
* @output {Slides} Emitted when a slide change starts with the "forward" direction.
*/
@Output() ionSlideNextStart: EventEmitter<Slides> = new EventEmitter();
/**
* @output {Slides} Same as `ionSlideWillChange` but for "backward" direction only.
* @output {Slides} Emitted when a slide change starts with the "backward" direction.
*/
@Output() ionSlidePrevStart: EventEmitter<Slides> = new EventEmitter();
/**
* @output {Slides} Same as `ionSlideDidChange` but for "forward" direction only.
* @output {Slides} Emitted when a slide change ends with the "forward" direction.
*/
@Output() ionSlideNextEnd: EventEmitter<Slides> = new EventEmitter();
/**
* @output {Slides} Same as `ionSlideDidChange` but for "backward" direction only.
* @output {Slides} Emitted when a slide change ends with the "backward" direction.
*/
@Output() ionSlidePrevEnd: EventEmitter<Slides> = new EventEmitter();
/**
* @output {Slides} When the user taps/clicks on the slide's container.
* @output {Slides} Emitted when the user taps/clicks on the slide's container.
*/
@Output() ionSlideTap: EventEmitter<Slides> = new EventEmitter();
/**
* @output {Slides} When the user double taps on the slide's container.
* @output {Slides} Emitted when the user double taps on the slide's container.
*/
@Output() ionSlideDoubleTap: EventEmitter<Slides> = new EventEmitter();

10
src/components/spinner/spinner.ts
View File

@ -121,7 +121,9 @@ export class Spinner extends Ion {
_paused: boolean = false;
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
get color(): string {
@ -132,7 +134,9 @@ export class Spinner extends Ion {
}
/**
* @input {string} The mode to apply to this component. Mode can be `ios`, `wp`, or `md`.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {
@ -164,7 +168,7 @@ export class Spinner extends Ion {
}
/**
* @input {boolean} If the animation is paused or not. Defaults to `false`.
* @input {boolean} If true, pause the animation.
*/
@Input()
get paused(): boolean {

17
src/components/tabs/tab.ts
View File

@ -209,10 +209,9 @@ export class Tab extends NavControllerBase {
@Input() tabBadgeStyle: string;
/**
* @input {boolean} If the tab is enabled or not. If the tab
* is not enabled then the tab button will still show, however,
* the button will appear grayed out and will not be clickable.
* Defaults to `true`.
* @input {boolean} If true, enable the tab. If false,
* the user cannot interact with this element.
* Default: `true`.
*/
@Input()
get enabled(): boolean {
@ -223,8 +222,8 @@ export class Tab extends NavControllerBase {
}
/**
* @input {boolean} If the tab button is visible within the
* tabbar or not. Defaults to `true`.
* @input {boolean} If true, the tab button is visible within the
* tabbar. Default: `true`.
*/
@Input()
get show(): boolean {
@ -235,7 +234,7 @@ export class Tab extends NavControllerBase {
}
/**
* @input {boolean} Whether it's possible to swipe-to-go-back on this tab or not.
* @input {boolean} If true, swipe to go back is enabled.
*/
@Input()
get swipeBackEnabled(): boolean {
@ -246,7 +245,7 @@ export class Tab extends NavControllerBase {
}
/**
* @input {boolean} Whether to hide the tabs on child pages or not. If `true` it will not show the tabs on child pages.
* @input {boolean} If true, hide the tabs on child pages.
*/
@Input()
get tabsHideOnSubPages(): boolean {
@ -257,7 +256,7 @@ export class Tab extends NavControllerBase {
}
/**
* @output {Tab} Method to call when the current tab is selected
* @output {Tab} Emitted when the current tab is selected.
*/
@Output() ionSelect: EventEmitter<Tab> = new EventEmitter<Tab>();

12
src/components/tabs/tabs.ts
View File

@ -179,7 +179,9 @@ export class Tabs extends Ion implements AfterViewInit {
_selectHistory: string[] = [];
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(value: string) {
@ -187,7 +189,9 @@ export class Tabs extends Ion implements AfterViewInit {
}
/**
* @input {string} The mode to apply to this component. Mode can be `ios`, `wp`, or `md`.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {
@ -210,12 +214,12 @@ export class Tabs extends Ion implements AfterViewInit {
@Input() tabsPlacement: string;
/**
* @input {boolean} Whether to show the tab highlight bar under the selected tab. Default: `false`.
* @input {boolean} If true, show the tab highlight bar under the selected tab.
*/
@Input() tabsHighlight: boolean;
/**
* @input {any} Expression to evaluate when the tab changes.
* @output {any} Emitted when the tab changes.
*/
@Output() ionChange: EventEmitter<Tab> = new EventEmitter<Tab>();

14
src/components/toggle/toggle.ts
View File

@ -94,7 +94,9 @@ export class Toggle extends Ion implements IonicTapInput, AfterContentInit, Cont
id: string;
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {
@ -102,7 +104,9 @@ export class Toggle extends Ion implements IonicTapInput, AfterContentInit, Cont
}
/**
* @input {string} The mode to apply to this component. Mode can be `ios`, `wp`, or `md`.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {
@ -110,7 +114,7 @@ export class Toggle extends Ion implements IonicTapInput, AfterContentInit, Cont
}
/**
* @output {Toggle} expression to evaluate when the toggle value changes
* @output {Toggle} Emitted when the toggle value changes.
*/
@Output() ionChange: EventEmitter<Toggle> = new EventEmitter<Toggle>();
@ -209,7 +213,7 @@ export class Toggle extends Ion implements IonicTapInput, AfterContentInit, Cont
}
/**
* @input {boolean} whether the toggle it toggled or not
* @input {boolean} If `true`, the element is selected.
*/
@Input()
get checked(): boolean {
@ -256,7 +260,7 @@ export class Toggle extends Ion implements IonicTapInput, AfterContentInit, Cont
}
/**
* @input {boolean} whether the toggle is disabled or not
* @input {boolean} If true, the user cannot interact with this element.
*/
@Input()
get disabled(): boolean {

8
src/components/toolbar/toolbar.ts
View File

@ -210,7 +210,9 @@ export class Toolbar extends ToolbarBase {
_sbPadding: boolean;
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {
@ -218,7 +220,9 @@ export class Toolbar extends ToolbarBase {
}
/**
* @input {string} The mode to apply to this component. Mode can be `ios`, `wp`, or `md`.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {

8
src/components/typography/typography.ts
View File

@ -52,7 +52,9 @@ import { Ion } from '../ion';
export class Typography extends Ion {
/**
* @input {string} The predefined color to use. For example: `"primary"`, `"secondary"`, `"danger"`.
* @input {string} The color to use from your Sass `$colors` map.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/v2/theming/theming-your-app).
*/
@Input()
set color(val: string) {
@ -60,7 +62,9 @@ export class Typography extends Ion {
}
/**
* @input {string} The mode to apply to this component.
* @input {string} The mode determines which platform styles to use.
* Possible values are: `"ios"`, `"md"`, or `"wp"`.
* For more information, see [Platform Styles](/docs/v2/theming/platform-specific-styles).
*/
@Input()
set mode(val: string) {