diff --git a/BREAKING.md b/BREAKING.md
index 22482f89240..b1cc8f671d6 100644
--- a/BREAKING.md
+++ b/BREAKING.md
@@ -20,6 +20,7 @@ This is a comprehensive list of the breaking changes introduced in the major ver
- [Button](#version-8x-button)
- [Content](#version-8x-content)
- [Datetime](#version-8x-datetime)
+ - [Input](#version-8x-input)
- [Nav](#version-8x-nav)
- [Picker](#version-8x-picker)
@@ -134,6 +135,10 @@ This allows components to inherit the color properly when used outside of Ionic
}
```
+
+
+- `size` has been removed from the `ion-input` component. Developers should use CSS to specify the visible width of the input.
+
Nav
- `getLength` returns `Promise` instead of ``. This method was not previously available in Nav's TypeScript interface, but developers could still access it by casting Nav as `any`. Developers should ensure they `await` their `getLength` call before accessing the returned value.
diff --git a/core/api.txt b/core/api.txt
index f3c63ef3bc6..70cf16b46de 100644
--- a/core/api.txt
+++ b/core/api.txt
@@ -579,7 +579,6 @@ ion-input,prop,placeholder,string | undefined,undefined,false,false
ion-input,prop,readonly,boolean,false,false,false
ion-input,prop,required,boolean,false,false,false
ion-input,prop,shape,"round" | undefined,undefined,false,false
-ion-input,prop,size,number | undefined,undefined,false,false
ion-input,prop,spellcheck,boolean,false,false,false
ion-input,prop,step,string | undefined,undefined,false,false
ion-input,prop,type,"date" | "datetime-local" | "email" | "month" | "number" | "password" | "search" | "tel" | "text" | "time" | "url" | "week",'text',false,false
diff --git a/core/src/components.d.ts b/core/src/components.d.ts
index 0276f9dac58..7472111222d 100644
--- a/core/src/components.d.ts
+++ b/core/src/components.d.ts
@@ -1281,7 +1281,6 @@ export namespace Components {
* The shape of the input. If "round" it will have an increased border radius.
*/
"shape"?: 'round';
- "size"?: number;
/**
* If `true`, the element will have its spelling and grammar checked.
*/
@@ -6038,7 +6037,6 @@ declare namespace LocalJSX {
* The shape of the input. If "round" it will have an increased border radius.
*/
"shape"?: 'round';
- "size"?: number;
/**
* If `true`, the element will have its spelling and grammar checked.
*/
diff --git a/core/src/components/input/input.tsx b/core/src/components/input/input.tsx
index 3607b103221..ce8da2288bc 100644
--- a/core/src/components/input/input.tsx
+++ b/core/src/components/input/input.tsx
@@ -281,9 +281,6 @@ export class Input implements ComponentInterface {
*/
@Prop() step?: string;
- // FW-4914 Remove this property in Ionic 8
- @Prop() size?: number;
-
/**
* The type of control to display. The default type is text.
*/
@@ -806,7 +803,6 @@ export class Input implements ComponentInterface {
required={this.required}
spellcheck={this.spellcheck}
step={this.step}
- size={this.size}
type={this.type}
value={value}
onInput={this.onInput}
@@ -915,7 +911,6 @@ Developers can dismiss this warning by removing their usage of the "legacy" prop
required={this.required}
spellcheck={this.spellcheck}
step={this.step}
- size={this.size}
type={this.type}
value={value}
onInput={this.onInput}
diff --git a/packages/angular/src/directives/proxies.ts b/packages/angular/src/directives/proxies.ts
index 9cfe7073240..66237da06fb 100644
--- a/packages/angular/src/directives/proxies.ts
+++ b/packages/angular/src/directives/proxies.ts
@@ -955,7 +955,7 @@ 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', 'size', 'spellcheck', 'step', 'type', 'value'],
+ 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'],
methods: ['setFocus', 'getInputElement']
})
@Component({
@@ -963,7 +963,7 @@ export declare interface IonInfiniteScrollContent extends Components.IonInfinite
changeDetection: ChangeDetectionStrategy.OnPush,
template: '',
// 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', 'size', 'spellcheck', 'step', 'type', 'value'],
+ 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'],
})
export class IonInput {
protected el: HTMLElement;
diff --git a/packages/vue/src/proxies.ts b/packages/vue/src/proxies.ts
index 3359b1684ea..37a2a8400c3 100644
--- a/packages/vue/src/proxies.ts
+++ b/packages/vue/src/proxies.ts
@@ -429,7 +429,6 @@ export const IonInput = /*@__PURE__*/ defineContainer