Skip to content

Commit 4506ccf

Browse files
BenOsodracIonitron
andauthored
feat(input): change fill default on ionic theme (#29789)
Issue number: internal --------- <!-- Please do not submit updates to dependencies unless it fixes an issue. --> <!-- Please try to limit your pull request to one type (bugfix, feature, etc). Submit multiple pull requests if needed. --> ## What is the new behavior? <!-- Please describe the behavior or changes that are being added by this PR. --> - Now the fill option default value is outline when using the Ionic theme. - Updated snapshots. ## Does this introduce a breaking change? - [ ] Yes - [x] No <!-- If this introduces a breaking change: 1. Describe the impact and migration path for existing applications below. 2. Update the BREAKING.md file with the breaking change. 3. Add "BREAKING CHANGE: [...]" to the commit description when merging. See https://github.com/ionic-team/ionic-framework/blob/main/docs/CONTRIBUTING.md#footer for more information. --> ## Other information <!-- Any other information that is important to this PR such as screenshots of how the component looks before and after the change. --> - [Input Fill Sample](https://ionic-framework-9fbgwzxss-ionic1.vercel.app/src/components/input/test/fill?ionic:theme=ionic) --------- Co-authored-by: ionitron <[email protected]>
1 parent ca4c0a5 commit 4506ccf

File tree

88 files changed

+13
-1
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

88 files changed

+13
-1
lines changed

core/src/components/input/input.tsx

Lines changed: 13 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -492,6 +492,17 @@ export class Input implements ComponentInterface {
492492
return typeof this.value === 'number' ? this.value.toString() : (this.value || '').toString();
493493
}
494494

495+
private getFill(): string | undefined {
496+
const theme = getIonTheme(this);
497+
const { fill } = this;
498+
499+
if (theme === 'ionic' && fill === undefined) {
500+
return 'outline';
501+
}
502+
503+
return fill;
504+
}
505+
495506
private getLabelPlacement() {
496507
const theme = getIonTheme(this);
497508
const { el, labelPlacement } = this;
@@ -790,9 +801,10 @@ export class Input implements ComponentInterface {
790801
}
791802

792803
render() {
793-
const { disabled, fill, readonly, inputId, el, hasFocus, clearInput, inputClearIcon } = this;
804+
const { disabled, readonly, inputId, el, hasFocus, clearInput, inputClearIcon } = this;
794805
const theme = getIonTheme(this);
795806
const value = this.getValue();
807+
const fill = this.getFill();
796808
const size = this.getSize();
797809
const shape = this.getShape();
798810
const inItem = hostContext('ion-item', this.el);
730 Bytes
975 Bytes
706 Bytes
969 Bytes

0 commit comments

Comments
 (0)