Skip to content

Commit

Permalink
refactor(input): remove accept property (#28946)
Browse files Browse the repository at this point in the history
BREAKING CHANGE:
The `accept` property has been removed from `ion-input`.
  • Loading branch information
thetaPC committed Feb 1, 2024
1 parent a393d2a commit 2816b87
Show file tree
Hide file tree
Showing 6 changed files with 3 additions and 22 deletions.
1 change: 1 addition & 0 deletions BREAKING.md
Expand Up @@ -138,6 +138,7 @@ This allows components to inherit the color properly when used outside of Ionic
<h4 id="version-8x-input">Input</h4>

- `size` has been removed from the `ion-input` component. Developers should use CSS to specify the visible width of the input.
- `accept` has been removed from the `ion-input` component. This was previously used in conjunction with the `type="file"`. However, the `file` value for `type` is not a valid value in Ionic Framework.

<h4 id="version-8x-nav">Nav</h4>

Expand Down
1 change: 0 additions & 1 deletion core/api.txt
Expand Up @@ -547,7 +547,6 @@ ion-infinite-scroll-content,prop,loadingSpinner,"bubbles" | "circles" | "circula
ion-infinite-scroll-content,prop,loadingText,IonicSafeString | string | undefined,undefined,false,false

ion-input,scoped
ion-input,prop,accept,string | undefined,undefined,false,false
ion-input,prop,autocapitalize,string,'off',false,false
ion-input,prop,autocomplete,"name" | "email" | "tel" | "url" | "on" | "off" | "honorific-prefix" | "given-name" | "additional-name" | "family-name" | "honorific-suffix" | "nickname" | "username" | "new-password" | "current-password" | "one-time-code" | "organization-title" | "organization" | "street-address" | "address-line1" | "address-line2" | "address-line3" | "address-level4" | "address-level3" | "address-level2" | "address-level1" | "country" | "country-name" | "postal-code" | "cc-name" | "cc-given-name" | "cc-additional-name" | "cc-family-name" | "cc-number" | "cc-exp" | "cc-exp-month" | "cc-exp-year" | "cc-csc" | "cc-type" | "transaction-currency" | "transaction-amount" | "language" | "bday" | "bday-day" | "bday-month" | "bday-year" | "sex" | "tel-country-code" | "tel-national" | "tel-area-code" | "tel-local" | "tel-extension" | "impp" | "photo",'off',false,false
ion-input,prop,autocorrect,"off" | "on",'off',false,false
Expand Down
10 changes: 0 additions & 10 deletions core/src/components.d.ts
Expand Up @@ -1144,11 +1144,6 @@ export namespace Components {
"loadingText"?: string | IonicSafeString;
}
interface IonInput {
/**
* This attribute is ignored.
* @deprecated
*/
"accept"?: string;
/**
* Indicates whether and how the text value should be automatically capitalized as it is entered/edited by the user. Available options: `"off"`, `"none"`, `"on"`, `"sentences"`, `"words"`, `"characters"`.
*/
Expand Down Expand Up @@ -5888,11 +5883,6 @@ declare namespace LocalJSX {
"loadingText"?: string | IonicSafeString;
}
interface IonInput {
/**
* This attribute is ignored.
* @deprecated
*/
"accept"?: string;
/**
* Indicates whether and how the text value should be automatically capitalized as it is entered/edited by the user. Available options: `"off"`, `"none"`, `"on"`, `"sentences"`, `"words"`, `"characters"`.
*/
Expand Down
8 changes: 0 additions & 8 deletions core/src/components/input/input.tsx
Expand Up @@ -74,12 +74,6 @@ export class Input implements ComponentInterface {
*/
@Prop({ reflect: true }) color?: Color;

/**
* This attribute is ignored.
* @deprecated
*/
@Prop() accept?: string;

/**
* Indicates whether and how the text value should be automatically capitalized as it is entered/edited by the user.
* Available options: `"off"`, `"none"`, `"on"`, `"sentences"`, `"words"`, `"characters"`.
Expand Down Expand Up @@ -784,7 +778,6 @@ export class Input implements ComponentInterface {
ref={(input) => (this.nativeInput = input)}
id={inputId}
disabled={disabled}
accept={this.accept}
autoCapitalize={this.autocapitalize}
autoComplete={this.autocomplete}
autoCorrect={this.autocorrect}
Expand Down Expand Up @@ -892,7 +885,6 @@ Developers can dismiss this warning by removing their usage of the "legacy" prop
ref={(input) => (this.nativeInput = input)}
aria-labelledby={label ? label.id : null}
disabled={this.disabled}
accept={this.accept}
autoCapitalize={this.autocapitalize}
autoComplete={this.autocomplete}
autoCorrect={this.autocorrect}
Expand Down
4 changes: 2 additions & 2 deletions packages/angular/src/directives/proxies.ts
Expand Up @@ -955,15 +955,15 @@ export declare interface IonInfiniteScrollContent extends Components.IonInfinite


@ProxyCmp({
inputs: ['accept', 'autocapitalize', 'autocomplete', 'autocorrect', 'autofocus', 'clearInput', 'clearOnEdit', 'color', 'counter', 'counterFormatter', 'debounce', 'disabled', 'enterkeyhint', 'errorText', 'fill', 'helperText', 'inputmode', 'label', 'labelPlacement', 'legacy', 'max', 'maxlength', 'min', 'minlength', 'mode', 'multiple', 'name', 'pattern', 'placeholder', 'readonly', 'required', 'shape', 'spellcheck', 'step', 'type', 'value'],
inputs: ['autocapitalize', 'autocomplete', 'autocorrect', 'autofocus', 'clearInput', 'clearOnEdit', 'color', 'counter', 'counterFormatter', 'debounce', 'disabled', 'enterkeyhint', 'errorText', 'fill', 'helperText', 'inputmode', 'label', 'labelPlacement', 'legacy', 'max', 'maxlength', 'min', 'minlength', 'mode', 'multiple', 'name', 'pattern', 'placeholder', 'readonly', 'required', 'shape', 'spellcheck', 'step', 'type', 'value'],
methods: ['setFocus', 'getInputElement']
})
@Component({
selector: 'ion-input',
changeDetection: ChangeDetectionStrategy.OnPush,
template: '<ng-content></ng-content>',
// eslint-disable-next-line @angular-eslint/no-inputs-metadata-property
inputs: ['accept', 'autocapitalize', 'autocomplete', 'autocorrect', 'autofocus', 'clearInput', 'clearOnEdit', 'color', 'counter', 'counterFormatter', 'debounce', 'disabled', 'enterkeyhint', 'errorText', 'fill', 'helperText', 'inputmode', 'label', 'labelPlacement', 'legacy', 'max', 'maxlength', 'min', 'minlength', 'mode', 'multiple', 'name', 'pattern', 'placeholder', 'readonly', 'required', 'shape', 'spellcheck', 'step', 'type', 'value'],
inputs: ['autocapitalize', 'autocomplete', 'autocorrect', 'autofocus', 'clearInput', 'clearOnEdit', 'color', 'counter', 'counterFormatter', 'debounce', 'disabled', 'enterkeyhint', 'errorText', 'fill', 'helperText', 'inputmode', 'label', 'labelPlacement', 'legacy', 'max', 'maxlength', 'min', 'minlength', 'mode', 'multiple', 'name', 'pattern', 'placeholder', 'readonly', 'required', 'shape', 'spellcheck', 'step', 'type', 'value'],
})
export class IonInput {
protected el: HTMLElement;
Expand Down
1 change: 0 additions & 1 deletion packages/vue/src/proxies.ts
Expand Up @@ -397,7 +397,6 @@ export const IonInfiniteScrollContent = /*@__PURE__*/ defineContainer<JSX.IonInf

export const IonInput = /*@__PURE__*/ defineContainer<JSX.IonInput, JSX.IonInput["value"]>('ion-input', defineIonInput, [
'color',
'accept',
'autocapitalize',
'autocomplete',
'autocorrect',
Expand Down

0 comments on commit 2816b87

Please sign in to comment.