Implement new form features

Extends existing functionality, provides new fallbacks for translations and adds capabilities to manage array properties in configurations.

Committed-by: Florian Scholdei <florian.scholdei@cloudogu.com>
Co-authored-by: Florian Scholdei <florian.scholdei@cloudogu.com>

scm-ui/ui-forms/src/FormRow.tsx

@@ -24,13 +24,26 @@
 
 import React, { HTMLProps } from "react";
 import classNames from "classnames";
+import styled from "styled-components";
+
+const FormRowDiv = styled.div`
+  .field {
+    margin-left: 0;
+  }
+
+  gap: 1rem;
+
+  &:not(:last-child) {
+    margin-bottom: 1rem;
+  }
+`;
 
 const FormRow = React.forwardRef<HTMLDivElement, HTMLProps<HTMLDivElement>>(
   ({ className, children, hidden, ...rest }, ref) =>
     hidden ? null : (
-      <div ref={ref} className={classNames("columns", className)} {...rest}>
+      <FormRowDiv ref={ref} className={classNames("is-flex is-flex-wrap-wrap", className)} {...rest}>
         {children}
-      </div>
+      </FormRowDiv>
     )
 );