@sis-cc/dotstatsuite-components 23.2.0 → 24.0.0

package/src/rules/src/chart/getTooltipOptions.js

@@ -1,230 +0,0 @@
-import * as R from 'ramda';
-import numeral from 'numeral';
-import { format } from 'date-fns';
-import {
-  BAR,
-  CHORO,
-  H_SYMBOL,
-  ROW,
-  SCATTER,
-  STACKED_BAR,
-  STACKED_ROW,
-  TIMELINE,
-  V_SYMBOL
-} from '../constants';
-import { getTimeProc } from './getAxisOptions';
-
-export const getTooltipOptions =  (data, type, options, fonts={}, timeFormats={}, locale) => {
-  const primaryFonts = (color) => (`
-    font-size: ${R.pathOr(12, ['primary', 'fontSize'], fonts)}px;
-    font-family: ${R.pathOr('inherit', ['primary', 'fontFamily'], fonts)};
-    font-weight: ${R.pathOr('normal', ['primary', 'fontWeight'], fonts)};
-    color: ${color};
-    padding: 5px;
-    border: 1px solid ${color};
-    background: white;
-    opacity: .8;
-  `);
-
-  const secondaryFonts = `
-    font-family: ${R.pathOr('inherit', ['secondary', 'fontFamily'], fonts)};
-    font-size: ${R.pathOr(12, ['secondary', 'fontSize'], fonts)}px;
-    font-weight: ${R.pathOr('normal', ['secondary', 'fontWeight'], fonts)};
-  `;
-
-  const valueFormatter = d => numeral(d).format('0,0.[00]');
-
-  const timeFormatter = R.pipe(
-    R.prop('frequency'),
-    freq => getTimeProc(freq, timeFormats, locale),
-    R.when(
-      R.anyPass([R.isNil, R.complement(R.is)(Function)]),
-      R.always(date => format(date, 'MMM YY'))
-    )
-  )(data);
-
-  return R.pipe(
-    R.pathOr({}, ['serie', 'tooltip']),
-    R.cond([
-      [
-        R.always(R.equals(BAR, type)),
-        R.mergeRight({
-          layout: (serie, datum, color) => (`
-            <div style="${primaryFonts(color)}">
-              <div style="text-align: right;">
-                ${datum.x}
-              </div>
-              <div style="text-align: right; ${secondaryFonts}">
-                ${datum.formatedValue || valueFormatter(datum.y)}
-              </div>
-            </div>
-          `)
-        })
-      ],
-      [
-        R.always(R.equals(ROW, type)),
-        R.mergeRight({
-          layout: (serie, datum, color) => (`
-            <div style="${primaryFonts(color)}">
-              <div style="text-align: right;">
-                ${datum.y}
-              </div>
-              <div style="text-align: right; ${secondaryFonts}">
-                ${datum.formatedValue || valueFormatter(datum.x)}
-              </div>
-            <div>
-          `)
-        })
-      ],
-      [
-        R.always(R.equals(SCATTER, type)),
-        R.mergeRight({
-          layout: (serie, datum, color) => (`
-            <div style="${primaryFonts(color)}">
-              <div style="text-align: right;">
-                ${R.pipe(R.propOr({}, 'dimensionValues'), R.values, R.pluck('name'), R.join(' '))(datum)}
-              </div>
-              <div style="text-align: right;">
-                ${R.path(['dimensionValues', 'x', 'name'], serie)}
-                <span style="${secondaryFonts}">
-                  ${datum.xFormat || valueFormatter(datum.x)}
-                </span>
-              </div>
-              <div style="text-align: right;">
-                ${R.path(['dimensionValues', 'y', 'name'], serie)}
-                <span style="${secondaryFonts}">
-                  ${datum.yFormat || valueFormatter(datum.y)}
-                </span>
-              </div>
-            </div>
-          `)
-        })
-      ],
-      [
-        R.always(R.equals(TIMELINE, type)),
-        R.mergeRight({
-          layout: (serie, datum, color) => (`
-            <div style="${primaryFonts(color)}">
-              <div style="text-align: right;">
-                ${R.pipe(R.propOr({}, 'dimensionValues'), R.values, R.pluck('name'), R.join('<br />'))(datum)}
-              </div>
-              <div style="text-align: right;">
-                ${datum.timeLabel}
-              </div>
-              <div style="text-align: right; ${secondaryFonts}">
-                ${datum.formatedValue || valueFormatter(datum.y)}
-              </div>
-            </div>
-          `)
-        })
-      ],
-      [
-        R.always(R.equals(H_SYMBOL, type)),
-        R.mergeRight({
-            layout: (serie, datum, color) => (`
-              <div style="${primaryFonts(color)}">
-                <div style="text-align: right;">
-                  ${datum.y}
-                  <br />
-                  ${datum.symbolValue}
-                </div>
-                <div style="text-align: right; ${secondaryFonts}">
-                  ${datum.formatedValue || valueFormatter(datum.x)}
-                </div>
-              </div>
-            `)
-          })
-      ],
-      [
-        R.always(R.equals(V_SYMBOL, type)),
-        R.mergeRight({
-          layout: (serie, datum, color) => (`
-            <div style="${primaryFonts(color)}">
-              <div style="text-align: right;">
-                ${datum.x}
-                <br />
-                ${datum.symbolValue}
-              </div>
-              <div style="text-align: right; ${secondaryFonts}">
-                ${datum.formatedValue || valueFormatter(datum.y)}
-              </div>
-            </div>
-          `)
-        })
-      ],
-      [
-        R.always(R.equals(STACKED_BAR, type)),
-        R.mergeRight({
-          layout: (serie, datum, color) => (`
-            <div style="${primaryFonts(color)}">
-              <div style="text-align: right;">
-                ${datum.x}
-              </div>
-              <div style="text-align: right;">
-                ${datum.layerLabel}
-              </div>
-              <div style="text-align: right; font-size: ${R.pathOr(12, ['secondary', 'fontSize'], fonts)}px;">
-                Value:
-                <span style="${secondaryFonts}">
-                  ${R.is(Function, datum.formater) ? datum.formater(datum.height) : valueFormatter(datum.height)}
-                </span>
-              </div>
-              <div style="text-align: right; font-size: ${R.pathOr(12, ['secondary', 'fontSize'], fonts)}px;">
-                Cumulated:
-                <span style="${secondaryFonts}">
-                  ${R.is(Function, datum.formater) ? datum.formater(datum.y) : valueFormatter(datum.y)}
-                </span>
-              </div>
-            </div>
-          `)
-        })
-      ],
-      [
-        R.always(R.equals(STACKED_ROW, type)),
-        R.mergeRight({
-          layout: (serie, datum, color) => (`
-            <div style="${primaryFonts(color)}">
-              <div style="text-align: right;">
-                ${datum.y}
-              </div>
-              <div style="text-align: right;">
-                ${datum.layerLabel}
-              </div>
-              <div style="text-align: right; font-size: ${R.pathOr(12, ['secondary', 'fontSize'], fonts)}px;">
-                Value:
-                <span style="${secondaryFonts}">
-                  ${R.is(Function, datum.formater) ? datum.formater(datum.width) : valueFormatter(datum.width)}
-                </span>
-              </div>
-              <div style="text-align: right; font-size: ${R.pathOr(12, ['secondary', 'fontSize'], fonts)}px;">
-                Cumulated:
-                <span style="${secondaryFonts}">
-                  ${R.is(Function, datum.formater) ? datum.formater(datum.x) : valueFormatter(datum.x)}
-                </span>
-              </div>
-            </div>
-          `)
-        })
-      ],
-      [
-        R.always(R.equals(CHORO, type)),
-        R.mergeRight({
-          layout: (serie, datum, color) => (`
-            <div style="${primaryFonts(color)}">
-              <div style="text-align: right;">
-                ${R.pathOr('', ['properties', 'label'], datum)}
-              </div>
-              <div style="text-align: right;">
-                ${R.pathOr('', ['properties', 'category'], datum)}
-              </div>
-              <div style="text-align: right; ${secondaryFonts}">
-                ${R.pipe(R.pathOr(null, ['properties', 'value']), valueFormatter)(datum)}
-              </div>
-            </div>
-          `)
-        })
-      ],
-      [R.T, R.identity]
-    ])
-  )(options);
-};

package/src/rules/src/constants.js

@@ -1,29 +0,0 @@
-export const BAR = 'BarChart';
-export const ROW = 'RowChart';
-export const SCATTER = 'ScatterChart';
-export const TIMELINE = 'TimelineChart';
-export const H_SYMBOL = 'HorizontalSymbolChart';
-export const V_SYMBOL = 'VerticalSymbolChart';
-export const STACKED_BAR = 'StackedBarChart';
-export const STACKED_ROW = 'StackedRowChart';
-export const CHORO = 'ChoroplethChart';
-export const PERCENT = 'percent';
-export const VALUES = 'values';
-export const TYPES = {
-  [BAR]: BAR,
-  [ROW]: ROW,
-  [SCATTER]: SCATTER,
-  [TIMELINE]: TIMELINE,
-  [H_SYMBOL]: H_SYMBOL,
-  [V_SYMBOL]: V_SYMBOL,
-  [STACKED_BAR]: STACKED_BAR,
-  [STACKED_ROW]: STACKED_ROW,
-  [CHORO]: CHORO,
-};
-
-export const OBS_TYPE_NUMBER = 'OBS_TYPE_NUMBER';
-export const OBS_TYPE_NUMERICAL_STRING = 'OBS_TYPE_NUMERICAL_STRING';
-export const OBS_TYPE_STRING = 'OBS_TYPE_STRING';
-export const REPORTING_YEAR_START_DAY = 'REPORTING_YEAR_START_DAY';
-export const REPYEARSTART = 'REPYEARSTART';
-

package/src/rules/src/date.js

@@ -1,112 +0,0 @@
-import * as R from 'ramda';
-import * as dateFns from 'date-fns';
-import { fr, de, enUS as en, es, ar, it, nl, th } from 'date-fns/locale';
-
-
-const isValidDate = period =>
-  R.and(dateFns.isDate, date => R.not(R.equals(date.getTime(date), NaN)))(new Date(period));
-
-export const dateWithoutTZ = date => dateFns.addMinutes(date, date.getTimezoneOffset());
-
-export const getLocale = R.cond([
-  [R.equals('fr'), R.always(fr)],
-  [R.equals('de'), R.always(de)],
-  [R.equals('es'), R.always(es)],
-  [R.equals('ar'), R.always(ar)],
-  [R.equals('it'), R.always(it)],
-  [R.equals('nl'), R.always(nl)],
-  [R.equals('th'), R.always(th)],
-  [R.T, R.always(en)]
-]);
-
-const formaterPeriod = (locale, format) => date => dateFns.format(date, format, { locale: getLocale(locale) });
-
-export const getReportedTimePeriodLabel = (freq, _format, locale) => (reportYearStart, { id, start, reportedStart }) => {
-  const year = dateFns.getYear(start);
-  const reportStartDate = new Date(year, reportYearStart.month, reportYearStart.day);
-  const isReportFirstDate = dateFns.isEqual(reportStartDate, new Date(year, 1, 1));
-  if (isReportFirstDate || freq === 'D') {
-    return R.isNil(_format) || freq !== 'M'
-      ? id : dateFns.format(start, _format, { locale: getLocale(locale) });
-  }
-  const nextYear = year + 1;
-  if (freq === 'A') {
-    return `${year}/${nextYear}`;
-  }
-  if (freq === 'S') {
-    const [semester] = R.match(/S\d/, id);
-    return `${year}/${nextYear}-${semester}`;
-  }
-  if (freq === 'Q') {
-    const [quarter] = R.match(/Q\d/, id);
-    return `${year}/${nextYear}-${quarter}`;
-  }
-  if (freq === 'M') {
-    const isFirstDayOfMonth = dateFns.isFirstDayOfMonth(reportedStart);
-    if (isFirstDayOfMonth) {
-      return R.isNil(_format) ? id : dateFns.format(reportedStart, _format, { locale: getLocale(locale) });
-    }
-    const [month] = R.match(/M[\d]{2}/, id);
-    return `${year}/${nextYear}-${month}`;
-  }
-  const [week] = R.match(/W[\d]{2}/, id)
-  return `${year}/${nextYear}-${week}`;
-};
-
-export const getReportedTimePeriod = (reportYearStart, value, freq) => {
-  let start = new Date(R.prop('start', value));
-  let end = dateWithoutTZ(new Date(R.prop('end', value)));
-  if(reportYearStart.month === '01' && reportYearStart.day === '01') {
-    return ({ start, end });
-  }
-  start = dateFns.addMonths(start, reportYearStart.month - 1);
-  start = dateFns.addDays(start, reportYearStart.day - 1);
-  if (freq === 'A') {
-    end = dateFns.addYears(start, 1);
-  }
-  if (freq === 'S') {
-    end = dateFns.addMonths(start, 6);
-  }
-  if (freq === 'Q') {
-    end = dateFns.addMonths(start, 3);
-  }
-  if (freq === 'M') {
-    end = dateFns.addMonths(start, 6);
-  }
-  if (freq === 'W' || freq === 'B') {
-    end = dateFns.addDays(start, 7);
-  }
-  if (freq === 'D') {
-    end = dateFns.addDays(start, 1);
-  }
-  if (freq === 'H') {
-    end = dateFns.addHours(start, 1);
-  }
-  if (freq === 'N') {
-    end = dateFns.addMinutes(start, 1);
-  }
-  end = dateFns.subSeconds(end, 1);
-  return ({ start, end });
-};
-
-export const getReportedTimePeriodNote = (reportYearStart, start, end, freq) => {
-  if(reportYearStart.month === '01' && reportYearStart.day === '01') {
-    return null;
-  } 
-  if (R.includes(freq, ['D', 'H', 'N'])) {
-    return null;
-  }
-  const isFirstDayOfMonth = dateFns.isFirstDayOfMonth(start);
-  if (freq === 'M' && isFirstDayOfMonth) {
-    return null;
-  }
-  const formatedStart = dateFns.format(start, 'yyyy-MM-dd');
-  const formatedEnd = dateFns.format(end, 'yyyy-MM-dd');
-  return ({ value: { name: `${formatedStart} - ${formatedEnd}` } });
-};
-
-
-export const getTimePeriodLabel = (locale, format = 'yyyy MMM') => R.pipe(
-  R.when(R.isNil, R.always('')),
-  R.when(isValidDate, formaterPeriod(locale, format)),
-);

package/src/rules/src/dimension-utils.js

@@ -1,56 +0,0 @@
-import * as R from 'ramda';
-
-export const parseDisplay = (display) =>
-  (R.isNil(display) || !(R.includes(display, ['both', 'code'])))
-    ? 'label' : display;
-
-export const dimensionValueDisplay =
-  (display, accessors = {}) =>
-  (dimensionValue) => {
-    const id = R.propOr('', accessors.id || 'id', dimensionValue);
-    const name = R.propOr('', accessors.name || 'name', dimensionValue);
-    // a non-coded component (dim | attr) has no name, names nor label
-    // the only valid thing to display is the id
-    if (R.propOr(false, 'isNonCoded', dimensionValue))
-      return id;
-    //auto-generated flags have no id nor name
-    if (R.isEmpty(id) && R.isEmpty(name))
-      return ''
-    switch (display) {
-      case 'label':
-        return R.isEmpty(name) ? `[${id}]` : name;
-      case 'code':
-        return id;
-      case 'both':
-        if (R.isNil(id) || R.isEmpty(id))
-          return name;
-        return `(${id}) ${name}`;
-      default:
-        return null;
-    }
-  };
-
-export const dimensionValueDisplayAt = (dimension, index, display) => {
-  const dimensionValue = R.pathOr({}, ['values', Number(index)], dimension);
-  return dimensionValueDisplay(display)(dimensionValue);
-};
-
-export const categoryDisplay = (
-  splitObservationKey,
-  dimensions,
-  dimensionsWithValuesIndexedById,
-  rejectedId,
-  display,
-) => {
-  return R.pipe(
-    R.addIndex(R.reduce)((acc, dimensionValueIndex, dimensionIndex) => {
-      const dimension = R.nth(dimensionIndex, dimensions) || {};
-      if (R.has(dimension.id, dimensionsWithValuesIndexedById)
-        && dimension.id !== rejectedId) {
-        return R.append(dimensionValueDisplayAt(dimension, dimensionValueIndex, display), acc);
-      }
-      return acc;
-    }, []),
-    R.join(' - ')
-  )(splitObservationKey);
-};

package/src/rules/src/factories/choro-series.js

@@ -1,76 +0,0 @@
-import * as R from 'ramda';
-import { getRefAreaDimension } from '@sis-cc/dotstatsuite-sdmxjs';
-import { categoryDisplay, dimensionValueDisplay } from '../dimension-utils';
-
-const parseByAreas = (observations, refAreaDimension) => {
-  if (R.isNil(refAreaDimension)) {
-    return null;
-  }
-  const { __index, values=[] } = refAreaDimension;
-
-  return R.pipe(
-    R.keys,
-    R.reduce((acc, key) => {
-      const value = observations[key];
-      const splitedKey = R.split(':', key);
-      const areaValueIndex = Number(R.nth(__index, splitedKey));
-      const areaValue = isNaN(areaValueIndex)
-        ? null : R.nth(areaValueIndex, values);
-      const areaId = R.prop('id', areaValue || {});
-      return R.over(
-        R.lensProp(areaId),
-        vals => R.append({ splitedKey, value, areaValueIndex }, vals || []),
-        acc
-      ); 
-    }, {})
-  )(observations);
-};
-
-export default ({ observations, dimensions }, dimensionsWithValuesIndexedById, topoMap, display) => {
-  const refAreaDimension = getRefAreaDimension({ dimensions });
-  const observationsByAreas = parseByAreas(observations, refAreaDimension);
-  const topology = R.propOr({}, 'topology', topoMap);
-  const areaSelection = R.propOr(null, 'areaSelection', topoMap);
-  const topoAreas = R.pathOr(null, ['objects', areaSelection], topology);
-  if (!observationsByAreas || !topoAreas) {
-    return null;
-  }
-  const topoAreasWithData = R.map(
-    (areaGeometry) => {
-      const areaObservation = R.pipe(
-        R.pathOr(null, ['properties', 'id']),
-        id => R.propOr([], id, observationsByAreas),
-        R.head
-      )(areaGeometry);
-      const areaValueIndex = R.propOr(null, 'areaValueIndex', areaObservation);
-      const areaValue = R.pathOr(null, ['values', areaValueIndex], refAreaDimension);
-      return {
-        ...areaGeometry,
-        properties: {
-          ...R.propOr({}, 'properties', areaGeometry),
-          label: dimensionValueDisplay(display)(areaValue),
-          value: R.head(R.propOr([], 'value', areaObservation)),
-          category: categoryDisplay(
-            R.propOr([], 'splitedKey', areaObservation),
-            dimensions,
-            dimensionsWithValuesIndexedById,
-            refAreaDimension.id,
-            display
-          ),
-        }
-      };
-    },
-    topoAreas.geometries,
-  );
-  return ({
-    objects: {
-      areas: {
-        type: topoAreas.type,
-        geometries: topoAreasWithData
-      }
-    },
-    arcs: topology.arcs,
-    bbox: topology.bbox,
-    transform: topology.transform
-  });
-}

package/src/rules/src/factories/focus.js

@@ -1,17 +0,0 @@
-import sampleFocus from './sample-focus';
-import scatterFocus from './scatter-focus';
-import timelineFocus from './timeline-focus';
-
-export default ({ type, series, focusOptions }) => {
-  switch(type) {
-    case 'ScatterChart':
-      return scatterFocus(series, focusOptions);
-    case 'TimelineChart':
-      return timelineFocus(series, focusOptions);
-    case 'BarChart': case 'RowChart': case 'StackedBarChart':
-    case 'StackedRowChart': case 'HorizontalSymbolChart': case 'VerticalSymbolChart':
-      return sampleFocus(series, focusOptions);
-    default:
-      return series;
-  }
-};

package/src/rules/src/factories/getChartSeries.js

@@ -1,8 +0,0 @@
-import getFocusedSeries from './focus';
-import getSeries from './series';
-
-export const getChartSeries = ({ type, data, options, singularity, focusOptions }) => {
-  const chartSeries = getSeries({ type, data, options, singularity });
-  const focusedSeries = getFocusedSeries({ type, series: chartSeries, focusOptions });
-  return focusedSeries;
-};

package/src/rules/src/factories/sample-focus.js

@@ -1,18 +0,0 @@
-import * as R from 'ramda';
-
-export default function focus(series, focusSelections) {
-  const { highlight = [], baseline = [] } = focusSelections || {};
-  if (R.isEmpty(highlight) && R.isEmpty(baseline)) {
-    return series;
-  }
-
-  return R.over(
-    R.lensPath([0, 'datapoints']),
-    R.map(dp => ({
-      ...dp,
-      highlightIndex: R.findIndex(R.propEq(dp.key, 'value'), highlight),
-      baselineIndex: R.path([0, 'value'], baseline) === dp.key ? 0 : -1
-    })),
-    series || []
-  );
-}

package/src/rules/src/factories/sample-series.js

@@ -1,51 +0,0 @@
-import * as R from 'ramda';
-import { categoryDisplay } from '../dimension-utils';
-import { getFormatedObservation } from '../observation-formater';
-
-const getDatapoints = (
-  keys, observations, dimensions, dimensionsWithValuesIndexedById, sortDirection, display, formaterAttrs
-) => {
-  const [categoryKey, valueKey] = keys;
-  const sortFunc =  dp => dp[valueKey] * sortDirection;
-
-  return R.pipe(
-    R.keys,
-    R.map((observationKey) => {
-      const observationValue = R.prop(observationKey, observations);
-      const value = R.head(observationValue);
-      const splitKey = R.split(':', observationKey);
-      const category = categoryDisplay(splitKey, dimensions, dimensionsWithValuesIndexedById, null, display);
-      const categoryIds = categoryDisplay(splitKey, dimensions, dimensionsWithValuesIndexedById, null, 'code');
-      const formatedValue = getFormatedObservation(observationValue, formaterAttrs);
-
-      let key = categoryIds;
-      if (R.isNil(key) || R.isEmpty(key)) {
-        key = 'uniq-dp';
-      }
-
-      return { value, category, [valueKey]: value, [categoryKey]: category, key, formatedValue };
-    }),
-    R.sortBy(sortFunc)
-  )(observations);
-};
-
-const series = (
-  keys, observations, dimensions, dimensionsWithValuesIndexedById, sortDirection, display, formaterAttrs
-) => {
-  return [{
-    datapoints: getDatapoints(
-      keys, observations, dimensions, dimensionsWithValuesIndexedById, sortDirection, display, formaterAttrs
-    )
-  }]
-};
-
-export default (chartType, { observations, dimensions }, dimensionsWithValuesIndexedById, display, formaterAttrs) => {
-  switch(chartType) {
-    case 'BarChart':
-      return series(['x', 'y'], observations, dimensions, dimensionsWithValuesIndexedById, 1, display, formaterAttrs);
-    case 'RowChart':
-      return series(['y', 'x'], observations, dimensions, dimensionsWithValuesIndexedById, -1, display, formaterAttrs);
-    default:
-      return [];
-  }
-};

package/src/rules/src/factories/scatter-focus.js

@@ -1,25 +0,0 @@
-import * as R from 'ramda';
-
-export default function focus(series, focusSelections) {
-  const { highlight = [], baseline = [] } = focusSelections || {};
-  if (R.isEmpty(highlight) && R.isEmpty(baseline)) {
-    return series;
-  }
-
-  return R.over(
-    R.lensPath([0, 'datapoints']),
-    R.map(dp => {
-      const isFocusMatch = f => {
-        const focusedDim = R.path(['options', 'dimensionId'], f);
-        const dpValId = R.path(['dimensionValues', focusedDim, 'id'], dp);
-        return dpValId === R.path(['options', 'dimensionValueId'], f);
-      }
-      return ({
-        ...dp,
-        highlightIndex: R.findIndex(isFocusMatch, highlight),
-        baselineIndex: R.head(baseline) && isFocusMatch(R.head(baseline)) ? 0 : -1
-      })
-    }),
-    series
-  );
-};