feat(input): add support for enterkeyhint (#21035)

fixes #21034
This commit is contained in:
Liam DeBeasi
2020-04-15 15:08:12 -04:00
committed by GitHub
parent 102a842bd2
commit 3efaf43821
6 changed files with 21 additions and 3 deletions

View File

@@ -95,6 +95,13 @@ export class Input implements ComponentInterface {
*/
@Prop() inputmode?: 'none' | 'text' | 'tel' | 'url' | 'email' | 'numeric' | 'decimal' | 'search';
/**
* A hint to the browser for which enter key to display.
* Possible values: `"enter"`, `"done"`, `"go"`, `"next"`,
* `"previous"`, `"search"`, and `"send"`.
*/
@Prop() enterkeyhint?: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send';
/**
* The maximum value, which must not be less than its minimum (min attribute) value.
*/
@@ -362,6 +369,7 @@ export class Input implements ComponentInterface {
autoComplete={this.autocomplete}
autoCorrect={this.autocorrect}
autoFocus={this.autofocus}
enterKeyHint={this.enterkeyhint}
inputMode={this.inputmode}
min={this.min}
max={this.max}

View File

@@ -242,6 +242,7 @@ export const InputExamples: React.FC = () => {
| `color` | `color` | The color to use from your application's color palette. Default options are: `"primary"`, `"secondary"`, `"tertiary"`, `"success"`, `"warning"`, `"danger"`, `"light"`, `"medium"`, and `"dark"`. For more information on colors, see [theming](/docs/theming/basics). | `string \| undefined` | `undefined` |
| `debounce` | `debounce` | Set the amount of time, in milliseconds, to wait to trigger the `ionChange` event after each keystroke. | `number` | `0` |
| `disabled` | `disabled` | If `true`, the user cannot interact with the input. | `boolean` | `false` |
| `enterkeyhint` | `enterkeyhint` | A hint to the browser for which enter key to display. Possible values: `"enter"`, `"done"`, `"go"`, `"next"`, `"previous"`, `"search"`, and `"send"`. | `"done" \| "enter" \| "go" \| "next" \| "previous" \| "search" \| "send" \| undefined` | `undefined` |
| `inputmode` | `inputmode` | A hint to the browser for which keyboard to display. Possible values: `"none"`, `"text"`, `"tel"`, `"url"`, `"email"`, `"numeric"`, `"decimal"`, and `"search"`. | `"decimal" \| "email" \| "none" \| "numeric" \| "search" \| "tel" \| "text" \| "url" \| undefined` | `undefined` |
| `max` | `max` | The maximum value, which must not be less than its minimum (min attribute) value. | `string \| undefined` | `undefined` |
| `maxlength` | `maxlength` | If the value of the type attribute is `text`, `email`, `search`, `password`, `tel`, or `url`, this attribute specifies the maximum number of characters that the user can enter. | `number \| undefined` | `undefined` |