mirror of
https://github.com/ionic-team/ionic-framework.git
synced 2025-08-18 03:00:58 +08:00
fix(all): strong type text fields
This commit is contained in:
5
core/src/components.d.ts
vendored
5
core/src/components.d.ts
vendored
@ -79,6 +79,7 @@ import {
|
|||||||
StyleEvent,
|
StyleEvent,
|
||||||
TabbarLayout,
|
TabbarLayout,
|
||||||
TabbarPlacement,
|
TabbarPlacement,
|
||||||
|
TextFieldTypes,
|
||||||
ToastOptions,
|
ToastOptions,
|
||||||
TransitionDoneFn,
|
TransitionDoneFn,
|
||||||
TransitionInstruction,
|
TransitionInstruction,
|
||||||
@ -2862,7 +2863,7 @@ declare global {
|
|||||||
/**
|
/**
|
||||||
* The type of control to display. The default type is text. Possible values are: `"text"`, `"password"`, `"email"`, `"number"`, `"search"`, `"tel"`, or `"url"`.
|
* The type of control to display. The default type is text. Possible values are: `"text"`, `"password"`, `"email"`, `"number"`, `"search"`, `"tel"`, or `"url"`.
|
||||||
*/
|
*/
|
||||||
'type': string;
|
'type': TextFieldTypes;
|
||||||
/**
|
/**
|
||||||
* The value of the input.
|
* The value of the input.
|
||||||
*/
|
*/
|
||||||
@ -3024,7 +3025,7 @@ declare global {
|
|||||||
/**
|
/**
|
||||||
* The type of control to display. The default type is text. Possible values are: `"text"`, `"password"`, `"email"`, `"number"`, `"search"`, `"tel"`, or `"url"`.
|
* The type of control to display. The default type is text. Possible values are: `"text"`, `"password"`, `"email"`, `"number"`, `"search"`, `"tel"`, or `"url"`.
|
||||||
*/
|
*/
|
||||||
'type'?: string;
|
'type'?: TextFieldTypes;
|
||||||
/**
|
/**
|
||||||
* The value of the input.
|
* The value of the input.
|
||||||
*/
|
*/
|
||||||
|
@ -1,3 +1,4 @@
|
|||||||
|
import { TextFieldTypes } from '../../interface';
|
||||||
|
|
||||||
export interface AlertOptions {
|
export interface AlertOptions {
|
||||||
header?: string;
|
header?: string;
|
||||||
@ -12,7 +13,7 @@ export interface AlertOptions {
|
|||||||
}
|
}
|
||||||
|
|
||||||
export interface AlertInput {
|
export interface AlertInput {
|
||||||
type: string;
|
type: TextFieldTypes | 'checkbox' | 'radio';
|
||||||
name: string;
|
name: string;
|
||||||
placeholder?: string;
|
placeholder?: string;
|
||||||
value?: string;
|
value?: string;
|
||||||
@ -21,8 +22,8 @@ export interface AlertInput {
|
|||||||
disabled?: boolean;
|
disabled?: boolean;
|
||||||
id?: string;
|
id?: string;
|
||||||
handler?: (input: AlertInput) => void;
|
handler?: (input: AlertInput) => void;
|
||||||
min?: string | number;
|
min?: number;
|
||||||
max?: string | number;
|
max?: number;
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface AlertButton {
|
export interface AlertButton {
|
||||||
|
@ -152,9 +152,9 @@ export class Alert implements OverlayInterface {
|
|||||||
checked: !!i.checked,
|
checked: !!i.checked,
|
||||||
disabled: !!i.disabled,
|
disabled: !!i.disabled,
|
||||||
id: i.id ? i.id : `alert-input-${this.overlayId}-${index}`,
|
id: i.id ? i.id : `alert-input-${this.overlayId}-${index}`,
|
||||||
handler: i.handler ? i.handler : null,
|
handler: i.handler,
|
||||||
min: i.min ? i.min : null,
|
min: i.min,
|
||||||
max: i.max ? i.max : null
|
max: i.max
|
||||||
}) as AlertInput);
|
}) as AlertInput);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -124,16 +124,19 @@
|
|||||||
header: 'Prompt!',
|
header: 'Prompt!',
|
||||||
inputs: [
|
inputs: [
|
||||||
{
|
{
|
||||||
|
type: 'text',
|
||||||
placeholder: 'Placeholder 1'
|
placeholder: 'Placeholder 1'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'name2',
|
name: 'name2',
|
||||||
|
type: 'text',
|
||||||
id: 'name2-id',
|
id: 'name2-id',
|
||||||
value: 'hello',
|
value: 'hello',
|
||||||
placeholder: 'Placeholder 2'
|
placeholder: 'Placeholder 2'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
name: 'name3',
|
name: 'name3',
|
||||||
|
type: 'text',
|
||||||
value: 'http://ionicframework.com',
|
value: 'http://ionicframework.com',
|
||||||
type: 'url',
|
type: 'url',
|
||||||
placeholder: 'Favorite site ever'
|
placeholder: 'Favorite site ever'
|
||||||
|
@ -1,5 +1,5 @@
|
|||||||
import { Component, Element, Event, EventEmitter, Prop, State, Watch } from '@stencil/core';
|
import { Component, Element, Event, EventEmitter, Prop, State, Watch } from '@stencil/core';
|
||||||
import { Color, InputChangeEvent, Mode, StyleEvent } from '../../interface';
|
import { Color, InputChangeEvent, Mode, StyleEvent, TextFieldTypes } from '../../interface';
|
||||||
import { debounceEvent, deferEvent, renderHiddenInput } from '../../utils/helpers';
|
import { debounceEvent, deferEvent, renderHiddenInput } from '../../utils/helpers';
|
||||||
import { createColorClasses, hostContext } from '../../utils/theme';
|
import { createColorClasses, hostContext } from '../../utils/theme';
|
||||||
import { InputComponent } from './input-base';
|
import { InputComponent } from './input-base';
|
||||||
@ -205,7 +205,7 @@ export class Input implements InputComponent {
|
|||||||
/**
|
/**
|
||||||
* The type of control to display. The default type is text. Possible values are: `"text"`, `"password"`, `"email"`, `"number"`, `"search"`, `"tel"`, or `"url"`.
|
* The type of control to display. The default type is text. Possible values are: `"text"`, `"password"`, `"email"`, `"number"`, `"search"`, `"tel"`, or `"url"`.
|
||||||
*/
|
*/
|
||||||
@Prop() type = 'text';
|
@Prop() type: TextFieldTypes = 'text';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* The value of the input.
|
* The value of the input.
|
||||||
|
1
core/src/interface.d.ts
vendored
1
core/src/interface.d.ts
vendored
@ -30,6 +30,7 @@ export { OverlayEventDetail, OverlayInterface } from './utils/overlays';
|
|||||||
|
|
||||||
|
|
||||||
// Global types
|
// Global types
|
||||||
|
export type TextFieldTypes = 'date' | 'email' | 'number' | 'password' | 'search' | 'tel' | 'text' | 'url';
|
||||||
export type Side = 'start' | 'end';
|
export type Side = 'start' | 'end';
|
||||||
export type PredefinedColors = 'primary' | 'secondary' | 'tertiary' | 'success' | 'warning' | 'danger' | 'light' | 'medium' | 'dark';
|
export type PredefinedColors = 'primary' | 'secondary' | 'tertiary' | 'success' | 'warning' | 'danger' | 'light' | 'medium' | 'dark';
|
||||||
export type Color = PredefinedColors | string;
|
export type Color = PredefinedColors | string;
|
||||||
|
Reference in New Issue
Block a user