@sis-cc/dotstatsuite-components 21.0.1 → 21.1.0

package/src/rules/src/chart/getAxisOptions.js

@@ -1,258 +0,0 @@
-import * as R from 'ramda';
-import numeral from 'numeral';
-import dateFns from 'date-fns';
-import isMonday from 'date-fns/is_monday';
-import isTuesday from 'date-fns/is_tuesday';
-import isWednesday from 'date-fns/is_wednesday';
-import isThursday from 'date-fns/is_thursday';
-import isFriday from 'date-fns/is_friday';
-import isSaturday from 'date-fns/is_saturday';
-import isSunday from 'date-fns/is_sunday';
-import getISOWeek from 'date-fns/get_iso_week';
-import { getLocale, dateWithoutTZ } from '../date';
-import {
-  BAR,
-  CHORO,
-  H_SYMBOL,
-  ROW,
-  SCATTER,
-  STACKED_BAR,
-  STACKED_ROW,
-  TIMELINE,
-  V_SYMBOL
-} from '../constants';
-
-const defaultTimeFormats = {
-  A: 'YYYY',
-  S: 'YYYY-[S][SEMESTER]',
-  Q: 'YYYY-[Q]Q',
-  M: 'YYYY-MMM',
-  W: 'YYYY-[W]WW',
-  B: 'YYYY-[W]WW',
-  D: 'YYYY-MM-DD',
-  H: 'YYYY-MM-DD[T]HH:mm:ss',
-  N: 'YYYY-MM-DD[T]HH:mm:ss',
-};
-
-export const getTimeProc = (frequency, timeFormats = {}, locale) => {
-  if (frequency === 'W' || frequency === 'B') {
-    return datum => {
-      const isoWeek = getISOWeek(datum);
-      if (isoWeek !== 1) {
-        return dateFns.format(datum, 'YYYY-[W]WW', { locale: getLocale(locale) })
-      }
-      const seventhDay = dateFns.endOfWeek(datum, { weekStartsOn: 1 });
-      return dateFns.format(seventhDay, 'YYYY-[W]WW', { locale: getLocale(locale) })
-    }
-  }
-  const format = R.pipe(
-    R.mergeRight(defaultTimeFormats),
-    R.ifElse(
-      R.has(frequency),
-      R.prop(frequency),
-      R.prop('A')
-    )
-  )(timeFormats);
-  return datum => dateFns.format(dateWithoutTZ(new Date(datum)), format, { locale: getLocale(locale) });
-};
-
-const getTimeFrequency = (data) => {
-  const frequency = R.prop('frequency', data);
-  if (frequency === 'W' || frequency === 'B') {
-    const date = R.pathOr(['series', 0, 'datapoints', 'x']);
-    return R.cond([
-      [isMonday, R.always('monday')],
-      [isTuesday, R.always('tueday')],
-      [isWednesday, R.always('wednesday')],
-      [isThursday, R.always('thursday')],
-      [isFriday, R.always('friday')],
-      [isSaturday, R.always('saturday')],
-      [isSunday, R.always('sunday')],
-      [R.T, R.always('monday')],
-    ])(date);
-  }
-  return R.cond([
-    [R.equals('A'), R.always('year')],
-    [R.equals('S'), R.always('month')],
-    [R.equals('Q'), R.always('month')],
-    [R.equals('M'), R.always('month')],
-    [R.equals('D'), R.always('day')],
-    [R.equals('H'), R.always('hour')],
-    [R.equals('N'), R.always('minute')],
-    [R.T, R.always('year')],
-  ])(frequency);
-};
-
-const getTimeStep = R.cond([
-  [R.equals('A'), R.always(1)],
-  [R.equals('S'), R.always(6)],
-  [R.equals('Q'), R.always(3)],
-  [R.equals('M'), R.always(1)],
-  [R.equals('W'), R.always(1)],
-  [R.equals('B'), R.always(1)],
-  [R.equals('D'), R.always(1)],
-  [R.equals('H'), R.always(1)],
-  [R.equals('N'), R.always(1)],
-  [R.T, R.always(1)],
-]);
-
-export const getAxisOptions = (data, type, options, timeFormats, locale) => {
-
-  const axis = {
-    linear: { pivot: { color: 'white' } },
-    ordinal: { gap: .3, padding: .3 },
-    thickness: 0,
-  };
-
-  const linearProc = d => numeral(d).format('0,0.[00]');
-
-  return R.pipe(
-    R.propOr({}, 'axis'),
-    R.mergeDeepRight({ x: axis, y: axis }),
-    R.cond([
-      [
-        R.always(R.equals(BAR, type)),
-        R.pipe(
-          R.mergeDeepRight({
-            x: { format: { proc: R.identity }, tick: { thickness: 0, size: 0 } },
-            y: {
-              font: { baseline: 'ideographic' },
-              format: { proc: linearProc },
-              padding: 10,
-              tick: { thickness: 0 },
-            }
-          }),
-          R.over(R.lensPath(['y', 'linear', 'pivot', 'value']), R.when(R.isNil, R.always(0)))
-        )
-      ],
-      [
-        R.always(R.equals(ROW, type)),
-        R.pipe(
-          R.mergeDeepRight({
-            x: {
-              format: { proc: linearProc },
-              orient: 'top',
-              padding: 10,
-              tick: { thickness: 0 },
-            },
-            y: {
-              format: { proc: R.identity },
-              ordinal: { minDisplaySize: 300 },
-              tick: { thickness: 0, size: 0 },
-            }
-          }),
-          R.over(R.lensPath(['x', 'linear', 'pivot', 'value']), R.when(R.isNil, R.always(0)))
-        )
-      ],
-      [
-        R.always(R.equals(SCATTER, type)),
-        R.mergeDeepRight({
-          x: {
-            format: { proc: linearProc },
-            tick: { thickness: 0, size: 0 },
-          },
-          y: {
-            font: { baseline: 'ideographic' },
-            format: { proc: linearProc },
-            padding: 10,
-            tick: { thickness: 0 },
-          }
-        })
-      ],
-      [
-        R.always(R.equals(TIMELINE, type)),
-        R.pipe(
-          R.mergeDeepRight({
-            x: {
-              format: {
-                isTime: true,
-                pattern: null,
-                proc: getTimeProc(R.prop('frequency', data), timeFormats, locale)
-              },
-              tick: { size: -6, minorSize: -3, thickness: 2, minorThickness: 2, color: 'white' },
-            },
-            y: {
-              font: { baseline: 'ideographic' },
-              format: { proc: d => numeral(d).format('0,0.[00]') },
-              padding: 10,
-              tick: { thickness: 0 },
-            }
-          }),
-          R.evolve({
-            x: R.pipe(
-              R.set(R.lensPath(['linear', 'frequency']), getTimeFrequency(data)),
-              R.set(R.lensPath(['linear', 'step']), getTimeStep(R.prop('frequency', data))),
-              R.over(
-                R.lensPath(['tick', 'step']),
-                R.pipe(R.when(R.isNil, R.always(1)), R.multiply(getTimeStep(R.prop('frequency', data))))
-              )
-            )
-          })
-        )
-      ],
-      [
-        R.always(R.equals(H_SYMBOL, type)),
-        R.mergeDeepRight({
-          x: {
-            format: { proc: linearProc },
-            orient: 'top',
-            padding: 10,
-            tick: { thickness: 0 },
-          },
-          y: {
-            format: { proc: R.identity },
-            ordinal: { minDisplaySize: 300 },
-            tick: { thickness: 0, size: 5 },
-          }
-        })
-      ],
-      [
-        R.always(R.equals(V_SYMBOL, type)),
-        R.mergeDeepRight({
-          x: { format: { proc: R.identity }, tick: { thickness: 0, size: 0 } },
-          y: {
-            font: { baseline: 'ideographic' },
-            format: { proc: linearProc },
-            padding: 10,
-            tick: { thickness: 0 },
-          }
-        })
-      ],
-      [
-        R.always(R.equals(STACKED_BAR, type)),
-        R.pipe(
-          R.mergeDeepRight({
-            x: { format: { proc: R.identity }, tick: { thickness: 0, size: 0 } },
-            y: {
-              font: { baseline: 'ideographic' },
-              format: { proc: linearProc },
-              padding: 10,
-              tick: { thickness: 0 },
-            }
-          }),
-          R.over(R.lensPath(['y', 'linear', 'pivot', 'value']), R.when(R.isNil, R.always(0)))
-        )
-      ],
-      [
-        R.always(R.equals(STACKED_ROW, type)),
-        R.pipe(
-          R.mergeDeepRight({
-            x: {
-              format: { proc: linearProc },
-              orient: 'top',
-              padding: 10,
-              tick: { thickness: 0 },
-            },
-            y: {
-              format: { proc: R.identity },
-              ordinal: { minDisplaySize: 300 },
-              tick: { thickness: 0, size: 0 }
-            }
-          }),
-          R.over(R.lensPath(['x', 'linear', 'pivot', 'value']), R.when(R.isNil, R.always(0)))
-        )
-      ],
-      [R.T, R.identity]
-    ])
-  )(options);
-};

package/src/rules/src/chart/getBaseOptions.js

@@ -1,84 +0,0 @@
-import * as R from 'ramda';
-import {
-  BAR,
-  CHORO,
-  H_SYMBOL,
-  ROW,
-  SCATTER,
-  STACKED_BAR,
-  STACKED_ROW,
-  TIMELINE,
-  V_SYMBOL
-} from '../constants';
-
-export const getBaseOptions = (type, options) => R.pipe(
-  R.propOr({}, 'base'),
-  R.cond([
-    [
-      R.always(R.equals(BAR, type)),
-      R.mergeDeepRight({
-        minDisplayHeight: 100,
-        minDisplayWidth: 300,
-        padding: { top: 20 },
-        innerPadding: { left: 20, right: 20, bottom: 10 }
-      })
-    ],
-    [
-      R.always(R.equals(ROW, type)),
-      R.mergeDeepRight({
-        minDisplayHeight: 300,
-        minDisplayWidth: 100,
-        padding: { top: 10, left: 10, right: 20 }
-      })
-    ],
-    [
-      R.always(R.equals(SCATTER, type)),
-      R.mergeDeepRight({
-        minDisplayHeight: 100,
-        minDisplayWidth: 100,
-        padding: { top: 40, right: 10 }
-      })
-    ],
-    [
-      R.always(R.equals(TIMELINE, type)),
-      R.mergeDeepRight({
-        minDisplayHeight: 300,
-        minDisplayWidth: 100,
-        isAnnotated: false,
-        padding: { top: 20 },
-        innerPadding: { left: 40, right: 40 }
-      })
-    ],
-    [
-      R.always(R.equals(H_SYMBOL, type)),
-      R.mergeDeepRight({
-        minDisplayHeight: 300,
-        minDisplayWidth: 100,
-        padding: { top: 10, left: 10, right: 20 }
-      })
-    ],
-    [
-      R.always(R.equals(V_SYMBOL, type)),
-      R.mergeDeepRight({
-        minDisplayHeight: 100,
-        minDisplayWidth: 300,
-        padding: { top: 20 },
-        innerPadding: { left: 20, right: 20, bottom: 10 }
-      })
-    ],
-    [
-      R.always(R.equals(STACKED_BAR, type)),
-      R.mergeDeepRight({
-        minDisplayHeight: 100,
-        minDisplayWidth: 300,
-        padding: { top: 20 },
-        innerPadding: { left: 20, right: 20, bottom: 10 }
-      })
-    ],
-    [
-      R.always(R.equals(STACKED_ROW, type)),
-      R.mergeDeepRight({ padding: { top: 10, left: 10, right: 20 } })
-    ],
-    [R.T, R.identity]
-  ])
-)(options);

package/src/rules/src/chart/getChartOptions.js

@@ -1,118 +0,0 @@
-import * as R from 'ramda'; 
-import numeral from 'numeral';
-import { getAxisOptions } from './getAxisOptions';
-import { getBaseOptions } from './getBaseOptions';
-import { getGridOptions } from './getGridOptions';
-import { getTooltipOptions } from './getTooltipOptions';
-import { SCATTER, STACKED_BAR, STACKED_ROW, TIMELINE } from '../constants';
-
-export const FOCUS_COLORS = {
-  highlightColors: ['#E73741', '#0F8FD9', '#993484', '#DF521E', '#719E24', '#E1B400', '#32A674', '#0B68AF'],
-  baselineColors: ['#0B1E2D']
-};
-
-export const symbolMarkers = () => {
-  const paths = {
-    circle: size => {
-      const r = Math.sqrt(size) / 2;
-      return `M0,${r} A${r},${r} 0 1,1 0,${-r} A${r},${r} 0 1,1 0,${r} Z`;
-    },
-    square: size => {
-      const r = Math.sqrt(size) / 2;
-      return `M${-r},${-r} L${r},${-r} ${r},${r} ${-r},${r} Z`;
-    },
-    cross: size => {
-      const r = Math.sqrt(size) / 2;
-      return `M${-r},${r} L${r},${-r} M${r},${r} L${-r},${-r}`;
-    },
-    'triangle': size => {
-      const rx = Math.sqrt(size) / Math.sqrt(3);
-      const ry = Math.sqrt(size) / 2;
-      return `M0,${-ry} L${rx},${ry} ${-rx},${ry} Z`;
-    }
-  }
-  return ([
-    { style: { stroke: '#39617D', fill: '#39617D' }, path: paths.circle },
-    { style: { stroke: '#39617D', fill: '#DBEBF2' }, rotate: 45, path: paths.square },
-    { style: { stroke: '#39617D', fill: '#39617D', strokeWidth: 2 }, path: paths.cross },
-    { style: { stroke: '#39617D', fill: '#DBEBF2' }, path: paths.square },
-    { style: { stroke: '#39617D', fill: '#39617D' }, path: paths.triangle }
-  ]);
-};
-
-const getAnnotationOptions = (type, options) => R.pipe(
-  R.pathOr({}, ['serie', 'annotation']),
-  R.mergeRight({
-    format: {
-      datapoint: { proc: d => numeral(d).format('0,0.[00]') }
-    }
-  }),
-  R.cond([
-    [
-      R.always(R.equals(SCATTER, type)),
-      R.mergeRight({ display: 'never' })
-    ],
-    [
-      R.always(R.equals(TIMELINE, type)),
-      R.mergeDeepRight({ format: { datapoint: { pattern: '.2f' } } })
-    ],
-    [R.T, R.identity]
-  ])
-)(options);
-
-export const getChartOptions = (data, type, options, tooltipFonts, timeFormats, locale) => {
-  const defaultSerieColors = R.ifElse(
-    R.anyPass([R.equals(STACKED_BAR), R.equals(STACKED_ROW)]),
-    R.always(['#607D8B']),
-    R.always(['#8EA4B1'])
-  )(type);
-
-  return ({
-    axis: getAxisOptions(data, type, options, timeFormats, locale),
-    background: R.pipe(
-      R.propOr({}, 'background'),
-      R.mergeRight({ color: '#DBEBF2' })
-    )(options),
-    base: getBaseOptions(type, options),
-    grid: getGridOptions(type, options),
-    map: R.pipe(
-      R.propOr({}, 'map'),
-      R.mergeRight({ intBoundariesColor: '#8EA4B1' })
-    )(options),
-    serie: {
-      ...R.propOr({}, 'serie', options),
-      annotation: getAnnotationOptions(type, options),
-      choropleth: R.pipe(
-        R.pathOr({}, ['serie', 'choropleth']),
-        R.mergeRight({
-          divisions: 4,
-          domain: 'YlorRd',
-          invert: false,
-          labelDisplay: 'none',
-        })
-      )(options),
-      stacked: R.pipe(
-        R.pathOr({}, ['serie', 'stacked']),
-        R.mergeRight({ strokeThickness: 1, strokeColor: '#F8FAFC' })
-      )(options),
-      symbol: R.pipe(
-        R.pathOr({}, ['serie', 'symbol']),
-        R.mergeRight({
-          markers: symbolMarkers(),
-          markerDefaultSize: 60,
-          markerDefaultStrokeWidth: 1,
-          gapMinMaxColor: '#607D8B',
-          gapMinMaxThickness: 1,
-          gapAxisMinColor: 'white',
-          gapAxisMinThickness: 1
-        })
-      )(options),
-      colors: R.pathOr(defaultSerieColors, ['serie', 'colors'], options),
-      overColors: R.pathOr(['#39617D'], ['serie', 'overColors'], options),
-      highlightColors: R.pathOr(FOCUS_COLORS.highlightColors, ['serie', 'highlightColors'], options),
-      baselineColors: R.pathOr(FOCUS_COLORS.baselineColors, ['serie', 'baselineColors'], options),
-      tooltip: getTooltipOptions(data, type, options, tooltipFonts, timeFormats, locale)
-    }
-  });
-};
-

package/src/rules/src/chart/getGridOptions.js

@@ -1,52 +0,0 @@
-import * as R from 'ramda';
-import {
-  BAR,
-  CHORO,
-  H_SYMBOL,
-  ROW,
-  STACKED_BAR,
-  STACKED_ROW,
-  TIMELINE,
-  V_SYMBOL
-} from '../constants';
-
-export const getGridOptions = (type, options) => {
-  const grid = { baselines: [0], color: 'white' };
-  const hideGrid = R.assoc('thickness', 0);
-
-  return R.pipe(
-    R.propOr({}, 'grid'),
-    R.mergeDeepRight({ x: grid, y: grid }),
-    R.cond([
-      [
-        R.always(R.equals(BAR, type)),
-        R.mergeDeepRight({ x: { thickness: 0 } })
-      ],
-      [
-        R.always(R.equals(ROW, type)),
-        R.mergeDeepRight({ y: { thickness: 0 } })
-      ],
-      [
-        R.always(R.equals(TIMELINE, type)),
-        R.mergeDeepRight({ x: { thickness: 0 } })
-      ],
-      [
-        R.always(R.equals(H_SYMBOL, type)),
-        R.mergeDeepRight({ y: { thickness: 0 } })
-      ],
-      [
-        R.always(R.equals(V_SYMBOL, type)),
-        R.mergeDeepRight({ x: { thickness: 0 } })
-      ],
-      [
-        R.always(R.equals(STACKED_BAR, type)),
-        R.mergeDeepRight({ x: { thickness: 0 } })
-      ],
-      [
-        R.always(R.equals(STACKED_ROW, type)),
-        R.mergeDeepRight({ y: { thickness: 0 } })
-      ],
-      [R.T, R.identity]
-    ])
-  )(options);
-};