Merge pull request #38 from qlik-oss/DEB-157/NineMeasures

1 Dim and 9 Measures OR 2 Dim and 8 Measures

src/headers-table/measurement-column-header.jsx

@@ -6,7 +6,7 @@ import Tooltip from '../tooltip/index.jsx';
 const MeasurementColumnHeader = ({ baseCSS, general, hasSecondDimension, measurement, styling }) => {
   const title = `${measurement.name} ${measurement.magnitudeLabelSuffix}`;
   const { fontSizeAdjustment } = styling.headerOptions;
-  const isMediumFontSize = fontSizeAdjustment === HEADER_FONT_SIZE.MEDIUM;
+  const isMediumFontSize = styling.headerOptions.fontSizeAdjustment === HEADER_FONT_SIZE.MEDIUM;
 
   if (hasSecondDimension) {
     const isPercentageFormat = measurement.format.substring(measurement.format.length - 1) === '%';
@@ -20,7 +20,7 @@ const MeasurementColumnHeader = ({ baseCSS, general, hasSecondDimension, measure
       ...baseCSS,
       cursor: 'default',
       fontSize: `${baseFontSize + fontSizeAdjustment}px`,
-      height: isMediumFontSize ? '40px' : '25px',
+      height: isMediumFontSize ? '50px' : '25px',
       verticalAlign: 'middle'
     };
     return (
@@ -39,8 +39,7 @@ const MeasurementColumnHeader = ({ baseCSS, general, hasSecondDimension, measure
     );
   }
 
-  const isLong = (title.length > 11 && fontSizeAdjustment === HEADER_FONT_SIZE.SMALL)
-    || (title.length > 12 && fontSizeAdjustment === HEADER_FONT_SIZE.MEDIUM);
+  const isLong = (title.length > 11 && fontSizeAdjustment === 0) || (title.length > 12 && fontSizeAdjustment === -2);
   const suffixWrap = isLong ? '70' : 'empty';
   const style = {
     ...baseCSS,

src/index.js

@@ -20,12 +20,16 @@ export default {
   },
   data: {
     dimensions: {
-      max: 3,
+      max: function (nMeasures) {
+        return nMeasures < 9 ? 2 : 1;
+      },
       min: 1,
       uses: 'dimensions'
     },
     measures: {
-      max: 8,
+      max: function (nDims) {
+        return nDims < 2 ? 9 : 8;
+      },
       min: 1,
       uses: 'measures'
     }

src/initialize-transformed.js

@@ -18,7 +18,8 @@ function getAlignment (option) {
 function getFontSizeAdjustment (option) {
   const fontSizeAdjustmentOptions = {
     1: HEADER_FONT_SIZE.SMALL,
-    2: HEADER_FONT_SIZE.MEDIUM
+    2: HEADER_FONT_SIZE.MEDIUM,
+    3: 2
   };
 
   return fontSizeAdjustmentOptions[option] || 0;

src/main.less

@@ -87,6 +87,14 @@
     text-overflow: ellipsis;
   }
 
+  .wrapclass45 {
+    width: 100%;
+    height: 45px;
+    white-space: pre-line;
+    overflow: hidden;
+    display: block;
+  }
+
   .wrapclass70 {
     width: 100%;
     height: 70px;