Skip to content

Conversation

brandyscarney
Copy link
Member

@brandyscarney brandyscarney commented Jan 21, 2025

Issue number: resolves #29205


What is the current behavior?

Select does not support helper and error text.

What is the new behavior?

  • Adds support for helperText and errorText
  • Adds parts for helper-text, error-text and supporting-text
  • Adds an e2e test for helper and error text with functional tests and screenshot tests

Does this introduce a breaking change?

  • Yes
  • No

Other information

Preview


Co-authored-by: swimer11 65334157+swimer11@users.noreply.github.com

Copy link

vercel bot commented Jan 21, 2025

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name Status Preview Comments Updated (UTC)
ionic-framework ✅ Ready (Inspect) Visit Preview 💬 Add feedback Mar 10, 2025 10:43pm

@github-actions github-actions bot added package: core @ionic/core package package: angular @ionic/angular package package: vue @ionic/vue package labels Jan 21, 2025
@brandyscarney brandyscarney mentioned this pull request Jan 22, 2025
2 tasks
@brandyscarney brandyscarney marked this pull request as ready for review January 22, 2025 17:18
@brandyscarney brandyscarney requested a review from a team as a code owner January 22, 2025 17:18
@brandyscarney brandyscarney marked this pull request as draft January 22, 2025 18:07
Comment on lines +1031 to +1036
<div id={helperTextId} class="helper-text" part="supporting-text helper-text">
{helperText}
</div>,
<div id={errorTextId} class="error-text" part="supporting-text error-text">
{errorText}
</div>,
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I added the supporting-text part so users could change them at the same time using:

ion-select::part(supporting-text) {
  font-size: 20px;
}

but if we think it should only be the one part they could write this without it:

ion-select::part(helper-text),
ion-select::part(error-text) {
  font-size: 20px;
}

I am copying Material Design 2 and Material Design 3 naming here, but let me know if there are other ideas.

@brandyscarney brandyscarney marked this pull request as ready for review January 22, 2025 20:26
@brandyscarney brandyscarney requested review from thetaPC and removed request for JoaoFerreira-FrontEnd January 22, 2025 20:26
Copy link
Contributor

@thetaPC thetaPC left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM, potential suggestion. No blockers.

@brandyscarney brandyscarney merged commit bbdaec0 into feature-8.5 Mar 10, 2025
48 checks passed
@brandyscarney brandyscarney deleted the ROU-11551 branch March 10, 2025 22:53
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
package: angular @ionic/angular package package: core @ionic/core package package: vue @ionic/vue package
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants