This commit is contained in:
mhartington
2018-01-09 16:05:48 -05:00
parent 77a2ccb463
commit 3de89c8834
2 changed files with 42 additions and 13 deletions

View File

@ -21,16 +21,14 @@ export class Checkbox implements CheckboxInput {
@State() keyFocus: boolean;
/**
* @input {string} The color to use from your Sass `$colors` map.
* The color to use.
* Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
* For more information, see [Theming your App](/docs/theming/theming-your-app).
*/
@Prop() color: string;
/**
* @input {string} The mode determines which platform styles to use.
* The mode determines which platform styles to use.
* Possible values are: `"ios"` or `"md"`.
* For more information, see [Platform Styles](/docs/theming/platform-specific-styles).
*/
@Prop() mode: 'ios' | 'md';
@ -40,41 +38,40 @@ export class Checkbox implements CheckboxInput {
@Prop() name: string;
/**
* @input {boolean} If true, the checkbox is selected. Defaults to `false`.
* If true, the checkbox is selected. Defaults to `false`.
*/
@Prop({ mutable: true }) checked = false;
/*
* @input {boolean} If true, the user cannot interact with the checkbox. Default false.
/**
* If true, the user cannot interact with the checkbox. Default false.
*/
@Prop() disabled = false;
/**
* @input {string} the value of the checkbox.
* the value of the checkbox.
*/
@Prop({ mutable: true }) value: string;
/**
* @output {Event} Emitted when the checked property has changed.
* Emitted when the checked property has changed.
*/
@Event() ionChange: EventEmitter<CheckedInputChangeEvent>;
/**
* @output {Event} Emitted when the toggle has focus.
* Emitted when the toggle has focus.
*/
@Event() ionFocus: EventEmitter<FocusEvent>;
/**
* @output {Event} Emitted when the toggle loses focus.
* Emitted when the toggle loses focus.
*/
@Event() ionBlur: EventEmitter<BlurEvent>;
/**
* @output {Event} Emitted when the styles change.
* Emitted when the styles change.
*/
@Event() ionStyle: EventEmitter<StyleEvent>;
componentWillLoad() {
this.inputId = 'ion-cb-' + (checkboxIds++);
if (this.value === undefined) {

View File

@ -36,21 +36,31 @@ Placed in an `ion-item` or used as a stand-alone checkbox.
boolean
If true, the checkbox is selected. Defaults to `false`.
#### color
string
The color to use.
Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
#### disabled
boolean
If true, the user cannot interact with the checkbox. Default false.
#### mode
any
The mode determines which platform styles to use.
Possible values are: `"ios"` or `"md"`.
#### name
@ -63,6 +73,8 @@ The name of the control, which is submitted with the form data.
string
the value of the checkbox.
## Attributes
@ -70,21 +82,31 @@ string
boolean
If true, the checkbox is selected. Defaults to `false`.
#### color
string
The color to use.
Default options are: `"primary"`, `"secondary"`, `"danger"`, `"light"`, and `"dark"`.
#### disabled
boolean
If true, the user cannot interact with the checkbox. Default false.
#### mode
any
The mode determines which platform styles to use.
Possible values are: `"ios"` or `"md"`.
#### name
@ -97,20 +119,30 @@ The name of the control, which is submitted with the form data.
string
the value of the checkbox.
## Events
#### ionBlur
Emitted when the toggle loses focus.
#### ionChange
Emitted when the checked property has changed.
#### ionFocus
Emitted when the toggle has focus.
#### ionStyle
Emitted when the styles change.
----------------------------------------------