chore(DataMapper): Abstract field UX redesign: UI mockup

[igarashitm]

Fixes: #3243

Storybook UI mockup for the abstract field configuration redesign.

Problem: When an abstract element in the target document is not yet substituted, all candidates appear as if they can receive mappings. Users can create mappings to any candidate, but at runtime when maxOccurs = 1, only one can exist — causing failures.

Solution: Stop rendering substitution candidates of abstract elements as children. User has to substitute it to a concrete element.

maxOccurs = 1

When maxOccurs=1, exactly one concrete element can exist at runtime. 2 options available:

• Choose one candidate — substitute the abstract element with a single concrete type. Right-click field context menu offers Select Substitution option. The selected candidate's children appear directly in the tree.
• Wrap with mapping instruction — 3-dots mapping context menu offers options such as Wrap with if or Wrap with choose-when-otherwise. Inside the mapping instruction item, user can conditionally assign substitution.

Right-click on a substituted field offers Reset Substitution to reset the substitution.

Screencast.From.2026-06-01.15-16-54.mp4

maxOccurs > 1

When maxOccurs > 1 (collection), the abstract element can contain multiple instances of mixed concrete types. The collection field offers Duplicate Field in 3-dots mapping context menu. The substitution could be applied on each duplicated abstract field to create mappings for each static substitution.
Mapping instructions allow creating more complex mapping. For example, the 2nd half of the following screencast demonstrates that combination of for-each and choose-when-otherwise mapping instructions can assign concrete substitutions conditionally in a iteration.

Screencast.From.2026-06-01.15-33-22.mp4

Many Candidates (more than 10)

An abstract element with more than 10 substitution candidates. The configuration modal includes a SearchInput to filter through the candidate list.

Screencast.From.2026-06-01.15-38-17.mp4

[coderabbitai]

Important

Review skipped

Draft detected.

Please check the settings in the CodeRabbit UI or the .coderabbit.yaml file in this repository. To trigger a single review, invoke the @coderabbitai review command.

⚙️ Run configuration

Configuration used: Organization UI

Review profile: CHILL

Plan: Pro

Run ID: 6f958e1f-d26d-4cb4-b9cf-a80b27d44126

You can disable this status message by setting the reviews.review_status to false in the CodeRabbit configuration file.

Use the checkbox below for a quick retry:

• 🔍 Trigger review

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests

---

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands and usage tips.}

[codecov]

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 92.40%. Comparing base (7e720a4) to head (388a7f0).

Additional details and impacted files

@@           Coverage Diff            @@
##             main    #3244    +/-   ##
========================================
  Coverage   92.40%   92.40%            
========================================
  Files         642      642            
  Lines       25106    25106            
  Branches     5954     5744   -210     
========================================
  Hits        23198    23198            
- Misses       1798     1906   +108     
+ Partials      110        2   -108     

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:

• ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.

[sonarqubecloud]

Quality Gate passed

Issues
0 New issues
0 Accepted issues

Measures
0 Security Hotspots
0.0% Coverage on New Code
0.0% Duplication on New Code

See analysis details on SonarQube Cloud