Implement governance form field styling (Fixes #2656, #2657, #2659) by aonif · Pull Request #6407 · canton-network/splice

aonif · 2026-07-14T13:50:00Z

Summary

Align TextField, DateField, SelectField, and config inputs with Figma: grey (#363636) surfaces, uppercase section labels, and DateField picker pattern (KeyboardArrowDown, read-only display).

Fixes SV UI Redesign Look & Feel: Component: TextArea #2656: ProposalSummaryField / textarea styling
Fixes SV UI Redesign Look & Feel: Component: TextInput #2657: TextField single-line styling
Fixes SV UI Redesign Look & Feel: Component: ConfigurationEntry #2659: ConfigField table entry styling

Pull Request Checklist

Cluster Testing

If a cluster test is required, comment /cluster_test on this PR to request it, and ping someone with access to the DA-internal system to approve it.
If an upgrade test is required, comment /upgrade_test on this PR to request it, and ping someone with access to the DA-internal system to approve it.
If a hard-migration test is required (from the latest release), comment /hdm_test on this PR to request it, and ping someone with access to the DA-internal system to approve it.
If a logical synchronizer upgrade test is required (from canton-3.5), comment /lsu_test on this PR to request it, and ping someone with access to the DA-internal system to approve it.

PR Guidelines

Include any change that might be observable by our partners or affect their deployment in the release notes.
Specify fixed issues with Fixes #n, and mention issues worked on using #n
Include a screenshot for frontend-related PRs - see README or use your favorite screenshot tool

Merge Guidelines

Make the git commit message look sensible when squash-merging on GitHub (most likely: just copy your PR description).

aonif · 2026-07-14T13:52:46Z

@pawelperek-da

pawelperek-da · 2026-07-17T10:32:29Z

+              sx: datePickerFieldSx,
              inputProps: {
                'data-testid': `${id}-field`,
+                readOnly: true,


This will probably produce similar issue to #6397 (comment)

pawelperek-da · 2026-07-17T10:32:55Z

+                    },
                    inputProps: {
                      'data-testid': `${id}-field`,
+                      readOnly: true,


...and this too

pawelperek-da · 2026-07-17T14:03:28Z

Seem CI is failing with

2026-07-17T13:10:40.9114576Z [info]   Cause: org.openqa.selenium.ElementClickInterceptedException: Element <button id="submit-button" class="MuiButtonBase-root MuiButton-root MuiButton-pill MuiButton-pillPrimary MuiButton-sizeLarge MuiButton-pillSizeLarge MuiButton-colorPrimary Mui-disabled MuiButton-root MuiButton-pill MuiButton-pillPrimary MuiButton-sizeLarge MuiButton-pillSizeLarge MuiButton-colorPrimary css-16dhouc-MuiButtonBase-root-MuiButton-root" type="submit"> is not clickable at point (754,660) because another element <div class="MuiBox-root css-94cqfy"> obscures it
2026-07-17T13:10:40.9118212Z [info] Build info: version: '4.44.0', revision: 'da2039b'
2026-07-17T13:10:40.9119099Z [info] System info: os.name: 'Linux', os.arch: 'amd64', os.version: '6.12.85+', java.version: '21.0.10'
2026-07-17T13:10:40.9119993Z [info] Driver info: org.openqa.selenium.firefox.FirefoxDriver
2026-07-17T13:10:40.9121093Z [info] Command: [a73eec97-2c62-4bf3-8e7a-99baa7db3dcf, clickElement ***id=a7beb38a-00a5-4ae0-b3f7-75de6ef68edb***]
2026-07-17T13:10:40.9124978Z [info] Capabilities ***acceptInsecureCerts: true, browserName: firefox, browserVersion: 148.0.2, moz:accessibilityChecks: false, moz:buildID: 20260309125808, moz:geckodriverVersion: 0.36.0, moz:headless: true, moz:platformVersion: 6.12.85+, moz:processID: 14746, moz:profile: /tmp/nix-shell.x0DK7F/rust_..., moz:shutdownTimeout: 60000, moz:webdriverClick: true, moz:windowless: false, pageLoadStrategy: normal, platformName: linux, proxy: Proxy(), setWindowRect: true, strictFileInteractability: false, timeouts: ***implicit: 0, pageLoad: 300000, script: 30000***, unhandledPromptBehavior: dismiss and notify, userAgent: Mozilla/5.0 (X11; Linux x86..., webSocketUrl: ws://127.0.0.1:39989/sessio...***
2026-07-17T13:10:40.9128907Z [info] Element: [[FirefoxDriver: firefox on linux (a73eec97-2c62-4bf3-8e7a-99baa7db3dcf)] -> id: submit-button]

could you look into it?

timpel-fcs · 2026-07-17T14:44:16Z

I think the issue is with a focus change on click of the date field, basically focus shifts from the input filed to the date picker therefore not immediately allowing input. The clean options would be to remove the on click picker/limiting to the chevron or implementing a workaround for that focus change so we don't need to rely on workarounds in the test itself. Will have a look - same should then be true for the RadioSelector PR since it is using the same logic

timpel-fcs · 2026-07-20T08:29:53Z

@pawelperek-da removed custom on-click logic as it was interfering with the integration tests due to MUI focus management, picker is now limited to the chevron icon (MUI default), the rest of the field allows input

pawelperek-da

Thanks!

…ixes canton-network#2657, Fixes canton-network#2659) Align TextField, DateField, SelectField, and config inputs with Figma: grey (#363636) surfaces, uppercase section labels, and DateField picker pattern (KeyboardArrowDown, read-only display, YY-MM-DD HH:mm). - canton-network#2656: ProposalSummaryField / textarea styling - canton-network#2657: TextField single-line styling - canton-network#2659: ConfigField table entry styling Signed-off-by: Lyutskan Lyutskanov <lyutskan.lyutskanov@finoa.io>

…en (same as EffectiveDateField) Signed-off-by: Tim Pelzer <tim.pelzer@finoa.io>

… integration tests Signed-off-by: Tim Pelzer <tim.pelzer@finoa.io>

Signed-off-by: Tim Pelzer <tim.pelzer@finoa.io>

aonif temporarily deployed to ci-forks July 14, 2026 13:50 — with GitHub Actions Inactive

canton-network-da assigned isegall-da, martinflorian-da, rautenrieth-da and ray-roestenburg-da Jul 14, 2026

pawelperek-da self-requested a review July 14, 2026 20:56

LucasnFCS mentioned this pull request Jul 15, 2026

SV Governance UI Improvements / SV UI Shared Component Library - Milestone 1 canton-foundation/canton-dev-fund#529

Open

pawelperek-da reviewed Jul 17, 2026

View reviewed changes

timpel-fcs force-pushed the sv-ui/2656 branch from 9f7a88a to 2603eab Compare July 17, 2026 12:11

timpel-fcs temporarily deployed to ci-forks July 17, 2026 12:13 — with GitHub Actions Inactive

timpel-fcs temporarily deployed to ci-forks July 20, 2026 08:21 — with GitHub Actions Inactive

timpel-fcs mentioned this pull request Jul 20, 2026

Implement new RadioSelector design (issue #2655) #6397

Merged

8 tasks

pawelperek-da approved these changes Jul 24, 2026

View reviewed changes

timpel-fcs force-pushed the sv-ui/2656 branch from 1cbfd32 to ae4d634 Compare July 24, 2026 13:03

timpel-fcs had a problem deploying to ci-forks July 24, 2026 13:03 — with GitHub Actions Error

timpel-fcs force-pushed the sv-ui/2656 branch from ae4d634 to f2f7af5 Compare July 24, 2026 14:21

timpel-fcs had a problem deploying to ci-forks July 24, 2026 14:21 — with GitHub Actions Error

aonif and others added 4 commits July 28, 2026 11:40

Remove readOnly from date fields, add picker for on-click calendar op…

37529ed

…en (same as EffectiveDateField) Signed-off-by: Tim Pelzer <tim.pelzer@finoa.io>

Remove custom picker logic due to MUI focus shft interfering with the…

14658ae

… integration tests Signed-off-by: Tim Pelzer <tim.pelzer@finoa.io>

Combine sx props to prevent overwrite issues

5384106

Signed-off-by: Tim Pelzer <tim.pelzer@finoa.io>

timpel-fcs force-pushed the sv-ui/2656 branch from f2f7af5 to 5384106 Compare July 28, 2026 11:40

timpel-fcs temporarily deployed to ci-forks July 28, 2026 11:40 — with GitHub Actions Inactive

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Implement governance form field styling (Fixes #2656, #2657, #2659) - #6407

Implement governance form field styling (Fixes #2656, #2657, #2659)#6407
aonif wants to merge 4 commits into
canton-network:mainfrom
Finoa-Consensus-Services:sv-ui/2656

aonif commented Jul 14, 2026

Uh oh!

aonif commented Jul 14, 2026

Uh oh!

pawelperek-da Jul 17, 2026

Uh oh!

timpel-fcs Jul 17, 2026

Uh oh!

pawelperek-da Jul 17, 2026

Uh oh!

timpel-fcs Jul 17, 2026

Uh oh!

pawelperek-da commented Jul 17, 2026

Uh oh!

timpel-fcs commented Jul 17, 2026

Uh oh!

timpel-fcs commented Jul 20, 2026

Uh oh!

pawelperek-da left a comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

7 participants

Uh oh!

Conversation

aonif commented Jul 14, 2026

Summary

Pull Request Checklist

Cluster Testing

PR Guidelines

Merge Guidelines

Uh oh!

aonif commented Jul 14, 2026

Uh oh!

pawelperek-da Jul 17, 2026

Choose a reason for hiding this comment

Uh oh!

timpel-fcs Jul 17, 2026

Choose a reason for hiding this comment

Uh oh!

pawelperek-da Jul 17, 2026

Choose a reason for hiding this comment

Uh oh!

timpel-fcs Jul 17, 2026

Choose a reason for hiding this comment

Uh oh!

pawelperek-da commented Jul 17, 2026

Uh oh!

timpel-fcs commented Jul 17, 2026

Uh oh!

timpel-fcs commented Jul 20, 2026

Uh oh!

pawelperek-da left a comment

Choose a reason for hiding this comment

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

7 participants