Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

fix(Forms): should display error underneath fields when nested inside Field.Selection or Field.ArraySelection #4225

Merged
merged 5 commits into from
Nov 8, 2024

Conversation

langz
Copy link
Contributor

@langz langz commented Nov 6, 2024

As of now, this PR just adds an example of what should be fixed/improved upon.

Here's a link to the example in the deploy preview, and here locally.

The challenge/problem is that error messages for fields nested inside an Field.Selection is not displayed underneath each respective field, but rather merged and displayed at the bottom of the Field.Selection, like so:

image

Copy link

vercel bot commented Nov 6, 2024

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

Name Status Preview Comments Updated (UTC)
eufemia ✅ Ready (Inspect) Visit Preview 💬 Add feedback Nov 8, 2024 1:03pm

Copy link

codesandbox-ci bot commented Nov 6, 2024

This pull request is automatically built and testable in CodeSandbox.

To see build info of the built libraries, click here or the icon next to each commit SHA.

@langz langz changed the title chore: adds example fix(Field.Selection): should display error underneath the respective Fields when nested Nov 6, 2024
@langz langz changed the title fix(Field.Selection): should display error underneath the respective Fields when nested fix(Field.Selection): should display error underneath the respective nested Fields Nov 6, 2024
@tujoworker tujoworker changed the title fix(Field.Selection): should display error underneath the respective nested Fields fix(Forms): should display error underneath fields when nested inside Field.Selection or Field.ArraySelection Nov 6, 2024
@tujoworker tujoworker force-pushed the chore/add-selection-example branch from 0726646 to 2c1b3b4 Compare November 6, 2024 17:41
@tujoworker tujoworker force-pushed the chore/add-selection-example branch 2 times, most recently from 8ec43c0 to 197b360 Compare November 6, 2024 17:50
tujoworker added a commit that referenced this pull request Nov 6, 2024
…#4236)

For fields/components that uses a `fieldset` the `gap` spacing did not
apply properly:

<img width="376" alt="Screenshot 2024-11-06 at 14 21 27"
src="https://github.com/user-attachments/assets/4c289385-bf99-4b84-b1f7-d6ab7e128c08">

---

I'm not 100% sure why we not did always make the margin check. But it
should actually not effect other styles, as we now check if a spacing
class is applied or not.

When this is in main, we may add an example to #4225
@tujoworker tujoworker force-pushed the chore/add-selection-example branch 3 times, most recently from a241d05 to fd90522 Compare November 6, 2024 20:38
@tujoworker tujoworker force-pushed the chore/add-selection-example branch from fd90522 to 9cb9308 Compare November 7, 2024 10:43
@tujoworker

This comment was marked as outdated.

@langz

This comment was marked as outdated.

@langz

This comment was marked as outdated.

@tujoworker

This comment was marked as outdated.

@langz langz force-pushed the chore/add-selection-example branch from 9cb9308 to a5bcbef Compare November 8, 2024 12:22
@langz langz force-pushed the chore/add-selection-example branch from 2de3ec4 to 60c0215 Compare November 8, 2024 12:29
@langz
Copy link
Contributor Author

langz commented Nov 8, 2024

We need to rebase this PR and update the visual snapshots, after PR #4244 has been merged.

Done 🥇

@langz
Copy link
Contributor Author

langz commented Nov 8, 2024

We need to rebase this PR and update the visual snapshots, after PR #4244 has been merged.

Done 🥇

Once more, forgot Card... 😓

@tujoworker tujoworker merged commit c0f1a02 into main Nov 8, 2024
10 checks passed
@tujoworker tujoworker deleted the chore/add-selection-example branch November 8, 2024 13:16
tujoworker pushed a commit that referenced this pull request Nov 8, 2024
## [10.55.0](v10.54.1...v10.55.0) (2024-11-08)

### ⚡ Refactoring

* center cards on ultra-wide monitors and fix capitalization typo ([#4214](#4214)) ([0ec1388](0ec1388))

### 📝 Documentation

* **CountryFlag:** `iso` defaults to `NO` ([#4234](#4234)) ([cab3c32](cab3c32))
* display all Value components in the Value menu ([#4231](#4231)) ([d260a9c](d260a9c))

### 🐛 Bug Fixes

* ensure components having `fieldset` inside still can use spacing ([#4236](#4236)) ([d4e4334](d4e4334))
* **Forms:** add Iterate support for Field.PostalCodeAndCity when using `country` with a path ([#4215](#4215)) ([6f80ed9](6f80ed9)), closes [#4200](#4200)
* **Forms:** ensure `Field.Number` with `percent` and without a value renders correctly ([#4230](#4230)) ([96fa2a5](96fa2a5)), closes [#4228](#4228)
* **Forms:** fix vertical gap between Field.ArraySelection toggle buttons with checkbox variant ([#4217](#4217)) ([83f0b37](83f0b37))
* **Forms:** remove extra space from Value.* components with `inline` property ([#4246](#4246)) ([8b96fd1](8b96fd1))
* **Forms:** should display error underneath fields when nested inside Field.Selection or Field.ArraySelection   ([#4225](#4225)) ([c0f1a02](c0f1a02))
* remove legacy `fieldset` reset ([#4237](#4237)) ([a2f368b](a2f368b))
* **Upload:** alignment when displaying single DL item ([#4210](#4210)) ([5f745f5](5f745f5))
* **Upload:** fix `UploadFile` type to include `id` as required ([#4218](#4218)) ([b24fdfd](b24fdfd))

### ✨ Features

* **Card:** add style for nested cards ([#4244](#4244)) ([f45aa4a](f45aa4a))
* **Card:** remove `beta` badge ([#4211](#4211)) ([67a4fbd](67a4fbd))
* **ChildrenWithAge:** add maximum possible value to joint-responsibility & daycare ([#4219](#4219)) ([9b9c517](9b9c517))
* **CountryFlag:** add iso to properties table ([#4232](#4232)) ([9dc57cb](9dc57cb))
* **DatePicker:** Convert to functional components with typescript and hooks ([#2799](#2799)) ([45687ea](45687ea))
* **Forms:** add `layoutOptions` for enhanced horizontal label layout ([#4208](#4208)) ([8d84d97](8d84d97))
* **Forms:** add `transformLabel` to Value.Composition ([#4207](#4207)) ([c966bc1](c966bc1))
* **Forms:** add `Value.Upload` component ([#4233](#4233)) ([3adddac](3adddac))
* **Forms:** add EditButton, CancelButton and DoneButton to Form.Section containers ([#4223](#4223)) ([092abcd](092abcd))
* **ListFormat:** add `ListFormat` component ([#4238](#4238)) ([63613f1](63613f1))
* **Upload:** add `download` prop to enable file downloads instead of opening in a new tab ([#4213](#4213)) ([3e92934](3e92934))
@tujoworker
Copy link
Member

🎉 This PR is included in version 10.55.0 🎉

The release is available on:

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Development

Successfully merging this pull request may close these issues.

2 participants