Added layout options for checkboxes and radio(row/column)

[Ailol]

Description

Due to requests from users of manually deciding for layout style in radio and checkboxes, it now supports
column or row direction. However it does not support multicolumns, but only a single column.

layout option added for radio and checkboxes. App developers can explicitly decide if these items should be laid out on a row, or as a column. The default is still less than 3 options it will be displayed as a row.

{
  "layout": "column" | "row" | undefined
}

LayoutStyle enum is added with Row and Column options. This is to make it easier to extend in the future if we want to introduce f.ex Grid layout.

Fixes

• Able to configure option stacking direction of radiobuttons/checkboxes #5730

Verification

• Your code builds clean without any errors or warnings
• Manual testing done (required)
• Relevant automated test added (if you find this hard, leave it and we'll help out)
• All tests run green

Documentation

• User documentation is updated with a separate linked PR in altinn-studio-docs. (if applicable)
• Changelog is updated with a separate linked PR
  • altinn-app-frontend- (if applicable)
  • nuget-packages - (if applicable)

[Ailol]

Some code not included

[lgtm-com]

This pull request introduces 1 alert when merging 235c6b9 into 439f58b - view on LGTM.com

new alerts:

• 1 for Unused variable, import, function or class

[lgtm-com]

This pull request introduces 1 alert when merging 9f18d7b into 8dcca8f - view on LGTM.com

new alerts:

• 1 for Unused variable, import, function or class

[haakemon]

@lorang92 I think this is ready to go now. WDYT about naming, is it ok? We also discussed using Horizontal and Vertical instead, but I'm not sure whats best.

[haakemon]

/azp run

[azure-pipelines]

You have several pipelines (over 10) configured to build pull requests in this repository. Specify which pipelines you would like to run by using /azp run [pipelines] command. You can specify multiple pipelines using a comma separated list.

[lorang92]

@haakemon code looks great. The naming part is difficult, I'm ok with both suggestions really.

Would be very neat if app developers could configure row/column layout in studio, but maybe that can be done as a separate issue?

And finally, I think we should create a new issue to support column-based options as mentioned by DAT.

[lorang92]

Nice! 🥳

[haakemon]

Studio implementation should be a separate issue: #8310
Multi column layout: Altinn/app-frontend-react#126

Ill add some PR's soon with updated docs and updated json schema for this feature.

[sonarqubecloud]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
0 Code Smells

95.6% Coverage
0.0% Duplication