@qrvey/utils 1.2.9-14 → 1.2.9-18

package/src/filters/interfaces/ui/index.ts

@@ -19,7 +19,8 @@ export * from './IFUDataset';
 export * from './IFUFilter';
 export * from './IFUFilterExtras';
 export * from './IFUFlattenedFilter';
-export * from './IFUScope';
 export * from './IFUParamsToGetFilter';
-export * from './IFUValue';
+export * from './IFUScope';
+export * from './IFUTransformFilterValuesSettings';
 export * from './IFUUIValueSettings';
+export * from './IFUValue';

package/src/format/definition.ts

@@ -55,3 +55,48 @@ export function supportNumericFormatting(chartType: ChartType): boolean {
   }
 
 export const isTextColumn = (column: any): boolean => textFields.includes(column.type) || column.formulaType === 'string' || column.formulaType === 'boolean';
+
+export const currencyISO = [
+  { text: 'Default', label: 'USD' },
+  { text: '$ (USD)', label: 'USD' },
+  { text: '€ (EUR)', label: 'EUR' },
+  { text: '¥ (JPY)', label: 'JPY' },
+  { text: '£ (GBP)', label: 'GBP' },
+  { text: '₩ (WON)', label: 'WON' },
+  { text: '$ (AUD)', label: 'AUD' },
+  { text: '$ (CAD)', label: 'CAD' },
+  { text: 'CHF (CHF)', label: 'CHF' },
+  { text: '¥ (CNY)', label: 'CNY' },
+  { text: 'kr (SEK)', label: 'SEK' },
+  { text: '$ (MXN)', label: 'MXN' },
+  { text: '$ (NZD)', label: 'NZD' },
+  { text: '$ (SGD)', label: 'SGD' },
+  { text: '$ (HKD)', label: 'HKD' },
+  { text: 'kr (NOK)', label: 'NOK' },
+  { text: '₩ (KRW)', label: 'KRW' },
+  { text: '₺ (TRY)', label: 'TRY' },
+  { text: '₹ (INR)', label: 'INR' },
+  { text: '₽ (RUB)', label: 'RUB' },
+  { text: 'R$ (BRL)', label: 'BRL' },
+  { text: 'R (ZAR)', label: 'ZAR' },
+  { text: 'kr (DKK)', label: 'DKK' },
+  { text: 'zł (PLN)', label: 'PLN' },
+  { text: 'NT$ (TWD)', label: 'TWD' },
+  { text: '฿ (THB)', label: 'THB' },
+  { text: 'RM (MYR)', label: 'MYR' }
+];
+
+export const enum LOCALE_FORMATS {
+  DECIMAL = 'Decimal',
+  CURRENCY = 'Currency',
+  PERCENTAGE = 'Percentage',
+  SCIENTIFIC = 'Scientific',
+}
+export const enum LOCALE_STYLES {
+  DECIMAL = 'decimal',
+  PERCENT = 'percent',
+  CURRENCY = 'currency',
+  SCIENTIFIC = 'scientific',
+}
+
+export const LANG_DEFAULT = 'en-US';

package/src/format/format.ts

@@ -6,6 +6,8 @@ import { isEmpty } from '../general/mix/isEmpty';
 import { _get } from '../general/object/get';
 import { COLUMN } from '../columns/constants/COLUMN';
 import { FORMULA } from '../formulas/constants/FORMULA';
+import { IFormatConfig } from '..';
+import { formatWithLocale } from './localization';
 
 dayjs.extend(advancedFormat); // Add support to advanced formats https://day.js.org/docs/en/plugin/advanced-format
 
@@ -82,22 +84,24 @@ export function formatFileSize(bytes: number): string {
     return megaBytes < 10 ? `${fixDecimals(megaBytes)} MB` : `${Math.round(megaBytes)} MB`;
 }
 
-export const formatValue = (value: any, outputFormat: any = 'None', config?): any => {
-    if (isEmpty(value) || typeof value === 'object' && isEmpty(value[0])) return value;
-    switch (outputFormat.type) {
-        case 'DATE':
-        case 'DATETIME':
-            return formatDate(value, outputFormat.format);
-        case 'NUMERIC': {
-            const parse = parseFloat(value);
-            return isNaN(parse) ? value : formatNumber(parse, outputFormat, config);
-        }
-        case 'IMAGEUPLOAD':
-        case 'FILEUPLOAD':
-            return formatFileSize(parseFloat(value));
-        default:
-            return typeof value === 'number' ? value.toFixed(0) : value;
+export const addFormat = (value: any, outputFormat: any = 'None', config?: IFormatConfig): any => {
+  if (isEmpty(value) || typeof value === 'object' && isEmpty(value[0])) return value;
+  switch (outputFormat.type) {
+    case 'DATE':
+    case 'DATETIME':
+      return config?.lang && outputFormat.format === 'Default' ? formatWithLocale(value, outputFormat, config) : formatDate(value, outputFormat.format);
+    case 'NUMERIC': {
+      const parse = parseFloat(value);
+      const withLocale = outputFormat.format !== 'Abbreviated' && outputFormat !== 'None' && config?.lang;
+      return isNaN(parse) ? value : withLocale ? formatWithLocale(value, outputFormat, config)
+       : formatNumber(parse, outputFormat, config);
     }
+    case 'IMAGEUPLOAD':
+    case 'FILEUPLOAD':
+      return formatFileSize(parseFloat(value));
+    default:
+      return typeof value === 'number' ? value.toFixed(0) : value;
+  }
 };
 
 export const parseFormulaType = (type: string) => {

package/src/format/index.ts

@@ -1 +1,2 @@
 export * from './format';
+export * from './localization';

package/src/format/localization.ts

@@ -0,0 +1,52 @@
+import { IFormatConfig, IFormatOutputFormat } from '../interfaces';
+import { currencyISO, LOCALE_FORMATS, LOCALE_STYLES, LANG_DEFAULT } from './definition';
+
+export const getLang = (locale: string | Record<string, any>) => {
+    if (!locale) return;
+    else if(typeof locale === 'object') return locale;
+    else return { lang: locale === "browser" ? window.navigator.language : locale };
+};
+
+export const formatWithLocale = (value: any, outputFormat: IFormatOutputFormat, config: IFormatConfig = {}): any => {
+    switch (outputFormat.type) {
+      case 'DATE':
+      case 'DATETIME':
+        return formatLocaleDate(value, config);
+      case 'NUMERIC':
+        return formatLocaleNumber(value, outputFormat, config);
+    }
+};
+
+function formatLocaleDate(value: any, config: IFormatConfig) {
+    const { lang = LANG_DEFAULT, options } = config;
+    const dateParam = new Date(value);
+    try {
+        return new Intl.DateTimeFormat([lang, LANG_DEFAULT], options).format(dateParam);
+    } catch (error) {
+        return new Intl.DateTimeFormat(LANG_DEFAULT, options).format(dateParam);
+    }
+}
+
+function formatLocaleNumber(value: any, outputFormat: IFormatOutputFormat, config: IFormatConfig,) {
+    const { lang = LANG_DEFAULT, options } = config;
+    const langOpts = options || getLocaleOptions(outputFormat);
+    try {
+        return new Intl.NumberFormat([lang, LANG_DEFAULT], langOpts).format(value);
+    } catch (e) {
+        return new Intl.NumberFormat(LANG_DEFAULT, langOpts).format(value);
+    }
+}
+
+function getLocaleOptions(outputFormat: IFormatOutputFormat) {
+    const { format, decimals, currency, backup_currency } = outputFormat;
+    switch(format) {
+        case LOCALE_FORMATS.CURRENCY: {
+            const iso = currencyISO.find(item => item.text === (currency.text || backup_currency.text));
+            return { style: LOCALE_STYLES.CURRENCY, currency: iso.label, maximumFractionDigits: decimals, minimumFractionDigits: 0 };
+        }
+        case LOCALE_FORMATS.SCIENTIFIC: return { style: LOCALE_STYLES.DECIMAL,
+             notation: LOCALE_STYLES.SCIENTIFIC, maximumFractionDigits: decimals };
+        case LOCALE_FORMATS.PERCENTAGE: return { style: LOCALE_STYLES.PERCENT, maximumFractionDigits: decimals };
+        default: return { style: LOCALE_STYLES.DECIMAL, maximumFractionDigits: decimals };
+    }
+}

package/src/globalization/helpers/getI18nCalendar.ts

@@ -0,0 +1,68 @@
+import { II18nCalendarProperties } from "../interfaces/calendar/II18nCalendarProperties";
+import { II18nServiceTranslate } from "../interfaces/II18nServiceTranslate";
+import { I18nService } from "../service/i18nextBuilder";
+
+export function getI18nCalendar(locale: I18nService | II18nServiceTranslate): II18nCalendarProperties {
+    const localeOverride = locale instanceof I18nService ? locale : typeof locale === 'function' ? { translate: locale } : undefined;
+    if (!localeOverride) return undefined;
+
+    return {
+      clear: localeOverride.translate('common.calendar.clear'),
+      days: [
+        localeOverride.translate('common.day_names.sunday_dddd'), 
+        localeOverride.translate('common.day_names.monday_dddd'), 
+        localeOverride.translate('common.day_names.tuesday_dddd'), 
+        localeOverride.translate('common.day_names.wednesday_dddd'), 
+        localeOverride.translate('common.day_names.thursday_dddd'), 
+        localeOverride.translate('common.day_names.friday_dddd'),
+        localeOverride.translate('common.day_names.saturday_dddd')
+      ],
+      daysMin: [
+        localeOverride.translate('common.day_names.sunday_dd'), 
+        localeOverride.translate('common.day_names.monday_dd'), 
+        localeOverride.translate('common.day_names.tuesday_dd'), 
+        localeOverride.translate('common.day_names.wednesday_dd'), 
+        localeOverride.translate('common.day_names.thursday_dd'), 
+        localeOverride.translate('common.day_names.friday_dd'),
+        localeOverride.translate('common.day_names.saturday_dd')
+      ],
+      daysShort: [
+        localeOverride.translate('common.day_names.sunday_ddd'), 
+        localeOverride.translate('common.day_names.monday_ddd'), 
+        localeOverride.translate('common.day_names.tuesday_ddd'), 
+        localeOverride.translate('common.day_names.wednesday_ddd'), 
+        localeOverride.translate('common.day_names.thursday_ddd'), 
+        localeOverride.translate('common.day_names.friday_ddd'),
+        localeOverride.translate('common.day_names.saturday_ddd')
+      ],
+      months: [
+        localeOverride.translate('common.date_grouping.january_mmmm'), 
+        localeOverride.translate('common.date_grouping.february_mmmm'), 
+        localeOverride.translate('common.date_grouping.march_mmmm'), 
+        localeOverride.translate('common.date_grouping.april_mmmm'), 
+        localeOverride.translate('common.date_grouping.may_mmmm'), 
+        localeOverride.translate('common.date_grouping.june_mmmm'),
+        localeOverride.translate('common.date_grouping.july_mmmm'),
+        localeOverride.translate('common.date_grouping.august_mmmm'),
+        localeOverride.translate('common.date_grouping.september_mmmm'),
+        localeOverride.translate('common.date_grouping.october_mmmm'),
+        localeOverride.translate('common.date_grouping.november_mmmm'),
+        localeOverride.translate('common.date_grouping.december_mmmm')
+      ],
+      monthsShort: [
+        localeOverride.translate('common.date_grouping.january_mmm'), 
+        localeOverride.translate('common.date_grouping.february_mmm'), 
+        localeOverride.translate('common.date_grouping.march_mmm'), 
+        localeOverride.translate('common.date_grouping.april_mmm'), 
+        localeOverride.translate('common.date_grouping.may_mmm'), 
+        localeOverride.translate('common.date_grouping.june_mmm'),
+        localeOverride.translate('common.date_grouping.july_mmm'),
+        localeOverride.translate('common.date_grouping.august_mmm'),
+        localeOverride.translate('common.date_grouping.september_mmm'),
+        localeOverride.translate('common.date_grouping.october_mmm'),
+        localeOverride.translate('common.date_grouping.november_mmm'),
+        localeOverride.translate('common.date_grouping.december_mmm')
+      ],
+      today: localeOverride.translate('common.calendar.today')
+    };
+}

package/src/globalization/helpers/index.ts

@@ -1,2 +1,3 @@
+export * from './getI18nCalendar';
 export * from './getI18nDateGroupLabel';
 export * from './getReverseI18nGroupLabel';

package/src/globalization/interfaces/calendar/II18nCalendar.ts

@@ -0,0 +1,7 @@
+export interface II18nCalendar {
+    clear: string;
+    hours: string;
+    minutes: string;
+    seconds: string;
+    today: string;
+}

package/src/globalization/interfaces/calendar/II18nCalendarProperties.ts

@@ -0,0 +1,9 @@
+export interface II18nCalendarProperties {
+    clear: string;
+    days: string[];
+    daysMin: string[];
+    daysShort: string[];
+    months: string[];
+    monthsShort: string[];
+    today: string;
+}

package/src/globalization/interfaces/calendar/index.ts

@@ -0,0 +1,2 @@
+export * from './II18nCalendar';
+export * from './II18nCalendarProperties';

package/src/globalization/interfaces/chart_builder/II18nChartBuilderFontOptions.ts

@@ -1,9 +1,11 @@
 export interface II18nChartBuilderFontOptions {
+    automatic_resize: string;
     color: string;
+    disabled: string;
+    select_option_placeholder: string;
+    size: string;
     style: string;
-    style_regular: string;
     style_bold: string;
     style_italic: string;
-    automatic_resize: string;
-    size: string;
+    style_regular: string;
 }

package/src/globalization/interfaces/common/II18nCommon.ts

@@ -5,9 +5,11 @@ import { II18nColumnTypesSuffixes } from "./II18nColumnTypesSuffixes";
 import { II18nDateGrouping } from "./II18nDateGrouping";
 import { II18nDayNames } from "./II18nDayNames";
 import { II18nUnits } from "./II18nUnits";
+import { II18nCalendar } from "../calendar/II18nCalendar";
 
 export interface II18nCommon {
     aggregate_labels: II18nAgreggateLabels;
+    calendar: II18nCalendar;
     column_types: II18nColumnTypes;
     column_types_suffixes: II18nColumnTypesSuffixes;
     date_grouping: II18nDateGrouping;

package/src/globalization/interfaces/common/II18nDayNames.ts

@@ -1,4 +1,12 @@
 export interface II18nDayNames {
+    sunday_dd: string;
+    monday_dd: string;
+    tuesday_dd: string;
+    wednesday_dd: string;
+    thursday_dd: string;
+    friday_dd: string;
+    saturday_dd: string;
+
     sunday_ddd: string;
     monday_ddd: string;
     tuesday_ddd: string;

package/src/globalization/interfaces/filters/II18nFilter.ts

@@ -7,6 +7,7 @@ import { II18nFilterOperator } from "./II18nFilterOperator";
 import { II18nFilterScopes } from "./II18nFilterScopes";
 import { II18nFilterPanelScopeTitle } from "./II18nFilterPanelScopeTitle";
 import { II18nFilterDateSections } from "./II18nFilterDateSections";
+import { II18nTokenBox } from './II18nTokenBox';
 
 export interface II18nFilter {
     date_sections: II18nFilterDateSections;
@@ -16,6 +17,7 @@ export interface II18nFilter {
     scope_title: II18nFilterPanelScopeTitle;
     scopes: II18nFilterScopes;
     slidebar: II18nSlidebar;
+    token_box?: II18nTokenBox;
     validators: II18nFilterValidator;
     value_container: II18nValueContainer;
 }

package/src/globalization/interfaces/filters/II18nTokenBox.ts

@@ -0,0 +1,6 @@
+export interface II18nTokenBox {
+  data_tokens?: string;
+  search?: string;
+  system_tokens?: string;
+  user_tokens?: string;
+}

package/src/globalization/interfaces/index.ts

@@ -1,4 +1,5 @@
 export * from './bucket_builder/index';
+export * from './calendar/index';
 export * from './chart_builder/index';
 export * from './columns/index';
 export * from './common/index';

package/src/globalization/labels/calendar/I18N_CALENDAR.ts

@@ -0,0 +1,9 @@
+import { II18nCalendar } from "../../interfaces/calendar/II18nCalendar";
+
+export const I18N_CALENDAR: II18nCalendar = {
+  clear: "Clear",
+  hours: 'Hours',
+  minutes: 'Minutes',
+  seconds: 'Seconds',
+  today: "Today"
+};

package/src/globalization/labels/calendar/index.ts

@@ -0,0 +1 @@
+export * from './I18N_CALENDAR';

package/src/globalization/labels/chart_builder/I18N_CHART_BUILDER_LAYER_OPTIONS.ts

@@ -3,7 +3,7 @@ import { II18nChartBuilder } from "../..";
 type LayerOptions = 'trends_line' | 'references_line';
 export const I18N_CHART_BUILDER_LAYER_OPTIONS: Pick<II18nChartBuilder, LayerOptions> = {
     trends_line: {
-        title: 'Trends line',
+        title: 'Trend Line',
         type: 'Type',
         type_none: 'None',
         type_standard_linear_regression: 'Standard Linear Regression',

package/src/globalization/labels/chart_builder/I18N_CHART_BUILDER_STYLE_OPTIONS.ts

@@ -19,9 +19,9 @@ export const I18N_CHART_BUILDER_STYLE_OPTIONS: Pick<II18nChartBuilder, StyleOpti
         comparision_color: 'Comparision Color',
         data_labels_check: 'Data Labels',
         default_format_title: 'Format',
-        display_outliers_check: 'Display outliers',
+        display_outliers_check: 'Display Outliers',
         line_opacity: 'Line Opacity',
-        map_borders: 'Map borders',
+        map_borders: 'Map Borders',
         needle_color: 'Needle Color',
         opacity: 'Opacity',
         percentage_check: 'Percentage',
@@ -156,13 +156,15 @@ export const I18N_CHART_BUILDER_STYLE_OPTIONS: Pick<II18nChartBuilder, StyleOpti
         names_rotation: 'Names Rotation',
     },
     font_options: {
+        automatic_resize: 'Automatic Resize',
         color: 'Font Color',
+        disabled: '<i>Automatic Resize</i> is active, disable it to set the size manually.',
+        select_option_placeholder: 'Select Option',
+        size: 'Font Size',
         style: 'Font Style',
-        style_regular: 'Regular',
         style_bold: 'Bold',
         style_italic: 'Italic',
-        automatic_resize: 'Automatic Resize',
-        size: 'Font Size',
+        style_regular: 'Regular',
     },
     circle_size: {
         title: 'Circle Size',
@@ -186,7 +188,7 @@ export const I18N_CHART_BUILDER_STYLE_OPTIONS: Pick<II18nChartBuilder, StyleOpti
         target_value: 'Target Value'
     },
     table_style_options: {
-        typeface: 'Typeface', // used
+        typeface: 'Typeface', 
         weight: 'Weight',
         weight_bold: 'Bold',
         weight_normal: 'normal',

package/src/globalization/labels/common/I18N_COMMON.ts

@@ -1,5 +1,6 @@
 import { RELATIVE_UNIT_INFO } from "../../../dates/relative/constants/RELATIVE_UNIT_INFO";
 import { II18nCommon } from "../../interfaces/common/II18nCommon";
+import { I18N_CALENDAR } from "../calendar";
 import { I18N_AGGREGATE_LABEL } from "./I18N_AGGREGATE_LABEL";
 import { I18N_COLUMN_LABEL } from "./I18N_COLUMN_LABEL";
 import { I18N_COLUMN_PROPERTY_LABEL } from "./I18N_COLUMN_PROPERTY_LABEL";
@@ -8,6 +9,7 @@ import { I18N_DAY_NAMES } from "./I18N_DAY_NAMES";
 
 export const I18N_COMMON: II18nCommon = {
     aggregate_labels: I18N_AGGREGATE_LABEL,
+    calendar: I18N_CALENDAR,
     column_types: I18N_COLUMN_LABEL,
     column_types_suffixes: {
         slidebar_one: 'Step',

package/src/globalization/labels/common/I18N_DAY_NAMES.ts

@@ -4,6 +4,14 @@ import { capitalize } from "../../../general/string/capitalize";
 import { II18nDayNames } from "../../interfaces/common/II18nDayNames";
 
 export const I18N_DAY_NAMES: II18nDayNames = {
+    sunday_dd: capitalize(DATE_WEEK_DAYS[0].substring(0, 2)),
+    monday_dd: capitalize(DATE_WEEK_DAYS[1].substring(0, 2)),
+    tuesday_dd: capitalize(DATE_WEEK_DAYS[2].substring(0, 2)),
+    wednesday_dd: capitalize(DATE_WEEK_DAYS[3].substring(0, 2)),
+    thursday_dd: capitalize(DATE_WEEK_DAYS[4].substring(0, 2)),
+    friday_dd: capitalize(DATE_WEEK_DAYS[5].substring(0, 2)),
+    saturday_dd: capitalize(DATE_WEEK_DAYS[6].substring(0, 2)),
+
     sunday_ddd: capitalize(DATE_WEEK_DAYS[0]),
     monday_ddd: capitalize(DATE_WEEK_DAYS[1]),
     tuesday_ddd: capitalize(DATE_WEEK_DAYS[2]),

package/src/globalization/labels/filters/I18N_FILTER.ts

@@ -28,6 +28,12 @@ export const I18N_FILTER: II18nFilter = {
     },
     scopes: I18N_FILTER_SCOPE,
     slidebar: I18N_SLIDEBAR,
+    token_box: {
+        data_tokens: 'DataTokens',
+        search: 'Search',
+        system_tokens: 'SystemTokens',
+        user_tokens: 'UserTokens',
+    },
     validators: I18N_FILTER_VALIDATOR,
     value_container: I18N_VALUE_CONTAINER,
 };

package/src/globalization/labels/index.ts

@@ -1,4 +1,5 @@
 export * from './bucket_builder';
+export * from './calendar';
 export * from './chart_builder';
 export * from './columns';
 export * from './common';

package/src/interfaces/format/IFormatConfig.Interface.ts

@@ -0,0 +1,5 @@
+export interface IFormatConfig {
+    lang?: string;
+    options?: object;
+    isMultiplied?: boolean;
+}

package/src/interfaces/format/IFormatCurrency.Interface.ts

@@ -0,0 +1,4 @@
+export interface IFormatCurrency {
+    text: string;
+    label: string;
+}

package/src/interfaces/format/IFormatOutputFormat.Interface.ts

@@ -0,0 +1,9 @@
+import { IFormatCurrency } from "./IFormatCurrency.Interface";
+
+export interface IFormatOutputFormat {
+    format: string;
+    type: string;
+    decimals?: number;
+    currency?: IFormatCurrency;
+    backup_currency?: IFormatCurrency;
+}

package/src/interfaces/format/index.ts

@@ -0,0 +1,3 @@
+export * from './IFormatConfig.Interface';
+export * from './IFormatOutputFormat.Interface';
+export * from './IFormatCurrency.Interface';

package/src/interfaces/general/IGeneralWidgetConfig.ts

@@ -3,8 +3,10 @@ export interface IGeneralWidgetConfig {
     apiKey?: string;
     qrveyid?: string;
     qv_token?: string;
+    locale?: string;
     timezoneControl?: string;
     isFromAN?: boolean;
     appid: string;
     userid: string;
+    lang?: string;
 }

package/src/interfaces/index.ts

@@ -2,3 +2,4 @@ export * from './Chart.Interface';
 export * from './IChartBuilder.Interface';
 export * from './general';
 export * from './Qrvey.Interface';
+export * from './format';

package/src/qrvey/helpers/getValueWithSuffixes.ts

@@ -0,0 +1,19 @@
+import { isEmpty } from "../../general/mix/isEmpty";
+import { isNaNV2 } from "../../general/mix/isNaNV2";
+import { IGetValueWithSuffixesSettings } from "../interfaces/IGetValueWithSuffixesSettings";
+
+/**
+ * Get a string value with suffixes if available.
+ * Add suffix into the value string. Prioritized for numeric values.
+ * @param value a number or string
+ * @param suffixes An object with singular or plural suffix string.
+ * @returns a string value with suffix
+ */
+export function getValueWithSuffixes(value: string | number, settings: IGetValueWithSuffixesSettings): string {
+    let suffix = '';
+    if (!isNaNV2(value)) {
+        if (!isEmpty(settings.suffixTranslateLabel) && !isEmpty(settings.translate)) suffix = settings.translate(settings.suffixTranslateLabel, { count: +value });
+        if (!isEmpty(settings.suffixes)) suffix = (+value > 1 || +value === 0) ? settings.suffixes.plural : settings.suffixes.singular;
+    }
+    return value + (!isEmpty(suffix) ? ' ' + suffix : '');
+}

package/src/qrvey/helpers/index.ts

@@ -1,2 +1,4 @@
 export * from './getColumnsLabel';
 export * from './getPropertyLabel';
+export * from './getValueWithSuffixes';
+export * from './transformValue';

package/src/qrvey/helpers/transformValue.ts

@@ -0,0 +1,47 @@
+import { isDateColumn } from "../../columns/helpers/isDateColumn";
+import { isNumericalColumn } from "../../columns/helpers/isNumericalColumn";
+import { IDateColumnPropertyType } from "../../columns/interfaces/IDateColumnPropertyType";
+import { DATE_GROUPING_PROPERTY } from "../../dates/constants/DATE_GROUPING_PROPERTY";
+import { DATE_GROUPING_TIME_PROPERTY } from "../../dates/constants/DATE_GROUPING_TIME_PROPERTY";
+import { addFormat } from "../../format/format";
+import { getI18nDateGroupLabel } from "../../globalization/helpers/getI18nDateGroupLabel";
+import { ITransformValueSettings } from "../interfaces/ITransformValueSettings";
+import { getValueWithSuffixes } from "./getValueWithSuffixes";
+
+/**
+ * Transforms a value depending of localization/globalization and extras settings.
+ * @param value A value to transform
+ * @param settings The settings of the transformValue function
+ * @returns A transformed value
+ */
+export function transformValue(value: string, settings: ITransformValueSettings): string {
+    const valueWithI18n = getI18nDateGroupLabel(value, settings.property as IDateColumnPropertyType, settings.translate);
+    
+    const valueWithLocalization = addFormat(valueWithI18n, getOutputFormat(settings), getFormatConfig(settings));
+    return getValueWithSuffixes(valueWithLocalization, { suffixTranslateLabel: settings.suffixTranslateLabel, translate: settings.translate });
+}
+
+/**
+ * Gets the outputformat settings
+ * @param settings The settings of the transformValue function
+ * @returns the outputformat settings
+ */
+function getOutputFormat(settings: ITransformValueSettings) {
+    let type, format;
+    if (isDateColumn(settings.column) && [DATE_GROUPING_PROPERTY.DAY, DATE_GROUPING_TIME_PROPERTY.HOUR, DATE_GROUPING_TIME_PROPERTY.MINUTE, DATE_GROUPING_TIME_PROPERTY.SECOND].includes(settings.property as any)) {
+        type = 'DATE';
+        format = 'Default';
+    } else if (isNumericalColumn(settings.column)) {
+        type = 'NUMERIC';
+    }
+    return { type, format };
+}
+
+/**
+ * Gets the format config
+ * @param settings The settings of the transformValue function
+ * @returns the format config
+ */
+function getFormatConfig(settings: ITransformValueSettings) {
+    return { lang: settings.locale };
+}

package/src/qrvey/interfaces/IGetValueWithSuffixesSettings.ts

@@ -0,0 +1,12 @@
+import { II18nServiceTranslate } from "../../globalization/interfaces/II18nServiceTranslate";
+
+export interface IGetValueWithSuffixesSettings {
+    translate?: II18nServiceTranslate; // Function for getting translations
+    suffixTranslateLabel?: string; // Label of the i18n path for translations
+    suffixes?: IGetValueWithSuffixesSettingsSuffixes; // Manual suffixes to add if the translate and the suffixes translate label is not present
+}
+
+interface IGetValueWithSuffixesSettingsSuffixes {
+    singular: string;
+    plural: string;
+}

package/src/qrvey/interfaces/ITransformValueSettings.ts

@@ -0,0 +1,12 @@
+import { IColumn } from "../../columns/interfaces/IColumn";
+import { IColumnPropertyType } from "../../columns/interfaces/IColumnPropertyType";
+import { II18nServiceTranslate } from "../../globalization/interfaces/II18nServiceTranslate";
+
+export interface ITransformValueSettings {
+    column: IColumn;
+    property: IColumnPropertyType;
+
+    translate: II18nServiceTranslate; // Function for getting translations
+    locale: string; // The locale string
+    suffixTranslateLabel?: string // The i18n label for the suffix values.
+}

package/src/qrvey/interfaces/index.ts

@@ -3,3 +3,5 @@ export * from './ICalculation';
 export * from './ICalculationInfo';
 export * from './ICalculationType';
 export * from './IDataset';
+export * from './IGetValueWithSuffixesSettings';
+export * from './ITransformValueSettings';

package/src/services/api/getDatasetColumns.api.ts

@@ -3,6 +3,8 @@ import { IDataset } from "../../qrvey/interfaces/IDataset";
 import { CHART_ENDPOINT } from "../constants/CHART_ENDPOINT";
 import Request from "../helpers/Request";
 import { BDatasetsToUIDatasets } from "../adapters/BDatasetsToUIDatasets.adapter";
+import { LANG_DEFAULT } from "../../format/definition";
+import { getLang } from "../..";
 
 /**
    * Get a dataset by Qrvey ID
@@ -10,10 +12,11 @@ import { BDatasetsToUIDatasets } from "../adapters/BDatasetsToUIDatasets.adapter
    * @returns a promise
    */
 export function getDatasetColumns(config: IGeneralWidgetConfig, qrveyid?: string): Promise<IDataset[]> {
+    const lang = getLang(config.lang || (<any>config.locale)?.lang || config.locale || LANG_DEFAULT).lang;
     return Request.post({ ...config, qrveyid, endpoint: CHART_ENDPOINT }, '/question/list', {
       'optionsAttributes': ['id', 'text', 'type', 'property', 'linked', 'linkid', 'qrveyid', 'bucketId', 'formulaId', 'formulaType', 'geogroup', 'outputFormat'],
       'extend': true
-    })
+    }, { lang })
     .then(BDatasetsToUIDatasets)
     .catch(_e => []);
 }