Merge pull request #610 from shopgate/PWA-1834-6x

Avoid screen overflow for select form element
shopgate · Apr 9, 2019 · 8260ec1 · 8260ec1
2 parents 4c3a89d + aa55516
commit 8260ec1
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 16 deletions.
diff --git a/libraries/ui-shared/Form/Builder/index.jsx b/libraries/ui-shared/Form/Builder/index.jsx
@@ -112,6 +112,17 @@ class Builder extends Component {
     const countryElement = this.formElements.find(el => el.type === ELEMENT_TYPE_COUNTRY);
     if (countryElement) {
       this.countryList = buildCountryList(countryElement, emptySelectOption);
+      const provinceElement = this.formElements.find(el => el.type === ELEMENT_TYPE_PROVINCE);
+      if (provinceElement
+        && provinceElement.required
+        && !!formDefaults[countryElement.id]
+        && !formDefaults[provinceElement.id]) {
+        // Set default for province field for given country
+        const [first] = Object.values(buildProvinceList(formDefaults[countryElement.id]));
+        if (first) {
+          this.state.formData[provinceElement.id] = first;
+        }
+      }
     }
 
     // Final form initialization, by triggering actionListeners and enable rendering for elements

diff --git a/libraries/ui-shared/Form/Builder/iso-3166-2.js b/libraries/ui-shared/Form/Builder/iso-3166-2.js
@@ -435,19 +435,17 @@ export default {
   BE: {
     name: 'Belgium',
     divisions: {
-      'BRU': 'Bruxelles-Capitale, Region de (fr), Brussels Hoofdstedelijk Gewest (nl)',
-      'VLG': 'Vlaamse Gewest (nl)',
-      'VAN': 'Antwerpen (nl)',
-      'VLI': 'Limburg (nl)',
-      'VOV': 'Oost-Vlaanderen (nl)',
-      'VBR': 'Vlaams Brabant (nl)',
-      'VWV': 'West-Vlaanderen (nl)',
-      'WAL': 'Wallonne, Region (fr)',
-      'WBR': 'Brabant Wallon (fr)',
-      'WHT': 'Hainaut (fr)',
-      'WLG': 'Liège (fr)',
-      'WLX': 'Luxembourg (fr)',
-      'WNA': 'Namur (fr)',
+      'BRU': 'Brussels',
+      'VAN': 'Antwerpen',
+      'VLI': 'Limburg',
+      'VOV': 'Oost-Vlaanderen',
+      'VBR': 'Vlaams Brabant',
+      'VWV': 'West-Vlaanderen',
+      'WBR': 'Brabant Wallon',
+      'WHT': 'Hainaut',
+      'WLG': 'Liège',
+      'WLX': 'Luxembourg',
+      'WNA': 'Namur',
     },
   },
   BZ: {

diff --git a/libraries/ui-shared/Form/Select/__snapshots__/spec.jsx.snap b/libraries/ui-shared/Form/Select/__snapshots__/spec.jsx.snap
@@ -66,7 +66,7 @@ exports[`<Select /> should render select with 1 selected option 1`] = `
         </label>
       </Label>
       <select
-        className="css-x8w2oy"
+        className="css-zao20y"
         id="test-name"
         name="test-name"
         onBlur={[Function]}
@@ -191,7 +191,7 @@ exports[`<Select /> should render select with 2 options 1`] = `
         </label>
       </Label>
       <select
-        className="css-x8w2oy"
+        className="css-zao20y"
         id="test-name"
         name="test-name"
         onBlur={[Function]}
@@ -311,7 +311,7 @@ exports[`<Select /> should render select with no options 1`] = `
         </label>
       </Label>
       <select
-        className="css-x8w2oy"
+        className="css-zao20y"
         id="test-name"
         name="test-name"
         onBlur={[Function]}

diff --git a/libraries/ui-shared/Form/Select/style.js b/libraries/ui-shared/Form/Select/style.js
@@ -3,6 +3,9 @@ import { css } from 'glamor';
 const select = css({
   appearance: 'none',
   position: 'relative',
+  overflow: 'hidden',
+  whiteSpace: 'nowrap',
+  textOverflow: 'ellipsis',
   padding: 0,
   width: '100%',
   margin: '24px 0 0 0',